Vertex Theme Settings Reference
Every option under Theme settings in the Customizer, explained in plain language.
To open them: in the Customizer, click the cogwheel icon at the bottom-left labeled Theme settings. You'll see seven panels stacked in the left sidebar.
Typographyโ
Set the fonts used across your entire storefront. Two pickers: one for headings, one for body text. Both default to Poppins (bold for headings, regular for body).
| Setting | What it does |
|---|---|
| Heading font | Used for every heading on every page, plus marketing-section headlines. |
| Body font | Used for body copy, navigation, buttons, form fields, and prices. |
Vertex preloads both fonts so they're ready before first paint. Pick one font and use different weights for the fastest page load.
Colorsโ
This panel controls your entire color scheme. Start with a one-click preset, then fine-tune individual colors if you like.
Starter color paletteโ
A single dropdown that re-colors the entire storefront in one click.
| Option | Industry | Accent |
|---|---|---|
| Custom | Any | Use the individual color pickers below |
| Vertex amber | Industrial / MRO supply (default) | Amber |
| Throttle red | Auto parts | Red-orange |
| OfficeIT blue | Office & IT supply | Blue |
| Inkline teal | Print supplies | Teal |
Custom palette (only used when starter palette is set to Custom)โ
Each color is exposed as its own picker so you can match a brand spec exactly.
- Background โ the main page background and drawer background
- Surface โ card backgrounds and panel backgrounds
- Surface alternate โ a subtle secondary surface
- Text โ primary text color
- Muted text โ eyebrows, labels, captions
- Borders โ card borders and dividers
- Accent โ your brand color for CTAs and badges
- Accent dark โ hover and active state on accent buttons
- Accent soft โ a soft tint for accent-tinted backgrounds
- Text on accent โ the text and icon color placed on accent-filled buttons and badges. Keep it high-contrast against Accent dark (default white)
- Success โ used on "In stock" and approval badges
Starter palettes side-by-sideโ
Here's how the four presets look on the same homepage โ pick the one that fits your brand and ship.
| Vertex amber (default) | Throttle red | OfficeIT blue | Inkline teal |
|---|---|---|---|
 |  |  |  |
