Glide — theme manual

Glide is a Shopify theme by Viora Tech. This is the manual for the person who runs the shop. It assumes you can find your way around the Shopify admin. It assumes nothing about code, and you will not need to write any.

Examples throughout are from an imaginary shop that sells running shoes and trail kit. Nothing in the theme is tied to that, or to any other trade.

1. Install, and the first five minutes #

Install Glide from the Shopify Theme Store. It arrives in Online Store > Themes as a theme in your library, not as your live theme. Nothing changes for your shoppers until you publish it.

Click Customize to open the theme editor. Everything in this manual is done there unless it says otherwise.

Do these five things first, in this order. They take about five minutes and they are the ones that look wrong if you skip them.

1. Upload your logo. Theme settings > Logo > Logo image. Set Logo width to whatever suits your mark — 140 px is the default and is right for a wordmark; a square badge usually wants less.

If you intend to offer dark mode (section 5), upload a Logo image (dark mode) too — a light version of the same mark. If you leave it empty the theme paints your ordinary logo solid white in dark mode, so it stays visible, but your brand colour is lost.

2. Upload a favicon. Theme settings > Logo > Favicon image. A square image; Shopify scales it to 32 × 32 px. This is the little icon in the browser tab.

3. Set your colours. Theme settings > Colors. See section 2 — this is the one setting that changes the look of the whole store, so it is worth ten minutes on its own.

4. Pick your fonts. Theme settings > Typography. Two pickers, heading and body. See section 4.

5. Check the header menu and the footer. Click the header in the preview. The navigation uses your existing Shopify menus (Content > Menus in the admin), so if your menu was right on your old theme it is right here. Then scroll to the footer and set the columns you want.

Then walk the store in the preview: home, a collection, a product, the cart. Publish when you are happy. If something looks wrong, it is almost always a section setting rather than a bug — but if it is a bug, see section 11.

2. Colour schemes #

Glide does not have "a background colour" and "a text colour". It has colour schemes. A scheme is a complete set of colours that work together. You define the schemes once, and then every section on every page picks one of them.

This is why the theme can put a pale band, a dark band and a bright promo band on the same page without you ever picking a colour twice.

What is in a scheme #

Theme settings > Colors. Each scheme has eight colours:

Every background has a partner foreground, so text can never end up invisible if you change one colour and forget the other.

How many schemes, and what for #

Shopify gives you a set of schemes to start with, numbered. The theme ships four useful ones, and you can add more.

A typical shop uses:

• Scheme 1 — your default. White or near-white ground, dark text. This is what a section uses unless you tell it otherwise, and it is what most of the store will be.
• Scheme 2 — the dark one. Near-black ground, off-white text. Used for the announcement bar, a dark story band, and — if you turn dark mode on — for the whole store when a visitor switches to dark.
• Scheme 3 — a soft alternative. A warm off-white, a hair different from scheme 1, so you can alternate bands down a long home page without the page looking striped.
• Scheme 4 — the loud one. Your accent colour as the ground, with dark text. For a sale band or a single promo strip. Use it once per page at most.

How a section picks one #

Every section in Glide has a Colour scheme setting, near the bottom of its settings, under a heading called "Colour and spacing". Click the section in the editor, scroll down, pick a scheme. That is the whole mechanism.

Two things worth knowing:

• The default is scheme 1. A section you have never touched uses scheme 1 and follows the page.
• An explicit choice sticks in dark mode. If you set a promo band to scheme 4, it stays scheme 4 when a visitor flips to dark mode. That is deliberate: you chose that band's colour on purpose, and the theme does not overrule you.

Two colours that are not in a scheme #

Theme settings > Shared colours holds Success and Danger — the green of "Added to cart" and the red of "Out of stock". They are the same in every scheme. This is on purpose. A scheme should not be able to make an error message green.

Choosing colours that pass #

Shopify's accessibility rules — and plain readability — want body text at 4.5:1 contrast against its background, and large text and buttons at 3:1. The easiest way to get this wrong is a mid-tone brand colour with white text on it: a mid purple with white text is a common failure. If your primary button is a mid-tone, use near-black button text rather than white. Any free contrast checker will tell you in a second.

