Theme settings | Loco theme help

Theme settings apply to your whole store. To open them:

In your Shopify admin, go to Online Store > Themes.
Click Customize next to Loco.
In the theme editor sidebar, click Theme settings.

The groups below are listed in the same order as in the editor. Where a default differs by preset, the table says so. Settings for a single section, such as the header or the product page layout, are in that section. See Sections.

Logo and favicon

Setting	What it does	Default
Logo	The image shown in the header, on the password page and in age verification. Any shape works: wide, square or tall. Without a logo, the header shows your store name as text.	None
Logo width	The largest width of the logo, from 80 to 240px. The logo is never stretched or cropped, so a tall logo can look narrower than this number.	140px
Favicon	The small icon in the browser tab. 32 x 32px .png recommended.	None

Change Logo width when your logo looks too small or crowds the menu. Check the header on a phone as well after you change it.

Design style

Setting	What it does	Default
Design style	Changes corners, shadows and control shapes across the theme. It also sets the size and weight of headings and other text styles, and how secondary buttons look.	Loco: Soft panels. Almanac: Paper and rules. Roster: Crisp sheets

The three options match the three presets:

Soft panels: raised panels with rounded corners, pill-shaped buttons and fields.
Paper and rules: square corners, thin lines instead of shadows.
Crisp sheets: sheets with small corners, a thin outline and a dense layout.

Most stores keep the style of their preset. You can switch it at any time. Your sections, colors and fonts stay as they are, so check your color schemes and fonts afterward: they were chosen to match the preset's style.

Colors

This group holds your color schemes. Each scheme has nine colors, and every section, the header and the footer use one scheme. The full guide, including which element takes which color and how to make Loco light, is on Color schemes.

Typography

Setting	What it does	Default
Heading font	Headings, product names and prices. With Crisp sheets, product names on cards use the body font.	Loco: Poppins. Almanac: EB Garamond. Roster: Chivo
Body font	Body text, buttons, menus and form fields.	Loco: Poppins. Almanac: Karla. Roster: Libre Franklin
Accent font	Used for SKUs, codes and small labels.	Loco: Poppins. Almanac: EB Garamond. Roster: Roboto Mono

See Typography for how to change fonts and what to check afterward.

Product cards

These settings apply to every product card in the store: in collections, search results, and sections such as Featured collection.

Setting	What it does	Default
Image ratio	The shape of the image area on each card: Square (1:1), Portrait (4:5) or Tall (3:4). Product images are never cropped. They are fitted inside this shape.	Loco and Roster: Square. Almanac: Portrait
Show second image on hover	Shows the product's second image when a customer points at the card with a mouse. Works when the second media item is an image.	Off
Show vendor	Shows the product's vendor in the line under the price, in place of the product's subtitle.	Off. Roster: on
Show SKU	Shows the product's SKU above the product name.	Off. Roster: on
Show color swatches	Shows up to five color dots for an option whose values have swatches, with a count for the rest.	On
Show quick buy	Adds a button to each card. A product with one variant and no subscription or pre-order option is added to the cart right away. Other products, and gift cards, show Choose options and open a quick view. Sold-out products show no button.	On

To show a badge on a product card, add a product tag such as badge:Limited. 14 characters max.

A few notes on badges:

Add the tag in the product's Tags field in your Shopify admin. The text after badge: is what customers see, for example badge:Limited shows "Limited".
A card shows one badge. Products on pre-order show a pre-order badge automatically, and it takes the place of the tag.
The tags badge:Sale, badge:New, badge:Sold out, badge:Soldout, badge:Pre-order and badge:Preorder are ignored. A sale is shown by the crossed-out compare-at price, and sold out and pre-order come from the product's real stock and selling plans.

When to change these settings:

Pick the Image ratio closest to your product photos, so they fill the card. Portrait suits packaging and bottles, Tall suits clothing.
Turn on Show SKU when customers order by part number.
Turn off Show quick buy if most of your products need a careful choice of options before buying.
Swatches come from your product options. In your Shopify admin, open the product, edit the color option and set a color or image for each value. See Product page.

Product page

Setting	What it does	Default
Low stock threshold	Shows "Only N left" when inventory is tracked and at or below this number. You can set 1 to 20.	10

The message appears in the Inventory block of the product page and shows the real stock count from Shopify. It does not appear for products that do not track inventory or that keep selling when out of stock. See Product page and Honest promotions.

