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

Handmade

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

General sections

The sections that are used on all pages by default

Announcement bar

The announcement bar appears at the top of every page and includes custom messages with optional links. It's good to use 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 the image.

Header appears at the top of every page right below the Announcement bar. You can customize it to fit your brand and product offerings.

  1. Use the Logo image file selector to select or upload your logo file.
  2. Use the Logo image for article page with overlay file selector to select or upload your logo which can be seen on the blog page with an overlay header.
  3. (Optional.) If you add a logo, you can use the Custom logo width slider to change the logo size.
  4. Use the Logo position on large screen field to select a position of the logo.
  5. Choose a Menu to be displayed in the header.
  6. Choose a Fullscreen menu to be displayed in the Fullscreen menu.
  7. Enable country/region selector field enables the display of country/region.
  8. Enable sticky header field enables the display of a header on the screen as the user scrolls up.
  1. Show collections field enables the display of collection links in search and the settings below allow you to customize these links.
  2. Show articles field enables the display of blog articles in search and the settings below allow you to customize these articles.

Fullscreen menu aside

  1. Use the Aside options selector to select the type of aside.
  2. Use the Image left, Image center, and Image right file selectors to select or upload images.
  3. Subheading allows you to set a subheading for the subscribe form.
  4. Heading allows you to set a heading for the subscribe form.
  5. Description field allows you to add text to the subscribe form.
  6. Button style field sets the button's style.
  7. Show social field enables the display of social icons.

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.

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

  1. Use the field Color scheme to change Background.
  2. Enable border top field enables a line above the section.
  3. Choose a Bottom menu to be displayed in the bottom line footer.
  4. Show social media icons field enables the display of social media icons in the bottom line of the footer.
  5. Enable Follow on Shop field turns on the display of the Follow on Shop button in the bottom line of the footer.
  6. Show payment icons field enables the display of payment methods in the bottom line of the footer.
  7. Show policy links field enables the display of wage types in the bottom line of the footer.
  8. Block Logo info file selector allows you to select or upload your logo file.
  9. (Optional.) If you add a logo, use the Custom logo width slider to change the logo size in the footer.
  10. Description for site field allows adding a short description below the logo.
  11. Block Menu allows you to select up to 6 menus, which will be displayed on the top line of the footer.
  12. Enable country/region field enables the display of the region selector in the footer.
  13. Enable language field enables the display of the language selector in the footer.

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.

Allows you to add the main heading, description, and a carousel with images.

  1. Use the field Color scheme to change Background.
  2. Heading allows you to set a heading for the section.
  3. Enable heading animation field enables the heading animation after page load or scroll to the section.
  4. Additional information field allows you to add text to the section.
  5. Enable button field includes a button/link to go to the general collections page.
  6. Button style field sets the button's style.
  7. Block Image slide allows you to set an image for the carousel.
  8. (Optional.) If you add an image, use the Image width slider to change the image size in the carousel.

Image resize

Allows you to add the main heading, description, and image with effect on scroll.

  1. Use the field Color scheme to change Background.
  2. Heading allows you to set a heading for the section.
  3. Enable heading animation field enables the heading animation after page load or scroll to the section.
  4. Additional information field allows you to add text to the section.
  5. Enable button field includes a button/link to go to the general collections page.
  6. Button style field sets the button's style.
  7. Image file selector allows you to select or upload your image file.
  8. (Optional.) If you add an image, use the Image width slider to change the image size in the section.

Image cards

Allows you to add the main heading, description, and 3 images/cards with effect on scroll.

  1. Use the field Color scheme to change Background.
  2. Heading allows you to set a heading for the section.
  3. Enable heading animation field enables the heading animation after page load or scroll to the section.
  4. Additional information field allows you to add text to the section.
  5. Enable button field includes a button/link to go to the general collections page.
  6. Button style field sets the button's style.
  7. Image file selector allows you to select or upload your image files.