3. Padding #

Every section has Top padding and Bottom padding, in the same "Colour and spacing" group as the colour scheme. They run from 0 to 100 px. The default is 40 px on each.

Use them for rhythm, not for fixing a layout:

• Two sections that belong together — a heading band and the grid it introduces — read as one thing if you set the first section's bottom padding to 0 and leave the second's top padding alone.
• A section that should feel like a breath in a long page can go to 80 or 100.
• A full-bleed image band usually wants 0 on both, so the image runs edge to edge and top to bottom.

Padding does not scale down on phones automatically beyond what the theme's own CSS does. If a home page feels airy on desktop and endless on a phone, the fix is usually fewer sections rather than less padding.

4. Typography #

Theme settings > Typography.

Heading font and Body font are Shopify font pickers. Every font in Shopify's library is available, including the ones Shopify hosts for free. The theme ships with Archivo for headings and Figtree for body. Glide does not accept custom uploaded fonts — Theme Store themes are not allowed to, and in practice Shopify's library is large enough.

Pick two faces, not five. The most reliable pairing is one distinctive heading face and one plain, wide-set body face.

Heading size (80–150 %) scales every heading in the store at once. If your heading font runs large — many geometric sans faces do — drop it to 90 %. If you have picked something narrow and want more presence, push it to 110 %. Changes here ripple through every section, so make the change and then walk the store rather than judging it on one page.

Body text size (14–20 px) sets the base body size. 16 px is the default and is the right answer for most shops. Going below 15 px makes long product descriptions hard work on a phone.

Load a Japanese fallback font is off by default and should stay off unless your product names or content use Japanese. On, it loads Noto Sans JP from Google Fonts so kanji and kana get one consistent face instead of whatever the visitor's device happens to have. It costs an extra font download on every page, which is why it is a choice and not a default.

5. Dark mode #

Theme settings > Dark mode > Offer a dark mode. Off by default.

Turned on, two things happen:

1. A light/dark switch appears in the footer.
2. The store follows the visitor's device setting on their first visit. Someone whose phone is in dark mode lands on a dark store.

Dark pages use colour scheme 2. So if you turn dark mode on, scheme 2 stops being "the dark band section" and becomes "the whole store, for some visitors" — go and check it properly. Look at the buttons in particular; the mid-tone button-on-dark combination is where contrast usually fails.

Sections you have explicitly set to a scheme keep that scheme in both modes, as described in section 2.

If you have not uploaded a dark-mode logo, do it now (section 1).

Leaving dark mode off is a perfectly good decision. It is a feature for shops whose customers expect it, not an obligation.

6. The rest of the theme settings #

Motion & shape #

• Show breadcrumbs (on by default). Adds a link trail — Home › Trail shoes › Cascade GTX — at the top of collection, product, page, blog, article and search pages. It also emits the matching structured data, so Google can show the same path under your result. Leave it on.
• Rounded section sheets (on). Rounds the top corners of the page and of panel sections so they read as sheets stacking as you scroll. Most visible when the announcement bar uses a dark scheme.
• Media parallax on scroll (on). Large images drift gently as you scroll. Pure CSS — visitors who have asked their device for reduced motion see still images, and so do browsers that do not support it.

Product cards #

These govern every product card in the store: collection grids, featured rows, related products.

• Hover images per card (1–4, default 3). How many extra images the cursor slides through when someone hovers a card. Also how many progress bars appear. More images means more for the browser to load on a busy grid — see section 10.
• Image indicator — how a card shows which of its images you are looking at. Six options: a sliding thumb on a rail, dots, story-style segments, a vertical rail on the right edge, mini thumbnails, or none.
• Product image background — the panel your product photos sit on.
• Blend out white photo backgrounds (on). If your product photos are shot on solid white with no transparency, the white square otherwise just covers the panel colour. This multiplies the photo into the panel so the white disappears. Turn it off if pale products start losing their edges — a white running shoe on a pale panel is exactly the case that goes wrong.
• Hide the repeated brand name on brand collections (on). On a collection named after a brand — say a collection called "Hoka" where every product title starts with "Hoka" — the first word every shopper scans is the one word every card shares. This drops that leading name from the titles on those collections only. The full title is still used for the link and for screen readers.

