Help Center

Streamline: Theme settings

Updated

Streamline includes a variety of settings that let you customize and personalize the overall look and feel of your store.

To access Theme settings, click the gear icon in the left sidebar of the theme editor.

theme settings.png

  • Colors

    Streamline provides extensive controls for managing colors across the theme. These settings are organized into common categories, and each color can be selected using the color picker.

    Streamline color settings.png

    General

    These settings apply to the bulk content and sections throughout the theme. Control the colors using the color picker beside each label. 

    • Background

    • Text

    • Buttons

    • Button text

    • Sale price

    • Sale tag

    • Sale tag text

    • Cart bubble

    • Cart bubble icon

    Alternate sections

    These colors apply to sections where Use alternate section color is enabled.

    • Background

    • Text

    Announcement bar

    These color settings are used for the announcement bar block. Select and customize colors using the color picker next to each label.

    • Announcement bar

    • Announcement bar text

    Newsletter

    Apply colors to the newsletter section using the color picker beside each label. 

    • Background

    • Text

    Sticky cart

    These settings apply to the sticky cart. Use the color picker next to each label to adjust the colors.

    • Background

    • Text

    Image treatment

    Overlay is the darkening effect used on image sections to enhance text readability. These settings are used across large images with overlaid text like the slideshow section or featured collection.

    • Text

    • Overlay

    • Overlay opacity

    • Text shadow amount

    Animations

    Use these color settings to control the image backgrounds on elements like the product grid, featured collections, hero sections, and collection headers.

    • Image background

    • Image section background

  • Typography

    The Typography settings allow you to change the font family and adjust text sizes throughout the theme.

    Headings

    Use Shopify’s font picker to select a Font and adjust its Base size, Letter spacing, and Line height. Turn on Capitalize to display headings in uppercase.

    headings settings.png

    The heading settings apply to: 

    • Section heading fields

    • Page titles

    • Product titles on product pages

    Body text

    Use Shopify’s font picker to select the Body font and customize its Base size, Letter spacing, and Line height. Turn on Capitalize product titles to display product titles in uppercase across the theme.

    Body text settings.png

    The body text settings apply to: 

    • Section text fields

    • Product descriptions

    • Buttons and announcement bar text

    • Breadcrumbs, filters, and pagination

    • Product labels

    • Product grid text

    • Header and footer menus

    • Most text elements throughout the theme

    Sticky menu

    Sticky menu settings.png

    Use Text size to adjust the font size of the navigation links in the sticky or thumb-oriented menu.

  • Design

    design settings.png

    Use the Style setting to choose whether button text appears in all caps or normal case. The Shape setting lets you select the button design from the following options:

    • Sharp

    • Shadowed

    • Slightly round

    • Round

  • Animations

    Streamline offers a selection of animation effects to enhance your store’s design.

    animation settings.png

    Enable Animate images to apply a loading animation to images and texts throughout the theme.

    Enabling Animate logo between pages displays an animated logo image during page transitions. Use Loading image to upload an image, and adjust Desktop loader width and Mobile loader width to set its size.

  • Product tiles

    Product tiles, also referred to as the product grid, display products in a structured layout that highlights key details such as the product image, title, price, and labels. They appear in any section that features products, including collection pages and search results.

    Streamline product tiles.png

    When Hover to reveal product details is enabled, the product title and price below the image appear only on hover.

    Hover to preview product images adds a hover effect that shows additional product images when customers hover over a product tile.

    When Scatter images is enabled, displays product tiles in a scattered layout when enabled. Also applies to the product thumbnails in the product page.

    Scatter example.png

    Force image size sets how product images are sized and shaped within the product grid. Select from the following options:

    • Natural

    • Square (1:1)

    • Landscape (4:3)

    • Portrait (2:3)

    Show vendor adds the vendor name below the product title in the product grid.

    When a product has a compared-at price, enabling Show saved amount displays a savings label in the product grid. You can choose to show the savings as either a price or dollar amount or a percentage.

    Streamline savings example.png

    Color swatches

    Enable color swatches adds color swatches to product tiles when available. Learn how to set up color swatches here.

  • Quick shop

    When Enable quick shop is turned on, clicking on a product tile opens a pop-up window displaying the product details, without navigating to the product page.

    Streamline quick shop feature.gif

    The Style setting lets you show either the full product page or just the product section. Image size controls the size of the main product media.

    On desktop, Image style determines how product images appear. Fade displays a single main image, while Stacked shows all product images in a horizontal sequence.

  • Cart

    Refer to this article for more information: Streamline: Cart types

  • Social media

    Account links

    Enter your social media URLs here to show social media buttons across supported sections.

    social media links.png

    The theme supports these social media icons:

    • Facebook

    • X

    • Pinterest

    • Instagram

    • Snapchat

    • TikTok

    • Tumblr

    • LinkedIn

    • YouTube

    • Vimeo

    Social icons in the footer.png
    Social icons in the footer section

    Sharing options

    Choose which sharing options are displayed on product pages and blog posts.

    sharing options.png

    You can enable the following:

    • Share on Facebook

    • Tweet on X

    • Pin on Pinterest

    Sharing buttons in the blog post.png
    Social sharing buttons displayed at the bottom of the blog post

  • Favicon

    Use this setting to upload a favicon image, which appears in the browser tab and search results to represent your website.

    favicon.png

    For best results, upload a PNG favicon sized at 32 × 32 pixels.

  • Search

    search settings.png

    Enable Predictive search to show suggestions and autocomplete results as customers enter a text in the search bar.

    Use Shopify’s Search & Discovery app to manage advanced search settings and unlock additional features for your store’s search experience.

  • Extras

    extra settings.png

    Text direction allows you to set the overall text flow of your site to either left to right or right to left.

  • Custom CSS

    Add your own CSS in the Custom CSS section to make small design adjustments without directly editing the theme code.

    custom css.png

    Please keep in mind that this section is intended for users with basic HTML and CSS knowledge. If you’re not comfortable with coding, we recommend working with a Shopify Expert for assistance.

  • Theme style

    Each theme provides pre-designed style presets that combine fonts, colors, and other design settings to help you customize your store.

    Streamline theme styles.png

    Streamline offers three theme styles: Streamline, Satin, and Fern. Learn more about theme styles here.

Related articles