1. Project Overview

Sunny Auction .NET is a small family-owned estate auction business operating on WordPress using the Ultimate Auction Pro plugin. The client runs weekly catalogue-style auctions, listing items by Lot number within auction categories, and currently uses sunnyauction.net as their primary bidding platform.

The client requires three targeted enhancements to improve the bidding experience on the Live Auctions listing page:

  • A popup bid widget on each auction card, triggered by the “Place Bid” button, presenting an auto-populated suggested next bid, a quick-bid option, and a custom amount field — without requiring the bidder to navigate to the individual product page.
  • A reusable Lot Number field on each auction product, allowing the client to assign and display catalogue lot numbers that can be reused across future auctions (unlike WooCommerce SKU, which enforces global uniqueness).
  • An Admin Enable / Disable toggle to turn the popup widget on or off directly from the WordPress admin settings panel — no code changes required.

This proposal covers the full scope of all three enhancements, including design, development, testing, and deployment.

  1. Customer Requirements
  2. Popup Bid Widget — Live Auction Listing Page (Option C)

On the Live Auctions listing page, each auction product card retains its existing “Place Bid” button. When a bidder clicks the button, a popup modal opens directly on the page containing:

  • Item thumbnail, Lot number, and product title
  • Current high bid and bid count
  • Live countdown timer (Days / Hours / Min / Sec)
  • Auto-populated Suggested Next Bid amount (Current High Bid + Configured Bid Increment)
  • Quick Bid button — places the suggested amount immediately via AJAX
  • Custom bid amount input field — pre-filled with the suggested amount, editable
  • Place Bid button — submits the custom amount via AJAX

Bidders can place bids directly from the listing view without leaving the page or opening the product detail page.

  1. Auto-Populate Next Bid Amount

When the popup opens, the system must automatically calculate and pre-fill the next valid bid:

  • Suggested Bid = Current High Bid + Configured Bid Increment
  • Example: High bid $100.00 + Increment $10.00 = Suggested $110.00
  • Bidder may accept via Quick Bid or manually enter a higher custom amount
  1. Lot Number — Custom Product Meta Field

The client organises each auction catalogue using Lot numbers. The WooCommerce SKU field cannot be reused across auctions due to its global uniqueness constraint.

  • Custom Lot Number field on the WooCommerce product edit page
  • Non-unique — same lot numbers can be reused across different auction categories
  • Displayed as a badge on the listing card and on the product detail page
  • Auctions distinguished by WooCommerce category; Lot Number is for catalogue identification only
  1. Admin Enable / Disable Toggle for Popup Widget

A dedicated on/off switch added to the WordPress admin (Auctions → Settings → Display tab, under Shop Page Setting) to allow the site administrator to enable or disable the popup bid widget without touching any code:

  • Checkbox: “Enable Popup Bid Widget on Live Auction Listing Page”
  • Stored as WordPress option uwa_enable_popup_bid_widget (values: yes / no)
  • When disabled, the listing page falls back to the standard “Place Bid” behaviour (direct product page link)
  • Positioned below the existing “Enable Timer” checkbox — consistent with the plugin’s existing Display settings layout

Our Recommendation: The popup approach (Option C) adds no meaningful overhead versus inline bidding (Option B). The popup is rendered entirely client-side; the only server call is the AJAX bid submission, identical in both options. Option C is recommended — it provides a clean listing layout, a confirmation step before bidding, and a better mobile experience.

  1. Design Mockup — Listing Page, Popup & Admin Toggle

Final wireframes and design mockups will be prepared based on your website’s existing setup, branding, and design prior to development commencement.

For mocup design refer docuemnt. 