Collection list

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

  1. Enable border top field enables the display of a line above the section.
  2. Block Collection allows you chose the collection.

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

  1. Use the field Color scheme to change Background.
  2. Image field allows you to set a image for the section.
  3. Image width field allows you to set the width for the image.
  4. Heading field adds a header collection.
  5. Enable heading animation field enables the heading animation after page load or scroll to the section.
  6. Subheading field is used for highlighting some short text in a vertical position.
  7. Additional information field displays additional text information.
  8. Enable button field includes a button/link to go to the general collections page.
  9. Button label field allows you to add text for the button/link.
  10. Button style field sets the button's style.
  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. Small left image field allows you to set a image for the section.
  14. Small image width field allows you to set the width for the small left image.
  15. Small right image field allows you to set a image for the section.
  16. Small image width field allows you to set the width for the small right image.
  17. Image ratio field allows you to choose the orientation of pictures for cards.
  18. Image fit field allows you to choose the fit of pictures for cards.
  19. Show second image on hover field enables the display of the second image on hover
  20. Show vendor enables the display of the vendor.
  21. Show description field enables the display of the description for the product.

Ordered list

Allows you to add up to 6 ordered list items and customize them.

  1. Heading allows you to set a heading for the section.
  2. Enable heading animation field enables the heading animation after page load or scroll to the section.
  3. Subheading allows you to set a subheading for the section.
  4. Description field allows you to add text to the section.
  5. Number font size slider allows you to change the font size of the numbers in the section.
  6. Enable border top field enables the display of a line above the section.
  7. Block List item allows you to upload or select an image for a list item, change the image's size, and add text.

The section allows you to select products and customize their display.

  1. Heading allows you to set a heading for the section.
  2. Description field allows you to add text to the section.
  3. Subheading allows you to set a subheading for the section.
  4. Products field allows you to select products that will be displayed.
  5. Products to show field allows you to select the total displayed quantity of products.
  6. Image field allows you to set a image for the section.
  7. Image ratio field allows you to choose the orientation of pictures for cards.
  8. Image fit field allows you to choose the fit of pictures for cards.
  9. Show second image on hover field enables the display of the second image on hover.
  10. Show vendor enables the display of the vendor.
  11. Show description field enables the description for the product.

Testimonials

The section is designed for the review carousel.

  1. Subheading allows you to set a subheading for the section.
  2. Enable border top field enables the display of a line above the section.
  3. Block Testimonials slide option Text adds a text for its slide.
  4. Block Testimonials slide option Author picture adds an author's avatar for its slide.
  5. Block Testimonials slide option Author name adds an author's name for its slide.
  6. Block Testimonials slide option Author position adds an author's position for its slide.

Video

The section allows you to add a video to the page.

  1. Heading allows you to set a heading for the section.
  2. Enable heading animation field enables the heading animation after page load or scroll to the section.
  3. Subheading allows you to set a subheading for the section.
  4. Description field allows you to add text to the section.
  5. Button link field includes a button/link to go to the general collections page.
  6. Button style field sets the button's style.
  7. Cover image field allows you to set a cover image for the section.
  8. URL field allows you to add a link to a video source.
  9. Block with images top allows you to set two small images at the top of the section.
  10. Block with images bottom allows you to set two small images at the bottom of the section.

Image with text

Decorating section with title, image, link and text.

  1. Position field allows you to select the position of the section
  2. Heading allows you to set a title for the section.
  3. Image field allows you to set a image for the section.
  4. Image ratio field allows you to set a orientation for the image.
  5. Text allows you to set a description for the section.
  6. Column text allows you to set a description for the section below the line.
  7. Desktop layout field allows you to select the position of the picture within the section.
  8. Enable border top field enables the display of a line above the section.
  9. Block Author allows you to select or upload an author's avatar and add an author's name.

Blog posts

The section allows you to select a blog and customize it.

  1. Heading field adds a header for the section.
  2. Blog field allows you to choose a blog.
  3. Blog posts field allows you to select the number of columns in one line.
  4. Show featured image field enables the display of an image for the blog post.
  5. Show date field enables the display of the date for the blog post.
  6. Show tags field enables the display of tags for the blog post.
  7. Show author enables the display of the author for the blog post.
  8. Enable "Explore our blog" field enables the display of a button linking to all blog posts.
  9. Enable border top field enables the display of a line above the section.

Email Signup

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

  1. Subheading allows you to set a subheading for the section.
  2. Heading field adds a title to the top of the form.
  3. Enable heading animation field enables the heading animation after page load or scroll to the section.
  4. Description field adds a title to the bottom of the form.
  5. Button style field sets the button's style.
  6. Enable border top field enables the display of a line above the section.

Image collage

