Sleek, Simple, Sales-Driven: Shopify Themes That Sell with Simplicity Explore
Home Help center Stockholm

Stockholm

Below you’ll find a list of articles broken down by sub topics that cover each and every aspect of your theme. We regularly maintain our documentation in collaboration with our support staff.

General sections

Sections that are used on all pages by default

Announcement bar

The announcement bar sits at the top of every page and can contain up to 3 custom messages with optional links. It's great for promoting sales or need-to-know updates.

  1. Use the Add announcement button to add an announcement.
  2. Text field allows you to add text.
  3. (Optional.) Paste or select a link using the Link field.
  4. Use the field Icon to add/change image.

Header appears at the top of each page. You can customize it to fit with your brand and product offerings.

  1. Use the Logo image file selector to select or upload your logo file.
  2. (Optional.) If you added a logo, use theCustom logo width slider to change size of the logo in the header.
  3. Use the Logo position on large screen field to select position logo.
  4. Choose a Menu to be displayed in the header.
  5. Show separator line field turns on the display of the line below.
  6. Show social field turns on the display of social icons.
  7. Enable country/region selector field turns on the display of country/region.
  8. Enable language selector field turns on the display of languages in the store.
  9. Enable sticky header field turns shows on the screen as customers scroll up.
  10. Show collections in search modal field turns on the display of collection card in search and the settings below allow you to customize these cards.

Mega Menu

You can add a Mega menu to the Header as a new block and choose up to 2 collections as promo blocks.

In this theme, you can use a predictive search. It is enabled by default, but you can disable it in the Theme settings > Search.

Information bar

The Information bar bar allows you to add up to four information messages with icon.

  1. Show separator line field turns on the display of the line below.
  2. Text field allows you to add text info.
  3. Enable margin bottom field turns bottom indent.
  4. Enable swipe on mobile field turn on the slider for column on mobile devices.
  5. (Optional.) Paste or select a link using theLinkfield.
  6. Use the field Icon to add/change image.

Email Signup

Email signup adds a feedback form at the bottom of the page.

  1. Use the field Color scheme to change Background.
  2. Heading field adds a title to the left of the form.
  3. Description field adds a title to the bottom of the form.
  4. Bottom image filed allows you to select a picture that will be displayed at the bottom of the block.
  5. Make section full width filed turn on the display of the block in full screen

Footer appears at the bottom of each page. You can customize it to fit with your brand and product offerings.

  1. Use the field Color scheme to change Background.
  2. Choose a Bottom menu to be displayed in the bottom line footer.
  3. Show social media icons field To display your social media accounts, link them in your theme settings.
  4. Enable country/region selector field turns on the display of the region in the bottom line of the footer.
  5. Enable language selector field turns on the display of the language selection in the bottom line of the footer.
  6. Enable Follow on Shop field turns on the display of the Follow on Shop button in the bottom line of the footer.
  7. Show payment icons field enables the display of wage types in the bottom line of the footer.
  8. Show policy links field enables the display of wage types in the bottom line of the footer.
  9. Block Menu allows you to select up to 6 menus, which will be displayed on the top line of the footer.
  10. Block Logo info file selector to select or upload your logo file.
  11. (Optional.) If you added a logo, use theCustom logo width slider to change size of the logo in the header.
  12. Block Text adds a column with a title and text for it

Theme settings

Back to Top

To enable Back to Top button, navigate to Theme settings > Advanced.

Color swatches

To enable and edit Color swatches, navigate to Theme settings > Color swatches. Swatch trigger should be the same as the option in Product variants. You can also add custom colors by adding their name and color in HEX format.

Infinite scroll

To enable and edit Infinite scroll, navigate to Theme settings > Pagination > Pagination type.

Overlay Group

Notification Banner

In the Notification Banner settings, you can change layout, add image, texts, edit banner position, change open and exit animations and options.

You can also use this banner as a button-trigger for opening another notification bar or a popup by following these steps:

  1. Add the id of the popup/notification bar you chose to open to the Id field in the Triggers section (e.g. "popup")
  2. Navigate to the popup/notification bar settigns and add the Id with "#" in the beginning to the "CSS selector for manual trigger" field.

In the Popup settings, you can change layout, add image, subscribe form, edit position, change open and exit animations and options.