Cart #

Empty-cart recommendations collection. Shown as "Bestsellers" in the cart drawer and cart page whenever the cart is empty. Products appear in the collection's own sort order. If you want a genuine best-selling order, pick a collection that is sorted by Best selling, or make an automated collection that uses that sort. Leave it blank and the theme falls back to all products.

Social media #

Four URL fields — Instagram, Discord, YouTube, Twitter/X. Fill in the ones you use; the icons for the empty ones do not render.

7. The sections #

A section is a horizontal band of the page. You add, reorder and remove them in the theme editor. Glide has around 70 you can add, plus the page bodies and the header and footer.

They are grouped below the way the editor groups them, so the heading you read here is the heading you click there. Every section in this list has the colour scheme and padding settings from sections 2 and 3, so those are not repeated.

Banners #

Announcement bar. A thin strip above the header, for one message — free-shipping threshold, a sale, a dispatch delay. Two display modes: a static line, or a scrolling marquee if you have several messages. Give it the dark scheme and it becomes the store's top edge rather than a strip stuck on top.

Hero carousel. The home page's opening. A horizontal track of image or video slides, each with its own heading, subheading, up to two buttons, text alignment, an optional whole-slide link, and an optional countdown to a date. It works with JavaScript off — the first slide is visible and the track can be swiped — and adds autoplay, dots and arrows when JavaScript runs. Use one to three slides. Five slides means four slides nobody sees.

Countdown timer. Heading, subtext, a row of days/hours/minutes/seconds tiles, and a button. Built for a launch date or a sale deadline. Use it for a real deadline only; a countdown that resets is the kind of false urgency Shopify's rules forbid and shoppers notice.

Promo banners. One to three editorial columns — image in a light box, kicker, heading, text, button — equal width, stacking to one column on a phone. The workhorse for "three things we want you to look at".

Promo bento. An editorial mosaic of promo tiles, each an image with an optional eyebrow, title and subtitle burnt into its lower-left corner. Unlike Bento categories, every tile carries its own size, so you compose the mosaic yourself. It renders both a text-led promo grid and a pure-image mosaic depending on whether you fill in the text.

Tilted image banner. A full-bleed field of angled image rows that drift as the page scrolls, with a tagline, heading and copy over the top. A mood piece. It needs six or more images to work; with three it looks like a mistake.

Reveal banner. An image or video that uncovers itself as the section comes into view, with copy either laid over it or set beside it. Good once on a page.

Scrolling text. One oversized line in your heading face, drifting horizontally as the page scrolls. No JavaScript at all — it is scrubbed to scroll position in CSS. A divider with a voice.

Featured release. A single-product spotlight: two columns on desktop — image about 58 %, content about 42 % — stacked on a phone. Up to four typed spec lines and an optional countdown. It renders nothing until you pick a product, so it can sit in your home page permanently and appear when you have something to launch.

Unboxing reveal. A scroll-scrubbed reveal: the section pins to the screen for roughly two screens of scrolling while a box opens and the products come out. Scrolling back up reverses it exactly. Point it at a collection. Impressive once per store; exhausting twice. Note: the box face carries your logo from theme settings. If you have not uploaded one, see section 11 and the release notes — this is the one place a missing logo is visibly wrong.

Products #

Featured products. A counted rail of product cards from a collection you pick. On a phone it is a horizontal scroll-snap row showing about 1.2 cards, so it is obvious there is more to the right; on desktop it is a grid.

Tabbed products. One product grid with a row of tabs above it — New arrivals / Bestsellers / Sale, or any set of collections you add. Puts a lot more product on the home page without adding a lot more sections. Three or four tabs is the useful range.

Related products. Shopify's own product recommendations, on the product page. Shopify decides what is related, from your catalogue and your shop's behaviour; there is nothing to curate. There is a setting to switch this section to complementary recommendations instead — the "goes with" list rather than the "similar to" list — which is the right choice for a second row lower down the page.

Complete the set. A manual cross-sell row: you pick up to four products, one per block, shown as product cards. Unlike Related products this is entirely your choice. Hidden completely when you have picked nothing. Use it where you know the answer — trail shoe, then gaiters, then the sock.

