Back to Icon support

Icon - Theme settings

Theme settings exist to control the appearance of content and set the base style for your store. Where sections might have their own individual settings, theme settings are here to cover repeated or static content.

 

Colors

Control the color scheme for different areas of your store which include:

  • Announcement bar
  • Header 
  • General text and content
  • Buttons
  • Product icons
  • Social icons
  • Color schemes
    Color schemes allow you to select and pre-defines up to 3 preset background and text colors for quick selection in your sections.
  • Footer

 

Typography

Choose the font styles for your store content

  • Main font + size
  • Navigation font + size + capitalization
  • Heading font + size
  • Section title alignment and borders
  • Button case, rounded buttons & ghost buttons

 

Global

Set your preferences for content across your store

  • Scroll animation
    Set the scroll animation for content as you scroll down the page.
  • Zoom effect
    Toggle a smooth zoom in when hovering content images.
  • Section spacing
    Set the vertical height between sections.
  • Keyboard focus & borders
    Adds greater visibility of keyboard selected content for users with disabilities.
  • Search
    Show only products in search, enable predictive search.

 

Product grid

Set the visible options for products when viewed in a grid ( collection pages, search, featured collection sections )

  • Spacing and alignment
    Set the distance between products
  • Product detail text alignment
    Align product details and pricing to the left or center
  • Product image size
    Allow the theme to control the size of your images for a perfectly aligned product grid.

    Product options:
  • Switch images on hover
    Toggle image switching when hovered.
  • Show vendor with product titles
    Displays the product vendor.
  • Show product videos
  • Show review ratings
    Displays ratings from the Shopify product reviews app (if installed).

    Quick shopping options:
  • Enable quick view
    Adds a popup product modal or drawer for expedited shopping.
  • Additional info
    Show available colors, sizes or an Add to Cart button.

    Icons and notifications:

  • Icon shape
    Set the shape of New, Sale and Sold out icons.
  • Icon position
    Choose the placement of product icons.
  • Show New, Sale, Sold out icons
    Toggle visibility of icons.
  • New icon 
    Determine whether it shows by being in a New collection or by setting a date range.
  • Show custom icon
    Shown when a product tag starts with "icon_". For example, `icon_Restocked`.
  • Sale items
    Show sale icon, percentage, or amount saved in sale badge.

 

Product pages

Choose available options which are available for a single product when viewed in either a product page or featured product section.

  • Show vendor
    Display product vendor / brand.
  • Show tax information
    Displays the tax policies.
  • Show quantity selector
    Display a quantity input allowing customers to increment their quantity. 
  • Show dynamic checkout button
    Toggles visibility of quick checkout buttons.
  • Product variant display
    Choose to display swatch buttons or a dropdown menu for selecting variants.
  • Show color swatches
    Toggles color swatch visibility as color specific icons or the text name of the color ( Red, Blue, White etc.. ).
  • Color swatch shape
    Choose Circle, Square or Rectangular color swatches.
  • Color swatch style
    Custom images, allow you to upload color specific images ( see guide ).
    Zoomed in variant images ( shows the variant image assigned to the color ).
    Default color ( Uses the HTML color chart to show a solid color ).
    Swatch allows you to use Shopify's new category swatches (see guide)
  • When adding to the cart
    Select cart behavior when adding items by opening the cart or remaining on the current page.

 

Cart

There are several options available for controlling the look and feel of your shopping cart, we recommend trying them all to see your preference.

  • Cart type
    Choose the behavior when clicking the Cart button
    Page only:
     Go to the cart page
    Drawer cart: 
    Open the cart in a side drawer
    Modal cart: 
    Open the cart in a modal window
    Page only - no automatic updates:
     Go to the cart page but require a refresh when updating, this option exists as we know some apps do not support Ajax or carts that auto update. Use this if your app experiences those issues and your app developer is not helping.

  • Cart empty collection
    Show up to 4 products from a selected collection in the empty cart.
  • Show tax note
  • Show shipping note
  • Show cart note box
  • Shipping calculator
    Allows buyers to calculate their shipping
  • Free shipping countdown
    Manually set by you, shows the remaining amount until free shipping. This does not have access to your actual shipping settings. 

Social media

Add links to your chosen social media channels

Customer accounts

  • Show returns/exhange info

Favicon

Upload a favicon image which will be displayed in the Browser tab and bookmark toolbar.

 

Checkout 

Checkout colors and styles are injected by Shopify into the theme settings for every Shopify theme. These options allow you to set your preferred color scheme for the checkout which is commonly shared by all Shopify stores.

Theme developers do not have access, nor can they edit the checkout layout, design or code structure.