Section color schemes (3 schemes per section)โ
In addition to the sitewide palette above, every section in Vertex has its own Color scheme dropdown with three options. Pick whichever feels right for that one section without touching your global palette:
- Light โ light background, dark text. The standard look for most sections.
- Dark โ dark background, light text. Great for hero bands, CTAs, and footer-style anchor strips that need to stand out on a light page.
- Accent โ your accent color fills the background; text and CTAs adapt to stay legible. Use it sparingly on one band per page (e.g., a NET-30 promo strip or an end-of-page CTA) so it actually grabs attention.
Each scheme redraws the entire section โ background, text, borders, button color, badge color, hover states โ so the section stays internally consistent no matter which one you pick.
To use them: open Customize โ click any section โ find the Color scheme dropdown near the top of its settings, and pick one of the three.
On long landing pages, alternate Light and Dark every few sections โ it creates a natural visual rhythm with no custom CSS. Use Accent once near the top (hero) or once near the bottom (final CTA) as a punctuation mark.
Layoutโ
Controls page width, spacing, and a few sitewide toggles.
| Setting | What it does | Default |
|---|---|---|
| Page width | Narrow, Standard, or Wide. Affects the maximum content width on every page. | Narrow |
| Page side padding | Horizontal breathing room (16โ60 px slider). | 28 px |
Header behaviourโ
| Setting | What it does | Default |
|---|---|---|
| Sticky header on scroll | Pins the main header to the top of the viewport as buyers scroll. | On |
Cart behaviourโ
| Setting | What it does | Default |
|---|---|---|
| Cart layout | Slide-out drawer (recommended for B2B quick-adds) or Dedicated cart page. | Drawer |
Utilitiesโ
| Setting | What it does | Default |
|---|---|---|
| Show 'Back to top' button | A floating button after one full screen of scroll. | On |
| Show 'Recently viewed' on product pages | Tracks up to 12 products per buyer in their browser. | On |
B2Bโ
The control center for everything B2B-related โ Storefront mode, login-gated pricing, and which product-page enhancements show.
Storefront modeโ
| Option | What it does | Best for |
|---|---|---|
| Hybrid (auto) (default) | Auto-detects: B2C-friendly defaults for guests, B2B chrome for signed-in business buyers. | Most merchants โ accepts both audiences. |
| B2B-only | Hides B2C-friendly defaults. | Wholesale-only merchants. |
| B2C-only | Suppresses every B2B element even for signed-in business buyers. | When the same theme runs on a sister B2C store. |
โ Deep dive: Storefront modes guide
Pricing visibilityโ
| Setting | What it does | Default |
|---|---|---|
| Hide prices until customer logs in | Replaces prices with "Log in to see pricing" for guests. | Off |
Product page sectionsโ
These toggles control which extra blocks render on the product page when the supporting data is filled in.
| Setting | What it does |
|---|---|
| Show price history on PDP | Renders a "Price history" disclosure when product data is filled in. |
| Show 'Ships from' on PDP | Surfaces a "Ships from" label under the product title. Falls back to the default location below. |
| Default 'Ships from' location | Used when a product doesn't have its own ships-from value. Leave blank to skip. |
| Show 'Documents & downloads' on PDP | Renders a downloads block when datasheets, MSDS, brochures, or install guides are attached. Auto-hides per product when no documents exist. |
| Show variant swatches | Turns color/image option values into clickable swatch chips on the product page. When off, options render as plain dropdowns everywhere. |
Assign a color or image to an option value in your Shopify admin and Vertex shows it as a clickable chip automatically โ no theme setup needed. An accessible dropdown stays in place underneath for keyboard and screen-reader users.
Localizationโ
Controls reading direction. Most stores can leave this on Auto.
| Setting | Options | Default |
|---|---|---|
| Text direction | Auto (locale-driven) / Left to right / Right to left | Auto |
Vertex flips the layout automatically for Arabic, Hebrew, Farsi, Urdu, Yiddish, Kurdish, Dhivehi, and Pashto. Set to Left to right or Right to left only if you need to force it for a specific use case.
SEO & sharingโ
Fill in your brand assets, social card defaults, and Google Shopping defaults here. Everything in this panel feeds the meta tags and structured data emitted on every page.
Brand assetsโ
| Setting | Recommended size |
|---|---|
| Favicon | 32 ร 32 PNG. Leave blank to use the bundled Vertex brand mark. |
Social cardsโ
| Setting | Recommended size |
|---|---|
| Default share image (OG / Twitter) | 1200 ร 630 px. |
| Twitter / X handle | Without the @. |
Social profile URLsโ
These URLs are exposed to Google as your verified social profiles. Fill in any you have:
- LinkedIn URL, Twitter / X URL, Facebook URL, Instagram URL, YouTube URL
Google Merchant / Shopping defaultsโ
| Setting | Notes |
|---|---|
| Default ship-from country (ISO code) | Two-letter code (US, GB, DE, etc.) |
| Default shipping rate (numeric) | Use 0 for free shipping |
| Handling time โ min / max (days) | 0โ14 days |
| Transit time โ min / max (days) | 0โ30 days |
| Return window (days) | 0โ180 days |
| Return method | By mail / In store / Keep product |
| Return shipping fees | Free return shipping / Customer pays |
Business infoโ
Your company details. These feed the sitewide Organization and LocalBusiness data that Google uses to build your Knowledge Panel and Maps listing.
| Setting | Format | Example |
|---|---|---|
| Phone (E.164 preferred) | International format with country code | +1-216-555-0182 |
| Phone hours | Free text | Mon-Fri 7am-6pm CST |
| Street address | โ | 1500 W Industrial Pkwy |
| City / locality | โ | Cleveland |
| State / region code | 2-letter region code | OH |
| Postal / ZIP code | โ | 44113 |
| Country (ISO code) | 2-letter country code | US |
| Founding year | 4-digit year | 2014 |
Filling these out populates the Organization and LocalBusiness data on every page โ the same data Google uses to build your Knowledge Panel and Maps listing.
Where each panel appliesโ
| Panel | Affects |
|---|---|
| Typography | Every page โ body + headings |
| Colors | Every page โ background, text, accent |
| Layout | Every page โ max-width, padding, sticky header |
| B2B | B2B chrome (amber bar, RFQ, bulk order) + pricing visibility |
| Localization | Reading direction on every page |
| SEO & sharing | Meta tags + structured data on every page |
| Business info | Organization + LocalBusiness data on every page |
Next stepsโ
- Section setup guides โ โ Configure each section block
- Storefront modes guide โ โ Hybrid / B2B-only / B2C-only deep dive
- B2B setup guide โ โ Companies, catalogs, NET-terms