You can also use this popup as a button-trigger for opening another popup or notification bar by following these steps:

  1. Add the id of the popup/notification bar you chose to open to the Id field in the Triggers section (e.g. "notification").
  2. Navigate to the popup/notification bar settings and Add the Id with "#" in the beginning to the "CSS selector for manual trigger" field.

Age verification popup

An Age verification popup is a prompt that appears on a website to confirm the user's age before accessing restricted content. In the Age verification popup settings, you can change customize text and buttons.

All sections

The theme contains several customizable sections that you can add to your page in any order.

Gallery with text

Allows you set gallery with several image and description.

  1. Show border top field includes a line above.
  2. Show border bottom field includes a line under.
  3. Block Image optionsImage allows you to set a image for the block.
  4. Block Image optionsTab description allows you to set a title for the block.
  5. Block Imageoptions Heading allows you to set a subtitle for the block.
  6. Block Image optionsText allows you to set a description for the block.
  7. Block Imageoptions Button link allows you to set a button/link for the block.
  8. Block Image optionsButton label allows you to add text for the button / link.
  9. Block Image optionsEnable full card this option should only be enabled for one element.

Collection list

Allows you to select up to several collections (categories).

  1. Sub heading field adds sub header.
  2. Color scheme field sets the color scheme for the text block.
  3. Show border top field includes a line above.
  4. Show border bottom field includes a line under.
  5. Block Collection allows you chose the collection.

Image banner

Allows you to select an image, title, text and a link to it.

  1. Heading field adds a header.
  2. Subheading field adds sub header.
  3. Additional information field displays additional text information.
  4. Text order field allows you to select the order of the text and title.
  5. Text align field allows you to select the align of the text and title.
  6. Enable button field includes a button / link to go to the general collections page.
  7. Button label field allows you to add text for the button / link.
  8. Button style field set style button.
  9. Button link field set link.
  10. Background image field allows you to choose the background on which the collection cards will be displayed.
  11. Image ratio field allows you to choose the orientation of pictures for cards.
  12. Image position field set image position.
  13. Enable round stamp field enable round stamp.
  14. Text for round stamp field set text for round stamp.
  15. Width for round stamp field sets the stamp diameter in px.
  16. Font size for round stamp field sets the font size in px. If you want more words to fit in the stamp, then reduce it.
  17. Letter spacing for round stamp field sets the stamp letter spacing in px.
  18. Show border top field includes a line above.
  19. Show border bottom field includes a line under.

Image with text

Decorating section with title, image, link and text.

  1. Block Heading allows you to set a title for the section.
  2. Block Text allows you to set a description for the section.
  3. Block Button allows you to set a button/link for the section.
  4. Image field allows you to set a image for the section.
  5. Image ratio field allows you to set a orientation for the image.
  6. Desktop layout field allows you to select the location of the picture within the section.
  7. Enable round stamp field enable round stamp.
  8. Text for round stamp field set text for round stamp
  9. Width for round stamp field sets the stamp diameter in px
  10. Font size for round stamp field sets the font size in px. If you want more words to fit in the stamp, then reduce it
  11. Letter spacing for round stamp field sets the stamp letter spacing in px.
  12. Show border top field includes a line above
  13. Show border bottom field includes a line under

Brand image

Section allows you to install several columns, for example, with brand logos.

  1. Column per row field allows you to select the number of column in one line.
  2. Image ratio field sets the orientation of the picture inside the column.
  3. Column alignment field sets alignment to column.
  4. Show border top field allows you to connect the lines above the section.
  5. Show border bottom field allows you to connect the lines under the section.
  6. Block Brand column optionHeading allows you to set a title for the column.
  7. Block Brand column optionImage allows you to set a image for the column.
  8. Block Brand column optionImage allows you to set a image for the column.

Testimonials

Section designed for the review carousel.

  1. Heading allows you to set a title for the section.
  2. Subheading allows you to set a subtitle for the section.
  3. Show border top field allows you to connect the lines above the section.
  4. Show border bottom field allows you to connect the lines under the section.
  5. Block Testimonials slide optionText adds a text for it slide.
  6. Block Testimonials slide optionStar adds a star (1-5) for it slide.
  7. Block Testimonials slide optionAuthor name adds a author name for it slide.
  8. Block Testimonials slide optionAuthor country adds a author country for it slide.