Product bundle. Two to four products you pick, shown as a row of compact cards, each with an include/exclude checkbox, a running total, and one "Add bundle to cart" button. Unchecking a card removes it from the total and from the add. Everything checked goes to the cart in a single call.

Comparison table. Two to four products side by side against a list of spec rows you write. You type the row labels on the section, one per line; each product block carries its values, one per line, in the same order. No metafields needed — this is the simplest way to get an aligned comparison table, and the only rule is that the two lists must be in the same order.

Product tabs. A page inside the page: several panels of content on a product page behind a row of tabs — description, care, shipping, sizing.

Product features. Alternating full-width image-and-text rows, built from the product's custom.features metaobject list. Renders nothing when that metafield is empty. See section 8.

Spec groups, Spec strip, Size guide, Size table — the four data-driven spec sections. All four are described in section 8, because what they need from you is product data rather than settings.

Size explorer. A panel where the visitor flips between the sizes or shapes of one product line and reads a plain verdict about each — "the safest choice if you are between sizes". You write the options and the verdicts as blocks; no product data involved.

Shop the look. One large photograph with hotspot buttons pinned over the products in it. Each hotspot opens a small popover with a compact product card. One popover at a time; Escape and clicking outside close it. For lifestyle photography where the products are visible in the shot.

Quick order list. Every variant in a collection as one row of a table — SKU, price, stock, quantity — with a per-row add and one button that adds the whole table at once. For the buyer who already knows what they want: a wholesale account, a club ordering the same shoe in six sizes, anyone who would otherwise open six product pages. It is a real form that posts to the cart, so it works with JavaScript off. It stops at 100 rows and says so — past that the page stops being usable.

Finder categories, Finder quiz, Fit profiles, Ranked picks, Product orbit — the finder family. See Building a product finder below.

Sticky add to cart. A compact card that appears once the real Add to cart button has scrolled out of view, so a long product page stays buyable from anywhere. Add it to the product template and leave it alone.

Wishlist. The wishlist page. Saved products live in the visitor's own browser, so there is nothing to configure and nothing stored on your side.

Collection #

Bento categories. An asymmetric grid of collection cards inside a rounded container. The row pattern alternates narrow-then-wide and wide-then-narrow every two blocks, and it is designed for exactly four blocks — two rows. Use it as the home page's "shop by category" moment.

Category tiles. A grid of collections you pick. The tile is the poster, not a thumbnail with a caption: the collection name sits on the image in the heading face over a bottom scrim, with its live product count beneath and an arrow in the opposite corner. The scrim is mixed from your text colour, so the name stays legible over any image you upload.

Related collections. A small horizontal rail of collection tiles under the product grid on collection pages. Deliberately quiet — it sits below the page's real content, so it gets a modest heading and small tiles.

Shop by attribute. A cluster of typographic chips linking into pre-filtered collections — "under £120", "wide fit", "waterproof". No images by design: the value itself is the artwork, set large. Each chip is just a link to a filtered collection URL, which the theme's own filtering already supports. See section 8 for the one thing that has to be true in the admin for the filters to work.

Storytelling #

Rich text. A kicker, a heading, formatted copy and an optional button. An editorial article head rather than a bare text dump. This plus Collapsible content is what a shipping, returns or warranty page is made of.

Collapsible content. An accordion of question-and-answer pairs, one block per question. This is your FAQ page.

Multicolumn. Two to four columns of icon-or-image, heading, text and an optional link. The workhorse for "how it works", "why buy from us" and the three short explanations under a policy page's prose.

Image with text. One image beside a column of copy. You control which side the image is on, how it is fitted, and the panel behind it.

Overlay banner. A full-bleed image or looping video with a text box you can position over it. Designed to be stacked: a product story page is five or ten of these — scene, claim, supporting line, sometimes a button, next scene.

Scrolling features. A pinned two-column panel where each scroll step slides the next image up into the frame and then changes the copy beside it. Built for explaining a set of options on one product — three midsole foams, four upper materials — without sending the visitor to a different page for each.

Video story. A looping, autoplaying clip pinned to the screen while captions slide up over it. Silent, atmospheric.

