Shopify Develop to Build a Custom Zip-code-based Purchase Hub Page for Shopify Store

Posted 2 months ago

Worldwide

Summary

Here's the revised job post with all those characters removed: Shopify Developer Needed — Custom Zip-Based Purchase Hub Page with Store Locator, Buy with Prime & Countdown Timer Overview We need an experienced Shopify developer to build a custom interactive page on our Shopify store called the Purchase Hub. This is our primary purchase hub — it helps customers find the fastest way to get our product based on their location. The page already exists as a detailed design mockup. (HTML attached) Your job is to build it in Shopify and wire up the backend integrations. This is not a design project — all design decisions are finalized. You are executing a clear spec. What the page does The page shows a customer four ways to get our product, ranked by speed. When a customer lands on the page with no zip code entered, they see the default state. When they enter their zip code or allow location access, the page updates dynamically to show real availability results for their area. DEFAULT STATE — no zip entered The page shows four rows in a table layout: Row 1 — Same-day delivery Label: Same-day delivery Sub-label: DoorDash · GoPuff · CVS.com Status: Enter zip to check CTA: greyed out Check availability button Row 2 — Pick up in store Label: Pick up in store Sub-label: Available at select retailers Link below: Suggest a store — opens a form modal, described below Status: Enter zip to find stores CTA: greyed out Find stores button Row 3 — Amazon Label: Amazon Sub-label: Buy with Prime Shows: Buy with Prime widget — always active Delivery date: calculated from Amazon BWP API Row 4 — Company website — highlighted with light orange background Label: Company.com Sub-label: All products · best value Always shows: In stock · ships same day Always shows: calculated free delivery date — 3 business days out Note: Overnight available Countdown timer: Order in the next X:XX to ship today — based on 2pm EST cutoff CTA: Shop now button AFTER ZIP IS ENTERED When a customer enters their zip code and hits Go, or allows location access via the My location button, all four rows update dynamically: Row 1 — Same-day delivery Check the entered zip against a database of zip codes we provide If zip is in coverage area: show Available in your area plus active buttons for DoorDash, GoPuff, and CVS.com If zip is NOT in coverage area: show Not available in your area in muted text We will provide the list of covered zip codes in a CSV file This needs to be stored in a simple backend database or Shopify metafields that we can update ourselves without developer help going forward Row 2 — Pick up in store Connect to our existing store locator app already installed on our Shopify store Show the nearest store to the entered zip — store name, distance, hours CTA: Directions button linking to Google Maps directions If multiple stores are nearby: show nearest one with a See more link that expands to show additional results If no store within 25 miles: show No store within 25 miles and surface the Suggest a store link Row 3 — Amazon Buy with Prime widget showing calculated delivery date for the entered zip We have an Amazon seller account — developer will need to implement the BWP SDK Show: FREE delivery with day and date pulling from BWP delivery estimate Row 4 — Company website Always active regardless of zip Show real-time countdown timer to 2pm EST cutoff — Order in the next X:XX to ship today Delivery date: calculated 3 business days from today excluding weekends After 2pm EST: countdown resets to next business day cutoff ABOVE THE TABLE — ZIP ENTRY Full-width zip code input field Go button My location button — uses browser geolocation API to detect zip automatically Label above: FIND THE FASTEST WAY TO GET OUR PRODUCT TO YOU in small caps After zip is entered: show Results for — followed by the zip — as a confirmation below the input PAGE HEADER Above the zip entry, a branded banner showing: Company logo on the left Product tagline in the center Trust signals on the right: star rating · media mention · free shipping note SUGGEST A STORE — MODAL FORM When a visitor clicks Suggest a store, a modal overlay opens with a form. Fields: Store name — required Street address — required City — required State — required Zip code — required Phone number — optional Email address — optional — with note: We'll let you know if this store starts carrying our product Why is this a great fit — optional, open text field Submit button: Suggest this store On submission: Form data is sent to a Google Sheet we provide via Zapier webhook Notification email is sent to our internal stores team with all submitted fields Modal shows a thank-you confirmation: Thanks — we'll check it out No email is sent to the person who submitted the form We will set up the Zapier workflow ourselves — the developer just needs to wire the form to a webhook URL we provide SOCIAL LANDING PAGE VARIANTS Once the main Purchase Hub page is built, we need four additional pages that are identical to it except for a small hero section added above the zip entry. Each has a different URL: domain.com/get/tiktok domain.com/get/instagram domain.com/get/facebook domain.com/get/youtube Each variant has: A video embed — we provide the video URL per platform A short source label — for example: Seen on TikTok A headline — we provide per platform, one line A subhead — we provide per platform, one to two lines No navigation links — logo only in the header UTM parameters on each URL for analytics tracking Everything below the hero is identical to the main Purchase Hub page. TECHNICAL REQUIREMENTS Platform: Shopify running Retina 8.1 theme Store locator: Existing store locator app already installed. Developer connects it to Row 2 results. Buy with Prime: Developer implements Amazon BWP SDK. We have an Amazon seller account and will provide credentials. Same-day delivery zip database: Developer builds a simple admin-accessible database or uses Shopify metafields to store zip codes and coverage areas. We need to be able to add and remove zip codes ourselves without touching code. Countdown timer: Counts down to 2pm EST daily. Resets at 2pm to show next business day. Must account for weekends and US federal holidays — no shipping on those days. Suggest a store form: Standard HTML form posting to a Zapier webhook URL we provide. No complex backend needed. Mobile responsive: The page must work perfectly on mobile. On mobile, the four rows stack vertically and remain fully functional. Page navigation: This page has no standard site navigation. Header shows logo only. Footer shows minimal links — FAQs, Contact, Privacy. WHAT WE WILL PROVIDE The attached HTML mock-up shows the end goal fairly well — default, after zip entry, and mobile view All copy and text for every element on the page Platform-specific copy for all four social landing page variants Store locator app already installed with existing store locations loaded Amazon seller account access for BWP setup Zapier webhook URL for the suggest-a-store form Brand colors, fonts, and existing Shopify theme access WHAT WE DO NOT NEED Any design work — all design is finalized Any copywriting — all copy is written Any other pages — this is a single page build plus four simple variants IDEAL CANDIDATE Strong Shopify Liquid and JavaScript experience Experience with third-party API and SDK integrations including Amazon BWP and browser geolocation Experience embedding store locator apps in custom Shopify pages Has built interactive zip-based availability pages before Writes clean, commented code — we may need to maintain this ourselves Communicates clearly and delivers on timeline PROJECT SCOPE AND TIMELINE This is a focused, well-defined project. All design and copy decisions are made. A developer who has done similar work should be able to complete this in 5 to 10 business days. Please include in your proposal: Examples of similar interactive Shopify pages you have built Your estimated timeline Your fixed price or hourly rate with estimated hours Any questions about the spec before you begin BUDGET We are looking for a fixed price proposal based on this spec. Please do not bid if you cannot provide a fixed price — this project is too well-defined for open-ended hourly billing. Note to applicants: We have complete visual mockups, a detailed implementation brief, and all copy ready to share upon engagement. This project is ready to start immediately.

  • Less than 30 hrs/week
    Hourly
  • < 1 month
    Duration
  • Intermediate
    Experience Level
  • Remote Job
  • One-time project
    Project Type