Blog posts

Section allows you to select a blog and customize it.

  1. Heading field adds a header for section.
  2. Show border top field allows you to connect the lines above the section.
  3. Show border bottom field allows you to connect the lines under the section.
  4. Blog field allows chose blog.
  5. Blog posts field allows you to select the number of column in one line.
  6. Show featured image field enable image for blog post.
  7. Show date field enable date for blog post.
  8. Show author enable author for blog post.
  9. Enable "Read more” enable button for all blog post.

Multicolumn

Section consisting of several columns with description.

  1. Heading field adds a header for section.
  2. Show border top field allows you to connect the lines above the section.
  3. Show border bottom field allows you to connect the lines under the section.
  4. Show column in row field allows you to select the number of column in one line.
  5. Image width field sets the width of the image inside the column.
  6. Image ratio field sets the orientation of the picture inside the column.
  7. Column alignment field sets the alignment within the column.
  8. Button label field allows you to add text for the button / link.
  9. Button link field set link
  10. Enable swipe on mobile field turn on the slider for column on mobile devices.
  11. Block Column optionImage allows you to set a image for the column.
  12. Block Column optionHeading allows you to set a title for the column.
  13. Block Column optionDescription allows you to set a description for the column.

Allows you to select one collection and customize the display of products from it

  1. Heading field adds a header collection.
  2. Heading size field set header size.
  3. Heading big text field use this text if you want to highlight some short text in a larger font, such as a number.
  4. Subheading field adds sub header.
  5. Additional information field displays additional text information.
  6. Text align field set text align.
  7. Enable button field includes a button / link to go to the general collections page.
  8. Button label field allows you to add text for the button / link.
  9. Button style field set style button.
  10. Button order field set order button.
  11. Collection field allows you to select a collection from which products will be displayed.
  12. Products to show field allows you to select the total displayed quantity of products.
  13. Products per row field allows you to select the number of cards in one line.
  14. Enable swipe on mobile field turn on the slider for cards on mobile devices.
  15. Image ratio field allows you to choose the orientation of pictures for cards.
  16. Show second image on hover field turns on the display of the second image on hover
  17. Show vendor field turn on vendor display.
  18. Show border top field includes a line above.
  19. Show border bottom field includes a line under.

Image collage

Decorating section with title, image, link and text.

  1. Heading allows you to set a title for the section.
  2. Subheading allows you to set a subtitle for the section.
  3. Text allows you to set a description for the section.
  4. First button text field allows you to add text for the first button.
  5. First button link field set link for the first button.
  6. Second button text field allows you to add text for the second button.
  7. Second button link field set link for the second button.
  8. Big image allows you to set a center image for the section.
  9. Big image width field sets the width of the center image for the section.
  10. Text position field set text position.
  11. Show border top field includes a line above.
  12. Show border bottom field includes a line under.
  13. Block Image optionImage allows you to set a image for the block.
  14. Block Image optionimage width field sets the width of the image for the block.

Rich text section

Information section with title, image, link and text.

  1. Color scheme field sets the color scheme for the text block.
  2. Make section full width filed turn on the display of the block in full screen.
  3. Block Heading allows you to set a title for the rich text.
  4. Block Heading font size allows you to set a title size for the rich text.
  5. Block Description allows you to set a description for the rich text.
  6. Block Button label field allows you to add text for the button.
  7. Block Button link field set link.

Before/After

You can add two comparable images, along with text and a button, in this section.

Countdown

You can add and customize a countdown timer.

Collapsible content

You can add and customize a collapsible content section, such as using it for FAQs.

Slideshow

In this section, you can add and customize slides, adjust the color scheme, width, aspect ratio, and slide autoplay duration.

Video Banner

In this section, you can add and customize an autoplay video and an overlay text.

Page

Information on topic pages

Product page

Product information

  1. Enable sticky product information on large screens field sets the fix for the product info column.
  2. Enable video looping field sets repeat for video.
  3. Block Text option Text style sets style vendor text.
  4. Block Inventory status displays the number of product items left in stock.
  5. Block Variant picker allows to choose the type of options, either pills or dropdown.
  6. Block Buy buttons option Show dynamic checkout buttons using the payment methods available on your store, customers see their preferred option, like PayPal or Apple Pay.
  7. Block Buy buttons option Show recipient information form for gift card products enables an option to send a gift card as a gift.
  8. Block Share allows enable links from the list.
  9. Block Additional description optionHeading field sets a header block.
  10. Block Additional description optionContent field sets a content block.