Scroll-scrubbed video. The video never plays on its own. Its playhead is tied to scroll position, so scrolling down moves it forward, scrolling up rewinds it, and stopping freezes it. Captions can be pinned to points along the way. Use a short, well-lit clip — a slow rotation, a lace pull. See section 10: this is the heaviest thing in the theme.

Stat counter. Up to four numbers that count up as the row scrolls into view — "12,000 pairs shipped", "4.8 average rating". You can add a prefix or suffix to each. Use real numbers.

Roadmap timeline. A vertical timeline of what has shipped, what is being worked on and what is planned, maintained by hand. One block per entry; block order is display order.

Blog posts. The latest few articles from a blog you pick, as image / date / title / excerpt cards.

Media #

Image gallery. A curated grid of photographs — a lookbook, a race recap — with an optional full-screen lightbox. Two layouts: masonry, which fills columns top to bottom and suits images of mixed heights, and grid, which crops everything to equal squares and reads left to right. With the lightbox on, every tile opens it and a tile's optional link is offered inside the lightbox instead; with the lightbox off, a tile with a link is simply a link. One tile never does both.

Image comparison. Two photographs of the same subject in one frame, divided by a handle the visitor drags to wipe between them. Before and after: new tread and worn tread, dry and wet.

Video. Either a video you have uploaded to Shopify (Content > Files) or a YouTube or Vimeo link, with an optional poster image. Uploaded video is faster and has no third-party cookies; a YouTube embed is easier.

Forms #

Newsletter. A rounded card with the headline and the reasons to subscribe on the left and the email capture on the right. It uses Shopify's own customer form, so subscribers land in Customers with the newsletter tag.

Promo popup. One dismissible dialog that arrives after a delay, on exit intent, or at a scroll depth, carrying either an email signup or a single button. It is the only thing in the theme that arrives uninvited, so it is worth reading its settings properly:

• Trigger — delay in seconds, exit intent, or scroll depth. Exit intent is desktop only. There is no such gesture on a touchscreen, so on a phone that trigger would either never fire or have to be faked.
• Show again after (0–30 days, default 7). The clock starts when the popup opens, not when it is dismissed, so someone who ignores it and clicks through to the next page is not shown it again on arrival. Set to 0 and it has no memory at all — once per page load, which is a lot.
• It never opens by itself in the theme editor. It opens only while you have that section selected, so you can still edit the page underneath it.
• It never renders on the checkout.

Contact form. Name, email and message, posting to your shop's contact notification. This is your support destination; the footer and the trust bar point at it.

Advice form. A longer enquiry form — name, phone, email, a category picker you define, details and budget — for a shop where people ask before they buy. The category picker is a list of blocks you write, so it says whatever your shop sells.

Brand trust #

Trust bar. A compact strip of icon and claim, built to sit directly under the hero: free returns, dispatched in 24 hours, two-year warranty. Keep to three or four claims and make every one of them true.

Customer reviews. A heading, an optional aggregate line you type, one spotlight quote at display scale, and a row of supporting review cards. You type these in. It is not connected to a reviews app — for that, use Product reviews.

Product reviews. A heading and a styled slot for a reviews app's block. The app block itself is added by you in the theme editor. The section supplies colours and fonts and stays out of the app's layout.

Logo carousel. A continuously scrolling row of up to twelve logos — brands you stock, press you have appeared in — each an image with an optional link and a label used as its accessible name. It pauses when hovered, and it renders as a static wrapped row for visitors who have asked for reduced motion.

Social wall. A curated grid of Instagram, X and YouTube posts. Curated means you add them: images and links you control, not a live feed.

Layout #

Header. A single-row navbar: logo, inline navigation with dropdown menus immediately right of the logo, and a right-hand cluster of search, account, an optional wishlist link, and cart. Search is a slide-down panel rather than a permanent field. Below 990 px the row collapses to burger / centred logo / search and cart. The menus come from Content > Menus in the admin.

Footer. A grid of columns — you set how many, two to five on desktop — where each column is a menu, text, social icons or a newsletter form.

Mobile dock. An app-style fixed bottom bar, phones only. Up to four links of your choosing plus an always-present cart with a live count. Add it if a lot of your traffic is mobile and your header menu is deep.