Skills and Expertise
Mandatory skills
Custom Ecommerce Platform Development
Activity on this job
  • Proposals:10 to 15
  • Last viewed by client:last week
  • Hires:
    2
  • Interviewing:
    10
  • Invites sent:
    0
  • Unanswered invites:
    0
About the client
Member since Jan 20, 2023
  • United States
    Norristown2:49 PM
  • $5.8K total spent
    15 hires, 3 active
  • 298 hours
  • Individual client

Explore similar jobs on Upwork

WordPress Developer for Ecommerce WebsiteHourly‐ Posted 4 weeks ago
Web Development
WordPress
WooCommerce
Web Design
PHP
Ecommerce Website
WordPress Development
Shpat_ code shopifyHourly‐ Posted 4 weeks ago
Shopify
Shopify Plus
Shopify Apps
Shopify Development
Shopify Website Redesign
Shopify Theme
Shopify Website Design
Ecommerce Website
Ecommerce Site Setup
Ecommerce Store Setup
Ecommerce Website Development
Ecommerce
Ecommerce Performance Optimization
Set Up Shopify Site
Shopify Templates

How it works

  • Post a job icon
    Create your free profile
    Highlight your skills and experience, show your portfolio, and set your ideal pay rate.
  • Talent comes to you icon
    Work the way you want
    Apply for jobs, create easy-to-by projects, or access exclusive opportunities that come to you.
  • Payment simplified icon
    Get paid securely
    From contract to payment, we help you work safely and get paid securely.
Want to get started? Create a profile

About Upwork

  • Rating is 4.9 out of 5.
    4.9/5
    (Average rating of clients by professionals)
  • G2 2021
    #1 freelance platform
  • 49,000+
    Signed contract every week
  • $2.3B
    Freelancers earned on Upwork in 2020

Find the best freelance jobs

Growing your career is as easy as creating a free profile and finding work like this that fits your skills.

Trusted by

  • Microsoft Logo
  • Airbnb Logo
  • Bissell Logo
  • GoDaddy Logo