Product image with text

  1. Subheading allows you to set a subtitle for the section.
  2. Author text adds a text for it section.
  3. Author photo adds a author image for it section.
  4. Author name adds a author name for it section.
  5. Author position adds a author position for it section.
  6. Show border top field allows you to connect the lines above the section.
  7. Show border bottom field allows you to connect the lines under the section.
  8. Block Image field sets the image inside the block.
  9. Block Image width field sets the width of the image inside the block.
  10. Block Enable round stamp field enable round stamp.
  11. Block Round stamp field sets enable stamp inside the block.
  12. Block Round stamp text field set text for round stamp.
  13. Block Width for round stamp field sets the stamp diameter in px.
  14. Block Font size for round stamp field sets the font size in px. If you want more words to fit in the stamp, then reduce it.
  15. Block Letter spacing for round stamp field sets the stamp letter spacing in px.

Product recommendations

Dynamic recommendations use order and product information to change and improve over time.

To add and edit product recommendations, follow these steps:

  1. Install the Search & Discovery app by Shopify from the Apps page in the Admin panel.
  2. Once installed, open the app and follow the 'View recommendations' link in the Feature overview section to add recommendations to your products.

You can easily edit or add recommendations for multiple products using the Bulk Editor in the Products tab in the Admin panel.

  1. Heading field sets a header section.
  2. Image ratio field allows you to choose the orientation of pictures for cards.
  3. Show second image on hover field turns on the display of the second image on hover.
  4. Add padding field includes padding for the picture inside the card.
  5. Show vendor field turn on vendor display.

Size chart

To add a size chart, follow these steps:

  1. Create new page with a table.
  2. Add a "Popup" block to the product page.
  3. Select "Size chart" page.

Collections page

Collection banner

  1. Show collection description field turn on description display
  2. Show collection image field turn on image display

Product grid

  1. Products per page field sets the number of displayed cards
  2. Products per row field allows you to select the number of cards in one line.
  3. Image ratio field allows you to choose the orientation of pictures for cards.
  4. Show second image on hover field turns on the display of the second image on hover.
  5. Show vendor field turn on vendor display.
  6. Enable filtering field turn filtering
  7. Enable sorting field turn sorting

Collections list

Displays a list of all collections

  1. Heading field sets a header section.
  2. Sort collections by field filters the collection by the specified parameters
  3. Image ratio field allows you to choose the orientation of pictures for cards.

Contact

  1. Heading field sets a header section.

Cart

  1. Show vendor field turn on vendor display.
  2. Enable cart note field sets note

Blog

  1. Show featured image field enable image for blog post.
  2. Show date field enable date for blog post.
  3. Show author enable author for blog post.

Blog post

  1. Header layout allows you to select the location of the image.
  2. Block Article header optionShow date field enable date for blog post.
  3. Block Article header optionShow author field enable author for blog post.
  4. Block Article header option Featured image height field allows you to select ratio image.
  5. Block Article header optionShare allows enable links from the list.
  6. Block Article footer optionShow date field enable date for blog post.
  7. Block Article footer optionShow author field enable author for blog post.
  8. Block Article footer optionShare allows enable links from the list.

Icons

Please follow this link to download icons used in the theme.

Importing Our Demos

You can also copy the structure of any of our 5 demos in a few steps.

  1. Copy the demo structure from the links (Cmd-A or Ctrl-A to select all).
  2. Follow to the section Online Store > Themes in your store. Click the three dots button of your theme.
  3. Open the code editor by clicking the Edit code button.
  4. In the code editor, search for the file "index.json", select all content, and paste replacing the demo structure. Click "Save" to save your changes. If there's an error, click "Format json" and try to save the file again.

Demos structure

  1. Main
  2. Beauty
  3. Style
  4. Accessories
  5. Crafts

Support

You can ask any questions about the theme and our support agent will help you within 24 hours on business days.

Visit Help Center      View Terms & Conditions