Custom section. A block of your own Liquid or HTML. The escape hatch. Every template that supports sections has this available.

Apps. A bare slot for app blocks on the home page. Renders nothing until you add an app block to it.

Cookie banner. See section 9.

The page bodies #

These are the sections that are the page, one per template. You do not add or remove them, but each has settings worth a look:

Building a product finder #

Five sections work together if you want to guide people to the right product. They are independent — use one, or all five.

Finder categories is the entry point: one tile per category, each linking to that category's guide page. You define the categories as blocks — a label, a collection, a guide page and an image.

Finder quiz asks a few questions and sends the visitor to the matching products. It recommends by filtering, not by scoring: each answer carries a value, and the result is a link to your collection filtered by the chosen values. That means the results are whatever is actually in stock, and you never maintain a list of picks. Every answer is a real link, so with JavaScript off it is still a page of working links.

The quiz has one requirement, and it is the thing that most often goes wrong: each question carries a filter key — a product metafield such as custom.surface — and that metafield has to exist on your products and be enabled as a filter in Search & Discovery. Until it is, an answer still narrows to the collection, so the visitor lands somewhere sensible, but it is not filtered. See section 8.

Give each question its own filter key. Shopify combines several values of the same filter with OR and different filters with AND. So a quiz where every question writes to the same filter gets wider with each answer, not narrower — which is the opposite of what the visitor thinks is happening.

Fit profiles is the "which one for which person" half of a guide: each block is one profile with a title, an image, advice, and up to three products you pick.

Ranked picks is the tier list: each block is a rank label, the thing being ranked, a verdict and an optional product.

Product orbit is the showpiece — a headline with product cutouts orbiting slowly around it and a button into the finder. It draws its products from the categories you define as blocks.

8. Sections that need product data #

Six sections read data you enter in the Shopify admin rather than in the theme editor. They all render nothing when the data is missing, so you can place them in a template permanently and they appear when you fill them in.

Size guide #

Metafield custom.size_guide on the product, type multi-line text. One line per size, five cells separated by |:

EU 40 | 40 | 24.8 - 25.4 cm | Standard, Wide | 248 g

The column order is fixed. You can rename the column headings in the section's settings — call column three "Foot length" rather than "Measurement" — but you cannot reorder them, because reordering would silently reinterpret every product you have already written.

Column three must be a numeric min - max range for the slider to appear. A product whose rows have no range still shows its cards, without a slider, which is correct: there is nothing to match against.

Spec groups #

Metafield custom.spec_groups on the product, type list of metaobject references. You need a metaobject definition first, because a group is a small record and Shopify has no other way to store one. Definition handle spec_group, four fields: title, rows, note, layout. Rows are one Label: Value per line. A group with no rows renders nothing.

The setup is a one-off; after that, filling in a product is four fields.

Spec table rows #

Not a metafield — a text box on the product page's Spec cells block. One row per line:

weight | Weight | scale
drop | Drop | ruler

The first value is looked up on the product under custom. The second is what prints. The third is optional and names one of the theme's icons: ruler, scale, bolt, clock, layers, link, shield, tag, star, check.

A typo in the key hides that row silently rather than showing an error. If a row is missing, check the key first.

Spec strip #

Each block takes a metafield key you type. If the product has that metafield the value is used; otherwise the value you typed in the block is shown. So you can set up the strip with placeholder numbers and it starts reading real data as soon as the metafields exist.

Size table #

Metafield custom.size_table on the product, type multi-line text. Free form — the first line is the header row. The only section here with no fixed schema.

Product features #

Metafield custom.features on the product, a list of metaobject references with image, heading, text and layout fields. Renders nothing when empty.

The finder's attributes #

The Finder quiz needs its filter metafields to be enabled as filters. This is not a theme setting. In the Shopify admin:

1. Create the metafield definition (Settings > Custom data > Products), e.g. custom.surface, and give it values on your products.
2. Install Shopify's free Search & Discovery app if it is not already there.
3. Open it, go to Filters, and add your metafield as a filter.

Until step 3, the quiz's links go to the unfiltered collection. The same is true of any Shop by attribute chip that points at a filter.p.m.* URL.

