Shopify Header Section .liquid File
Worldwide
I need a custom Shopify header section (.liquid file) for Bound In Infinity — an anime, gaming, and pop culture wall art brand. Premium, minimal, clean. White background, black text/icons, thin black dividers, no gradients. ANNOUNCEMENT BAR Neon lime (#CCFF00) background, black centered uppercase text, default "BUY 2 GET 1 FREE" (editable). Height 28–36px desktop, 32–42px mobile. Close X button. Scrolls away on scroll. MOBILE HEADER Left: hamburger + search icons. Center: bold logo "BOUND IN INFINITY" (no wrap). Right: account + cart icons with black count bubble. Thin black border below. MOBILE HAMBURGER DRAWER Slides in from left, full-screen, white. Top: logo + X close. Below: horizontal shortcut icons with labels (merchant-editable). Then vertical nav links with chevrons: ALL WALL ART / WORLD / COLOR / SIZE / COLLECTION / BEST SELLERS. Below nav: secondary links (Login/Register, Gift Cards, Help). Optional promo banner image at bottom. Closes on X or outside tap. MOBILE SEARCH OVERLAY Full-screen white overlay. Top: pill search input with back arrow and X. Default state: "Popular searches" heading + tappable terms list (merchant-editable). Below: "Trending products" heading + 2-column product grid (image, name, subtitle). While typing: live autocomplete rows appear above trending products. MOBILE CATEGORY NAV BAR Below header. Horizontally scrollable, hidden scrollbar, no wrap. Uppercase black text. Default items: ALL WALL ART / BEST SELLERS / POKÉMON / ANIME / VIDEO GAMES / COMICS / FANTASY. Merchant-editable. DESKTOP HEADER Single row: logo left, nav center with dropdown chevrons, icons right (search, account, cart). Logo alignment setting (left or center). Thin black border below. Compact height. DESKTOP NAV DROPDOWNS (hover, fade animation, white panel): SHOP ALL — direct link. WORLD — mega menu. Left col: "Shop by Medium" with circular thumbnails + View All. Right col: "Shop by Style" with circular thumbnails + View All. Far right: featured image with "SHOP TRENDING DESIGNS" button overlaid. COLOR — mega menu. Three cols: Warm (Red, Orange, Yellow, Pink), Cool (Blue, Green, Purple), Neutrals (White, Black, Brown, Beige, Grey). Filled circle swatch per color. View All link. SIZE — mega menu. Four illustrated cards: Small / Medium / Large / XL Prints with line-art room illustrations. Plus black VIEW ALL card. COLLECTION — mega menu. Two large image cards side by side, collection name overlaid as large bold text. NEW badge option. Merchant-editable images and names. BEST SELLERS — direct link. No ROOM or THEME items. DESKTOP SEARCH Full-width overlay on click. Search input + popular searches + trending products grid. STICKY Header sticky by default. Announcement bar scrolls away. No layout shift. SETTINGS (all editable in theme editor) Announcement text, logo text or image, logo font size (mobile + desktop), nav font size, header padding, nav item spacing, icon spacing, mobile nav padding, logo alignment, sticky on/off. DELIVERABLE Single header.liquid file plus required CSS/JS that installs into any Shopify theme with live cart, search, nav, and account connected. Please share examples of Shopify headers with mega menus or mobile drawers you have built.
$75.00
Fixed-price- IntermediateExperience Level
- Remote Job
- One-time projectProject Type
Skills and Expertise
Activity on this job
- Proposals:15 to 20
- Last viewed by client:3 weeks ago
- Hires:1
- Interviewing:18
- Invites sent:27
- Unanswered invites:2
About the client
- USAElgin2:59 PM
- $566 total spent1 hire, 1 active
Explore similar jobs on Upwork
How it works
Create your free profileHighlight your skills and experience, show your portfolio, and set your ideal pay rate.
Work the way you wantApply for jobs, create easy-to-by projects, or access exclusive opportunities that come to you.
Get paid securelyFrom contract to payment, we help you work safely and get paid securely.
About Upwork
- 4.9/5(Average rating of clients by professionals)
- G2 2021#1 freelance platform
- 49,000+Signed contract every week
- $2.3BFreelancers 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