Note: Wireframes will be designed based on your website’s existing setup and design — colours, fonts, and layout matched to sunnyauction.net (Be Vietnam Pro typeface, #002050 navy, #3140E2 blue buttons, #3C763D timer green). Final mockups will be shared for approval before development begins.

  1. Technical Approach

4.1 Popup Bid Widget — Live Auction Listing Page

  • Override the WooCommerce product loop template to inject a popup-triggering “Place Bid” button on each auction card
  • Build a JavaScript popup/modal component bound to each card’s bid button click event
  • On open, read current high bid and configured increment from DOM data attributes, auto-calculate and pre-fill the suggested next bid
  • Quick Bid and Place Bid both submit via the existing Ultimate Auction Pro AJAX bid endpoint — no changes to core bidding logic
  • Live countdown timer in popup synced with the card-level countdown
  • CSS scoped to auction product cards only — no impact on regular WooCommerce shop products
  • Fully responsive — popup adapts for desktop, tablet, and mobile viewports

4.2 Auto-Populate Next Bid Amount

  • Retrieve current high bid and bid increment per product from existing plugin data attributes on the listing page
  • Calculate: Suggested Bid = Current High Bid + Bid Increment
  • Pre-fill the popup bid input on open; input remains editable for bidder override
  • Suggestion recalculates on each subsequent popup open after a successful bid

4.3 Lot Number — Custom Product Meta Field

  • Register custom meta field _lot_number via WooCommerce’s woocommerce_product_options_general_product_data hook
  • Field added to product edit page under the Auction Data / General tab in WooCommerce admin
  • Saved to post_meta on product save — no uniqueness validation applied
  • Displayed as an overlay badge on the listing card image thumbnail
  • Displayed on the single auction product detail page
  • Compatible with existing plugin templates and theme layout

4.4 Admin Enable / Disable Toggle

  • Add checkbox “Enable Popup Bid Widget on Live Auction Listing Page” to Display settings tab (Auctions → Settings → Display → Shop Page Setting)
  • Stored as WordPress option uwa_enable_popup_bid_widget via update_option() / get_option() — follows existing plugin settings convention
  • Frontend popup initialisation reads this option (passed via wp_localize_script) and conditionally activates or disables the popup behaviour
  • When disabled, the “Place Bid” button falls back to standard WooCommerce product page navigation

Server Performance Note: The popup widget introduces no additional server load. All popup content is rendered client-side from data already present on the listing page. The only server request is the bid submission itself, using the existing AJAX endpoint unchanged. Option C (popup) is equivalent to Option B (inline) in server resource consumption.

  1. Effort — Design & Development

5.1 Popup Bid Widget — Live Auction Listing Page

  • Audit existing auction loop template and plugin bid form output on sunnyauction.net
  • Build custom template override — popup-triggered “Place Bid” button per auction card
  • Develop JavaScript popup component: open/close, animation, keyboard accessibility (Esc to close)
  • Implement auto-populate logic: calculate and pre-fill suggested next bid on open
  • Wire Quick Bid and Place Bid to the existing AJAX bid submission endpoint
  • Inject live countdown timer into popup, synced with card-level countdown
  • Responsive CSS — desktop, tablet, mobile

Estimated effort: 12 hours

5.2 Lot Number — Custom Product Meta Field

  • Register _lot_number custom meta field on the product edit page
  • Save and retrieve field value on product save
  • Display Lot number badge on auction listing card thumbnail
  • Display Lot number on the single auction product page
  • Verify correct display with reused lot numbers across multiple auctions

Estimated effort: 4 hours

5.3 Admin Enable / Disable Toggle

  • Add checkbox setting to uwa_display_setting_tab.php under Shop Page Setting section
  • Save option via update_option / get_option following plugin convention
  • Pass setting to frontend via wp_localize_script
  • Conditionally enable / disable popup JS on listing page based on setting value

Estimated effort: 2 hour

5.4 Performance & Responsive Testing

  • Cross-browser testing (Chrome, Firefox, Safari, Edge) on desktop and mobile
  • Verify bid placement (Quick Bid and custom amount) via AJAX from the popup
  • Verify AJAX bid submission, success/error states, and countdown timer behaviour
  • Verify Lot number field saves, displays, and reuses correctly across products and auctions
  • Verify admin toggle enables / disables popup correctly with no side effects

Estimated effort: 3 hours

6. Effort Snapshot


Deliverable
Hours
Popup Bid Widget — Live Auction Listing Page (template, popup JS, AJAX, timer) 12
Auto-Populate Next Bid — Suggest high bid + increment on popup open Included
Admin Enable / Disable Toggle — WordPress Display settings checkbox 2
Lot Number — Custom Product Meta Field (admin UI + listing card + product page) 4
Performance & Responsive Testing 3
TOTAL BILLABLE HOURS 21
  1. Deliverables

The following deliverables will be provided as part of this engagement:

  • Popup bid widget on the Live Auctions listing page — triggered by the “Place Bid” button on each auction card
  • Auto-populated suggested next bid amount in the popup (Current High Bid + Bid Increment)
  • Quick Bid button — one-click bid at the suggested amount, submitted via AJAX
  • Custom bid amount input — pre-filled, bidder-editable, submitted via Place Bid button (AJAX)
  • Live countdown timer displayed inside the popup (Days / Hours / Min / Sec)
  • Admin enable / disable toggle for popup widget — Auctions → Settings → Display → Shop Page Setting
  • Lot Number custom meta field on the WooCommerce product edit page — reusable, non-unique
  • Lot number badge displayed on auction listing card thumbnails
  • Lot number displayed on the single auction product detail page
  • All bid placements functional via AJAX — no page reload required
  • Responsive layout across all components — desktop, tablet, and mobile
  • Tested and deployed on the client’s server (sunnyauction.net)
  1. Commercials & Payment

Project Cost

  • Total Estimated Effort: 21 hours (billable)
  • Hourly Rate: USD 45 / hour
  • Total : USD 945
  • Discount : 10%

Total Cost: USD 850.50