9. The cookie banner #

Add the Cookie banner section to the footer group and it renders on every page of the storefront. A banner that only appears on some templates is worse than none: someone who lands on a product page from a search result never gets asked.

What it does #

It is a set of buttons over Shopify's own Customer Privacy API. Whether to ask at all is Shopify's decision, not the theme's — Shopify already knows the visitor's region, your regional settings, and any consent given earlier. The theme never second-guesses that, so a shopper in a region with no consent requirement is not nagged and a shopper in a region that has one is not tracked before they answer.

Recording the answer is also Shopify's job. The cookie Shopify sets is the real record. The theme stores a small stamp of its own only to drive the delay and the "ask again after" window.

Settings: the message, an optional link to your privacy policy, the two button labels, an optional preferences panel with per-category checkboxes, a delay before it appears, position (bar or card), and how many days before it asks again (default 180).

What it is not #

It is a region, not a modal. The page stays usable behind it and Escape does nothing. Holding a shopper's storefront hostage until they answer is exactly the pattern consent rules exist to prevent — and dismissing a consent prompt with Escape would have to mean accepting or declining on the visitor's behalf, which is not consent. The two answers are two real buttons, weighted the same.

With JavaScript off, nothing renders. That is correct rather than a gap: the API is JavaScript-only, so there is neither a way to record an answer nor any script-driven tracking to record it about.

It does not render on the checkout — Shopify runs its own consent handling there.

What it does not do, legally #

10. Keeping the store fast #

Glide is built to be fast, and the largest single influence on whether it is fast in practice is what you put in it. Three things matter, in order.

1. Image sizes #

This is the whole game. Shopify resizes and serves your images in a modern format automatically, but it cannot make a 6000-pixel-wide photograph into a small file.

Upload at these sizes. Larger is wasted; smaller looks soft.

Keep every JPEG under about 300 KB before upload. A photo-editing app's "export for web" at 80 % quality gets there without a visible difference. Use PNG only when you need transparency — a logo, a cutout — and JPEG for everything else.

2. How many sections #

A home page of eight to twelve sections is a good home page. Past about fifteen, two things happen: shoppers stop scrolling, and the browser has more to load than the top of the page needs.

The heaviest sections, roughly in order:

1. Scroll-scrubbed video — a whole video file, and the browser has to be able to seek inside it. Keep the clip under fifteen seconds and under 5 MB. One per store.
2. Unboxing reveal — pins the page and animates continuously while it is on screen. One per store.
3. Video story and Video — a video file each. Two videos on one page is one too many.
4. Tilted image banner — six or more images at once.
5. Any product grid — every card carries its hover images (see below).

Sections below the fold cost far less than sections at the top, because their images load only as they are needed. The three or four sections at the top of your home page are the ones worth being strict about.

3. Hover images per card #

Theme settings > Product cards > Hover images per card defaults to 3. On a collection page of 24 products, that is 24 resting images plus 72 hover images the browser may fetch. Set it to 1 or 2 if your collection pages feel slow, or if your products do not have three photos worth sliding through.

A few more #

• Use Video with an uploaded file rather than a YouTube embed where you can. An embed pulls in a third-party player.
• Turn off Load a Japanese fallback font unless you use Japanese. It is off by default.
• Keep your app count down. Apps are, in practice, the most common cause of a slow Shopify store, and no theme can compensate for them.
• Test with Google PageSpeed Insights on the mobile tab, on your live store, not in the theme editor preview. The editor loads extra code that shoppers never receive.

11. Getting help #

Start with the support page — it lists what is covered, how to report a problem, and the handful of things that go wrong most often.

The short version of that list, because these three account for most reports:

• A section shows nothing. Almost always its metafield is empty. See section 8.
• The finder returns everything. The metafield is not enabled as a filter in Search & Discovery. See section 8.
• The popup will not appear. You dismissed it and it is remembering. Set "Show again after" to 0 while you are testing, or use a private window.

One thing to fix before you launch #

If you have not uploaded a logo in theme settings, the header and the Unboxing reveal section both fall back to a placeholder image that belongs to another shop. Upload your logo. It is the first item in section 1 for this reason.