Cart

Setting	What it does	Default
Cart type	Drawer opens the cart as a panel at the side of the page. Page takes customers to the cart page.	Drawer
Free shipping threshold	Order total in your store's default currency, for example 50. Other currencies are converted automatically. Add a matching free shipping rate in Shipping and delivery settings. Set to 0 to hide the free shipping progress bar.	0
Show cart note	Lets customers write a note with their order. To hide the note on the cart page only, use Show cart note in the Cart section.	On
Gift wrap product	The product a customer adds with the gift wrap checkbox in the cart. Leave it empty to hide gift wrapping.	None

The free shipping bar only shows progress. The free shipping itself comes from your shipping rates, so set the same amount in Settings > Shipping and delivery.

To offer gift wrapping, create a product for it in your Shopify admin with its own price, then choose it here. See Cart.

Header behavior

Setting	What it does	Default
Sticky header	What stays at the top of the page while customers scroll.	Contextual bar

The options:

Contextual bar: as customers scroll down, the header scrolls away and a slim bar with the page's main action takes its place. On a product page it shows the price and Add to cart, on a collection the filters, on a blog post the reading progress, in the cart the total and checkout, and on a regular page the page title. On the home page the header itself stays at the top in a compact form. Other pages, such as search results, the blog, the contact page and an empty cart, keep nothing at the top.
Always: the header stays at the top of every page in a compact form.
Off: nothing stays at the top. The header scrolls away with the page.

See Header and footer.

Currency format

Setting	What it does	Default
Show currency codes	Adds the currency code to prices, for example "$25.00 USD".	Off

Turn it on if you sell in several currencies that share a symbol, such as US and Canadian dollars, so customers know which one they see.

Add the full link to each profile you want to show, for example https://www.instagram.com/yourstore. The options are Facebook, Instagram, X, TikTok, Pinterest, YouTube, Snapchat, Tumblr, Vimeo, Threads and LinkedIn. All are empty by default.

The icons appear in the footer when Show social media icons is on in the Footer section. Leave a field empty to hide that icon.

The popup is a small card with an email signup form. It appears in a bottom corner of the window on computers and as a sheet from the bottom of the screen on phones. It does not block the page.

Setting	What it does	Default
Show popup	Turns the popup on. The other settings appear when it is on.	Off
Image	An optional image on the card.	None
Heading	The heading of the card.	Empty
Text	A short line under the heading.	Empty
Discount code	Enter a code you created in Discounts. Leave empty to hide the code.	Empty
Delay	How long after a page opens the popup appears, from 3 to 30 seconds.	8s
Show again after	How many days the popup stays away after a customer has seen it, from 1 to 90.	14 days

How the popup behaves:

On a computer, it can also appear earlier when the mouse leaves through the top of the window, but not in the first 3 seconds.
It never appears on the cart page, and never to a customer who has already signed up.
If age verification is on, the popup waits until the customer has answered.
The discount code is shown only after a customer signs up. Create the code first in Discounts, then enter it exactly.
Subscribers appear in Customers with the tag newsletter.
In the theme editor, the popup opens when the editor loads so you can see it, and closes when you select a section or block.

Age verification

Age verification covers the store with one question before customers can enter. Use it if the law requires an age check for what you sell.

Setting	What it does	Default
Show age verification	Turns the age check on. The other settings appear when it is on.	Off
Minimum age	The age customers confirm, from 16 to 25. The question reads "Are you 21 or older?" with your number.	21
Reason	An optional line under the question, for example why you ask.	Empty
Remember answer for	How many days a Yes, enter answer is kept on the customer's device, from 1 to 90. A No, leave answer isn't kept, so the customer can answer again.	30 days
Exit link	Where No, leave takes customers. If you leave it empty, customers see a message that they can't enter, with a button to go back to the question.	Empty

The age check asks for a yes or no answer. It does not ask for a date of birth and does not verify identity. Check what your local rules require. In the theme editor it opens when the editor loads and closes when you select a section or block.

Animations

Setting	What it does	Default
Reveal sections on scroll	Sections fade in gently as customers scroll to them.	On

The header and buy buttons never wait for the animation, and everything already on screen when a page opens appears at once. Customers who turned on reduced motion in their device settings see sections without the animation. The animation doesn't play in the theme editor. Turn this setting off if you prefer a store without movement.