Decorating section with title, image, link and text.

  1. Subheading allows you to set a subheading for the section.
  2. Heading allows you to set a title for the section.
  3. Button label field allows you to add text for the button.
  4. Button link field set link for the button.
  5. Avatar allows you to set a left image for the section.
  6. Account name allows you to set an account name.
  7. Account description allows you to set an account description.
  8. Button style field sets the button's style.
  9. Block Image optionImage allows you to set a image for the block.
  10. Block Image optionimage width field sets the width of the image for the block.

Contact form

  1. Heading field sets a heading for the section.
  2. Text field sets a description for the section.
  3. Image top first allows you to set an image at the top of the section.
  4. (Optional.) If you add an image, use the Image width slider to change the image size.
  5. Image top second allows you to set an image at the top of the section.
  6. (Optional.) If you add an image, use the Image width slider to change the image size.

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 Modals allows you to enable and customize modals.
  9. Block Additional description optionHeading field sets a header block.
  10. Block Additional description optionContent field sets a content block.
  11. Block Share allows you to enable links from the list.

Product image banner

  1. Heading allows you to set a title for the section.
  2. Button label field allows you to add text for the button.
  3. Button link field set link for the button.
  4. Description field adds a title to the bottom of the form.
  5. Cover image field allows you to set a cover image for the section.
  6. Block with images bottom allows you to set two small images at the bottom of the section and to change their width.

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 heading for the section.
  2. Link field allows you to add text for the link.
  3. Button link field includes a button/link to go to the general collections page.
  4. Products to show field allows you to select the total displayed quantity of products.
  5. Enable border top field enables the display of a line above the section.
  6. Image ratio field allows you to choose the orientation of pictures for cards.
  7. Image fit field allows you to choose the fit of pictures for cards.
  8. Show second image on hover field enables the display of the second image on hover.
  9. Show vendor enables the display of the vendor.

Size chart

To add a size chart, follow these steps:

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

Collections page

Collection banner

  1. Additional word field sets the additional word to the collection heading.
  2. Show additional word field enables the display of the additional word.
  3. Show collection description field enables the display of the description.
  4. Show collection image field enables the display of the image.
  5. Image bottom first allows you to set an image at the bottom of the section.
  6. (Optional.) If you add an image, use the Image width slider to change the image size.
  7. Image bottom second allows you to set an image at the bottom of the section.
  8. (Optional.) If you add an image, use the Image width slider to change the image size.

Product grid

  1. Products per page field sets the number of displayed cards
  2. Image allows you to set an image in the grid.
  3. Image position allows you to choose an image position in the grid.
  4. Image ratio field allows you to choose the orientation of pictures for cards.
  5. Image fit field allows you to choose the fit of pictures for cards.
  6. Show second image on hover field enables the display of the second image on hover.
  7. Show vendor enables the display of the vendor.
  8. Enable filtering field enables filtering.
  9. Enable sorting field enables sorting.

Collections list

Displays a list of all collections

  1. Heading field sets a heading for the section.
  2. Sort collections by field filters the collection by the specified parameters.
  3. Image field allows you to choose cover for collections items.
  4. Image ratio field allows you to choose the orientation of pictures for cards.
  5. Image fit field allows you to choose the fit of pictures for cards.
  6. Show description enables the display of the collection description.

Cart

  1. Use the field Color scheme to change Background.
  2. Image fit field allows you to choose the fit of pictures for cards.
  3. Show vendor enables the display of the vendor.
  4. Block Subtotal option Enable cart note field sets a note.

Blog

  1. Show featured image field enables the display of the image for the blog post.
  2. Show tags field enables the display of the tags for the blog post.
  3. Show date field enables of the date for the blog post.
  4. Show author enables the display of the author for the blog post.
  5. Show excerpt enables the display of the excerpt for the blog post.

Blog post

  1. Header layout allows you to select the location of the image.
  2. Block Article header option Show date field enable date for the blog post.
  3. Block Article header option Show tags field enables the display of the tags for the blog post.
  4. Block Article header option Show author field enables the display of the author for the blog post.
  5. Block Article footer option Show date field enable date for the blog post.
  6. Block Article footer option Show author field enable author for the blog post.
  7. Block Article header option Featured image height field allows you to select ratio image.
  8. Block Article header option Share allows enable links from the list.
  9. Block Article footer option Show date field enable date for the blog post.
  10. Block Article footer option Show author field enables the display of the author for the blog post.
  11. Block Article footer option Image author field allows you to set an image.
  12. Block Article footer option Share allows enable links from the list.

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. Ceramics
  3. Decor
  4. Clothing
  5. Beauty

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