Sections for Boundless

Theme content is built using sections. Sections are customizable blocks of content that determine the layout and appearance of different pages on your online store.

Static sections are sections that appear in predetermined locations in your online store. These sections can't be removed or rearranged. Static sections might include headers, footers, navigation sections, or content sections on pages like product pages and collection pages. For example, the Product section determines the appearance of each product page on your online store.

Dynamic sections are optional sections that you can use to customize the layout of your home page. On your store's home page, you can add, rearrange, and remove dynamic sections to create the page layout. You can have up to 25 dynamic sections on your home page.

You can learn about Boundless's unique selection of sections and how to customize them to suit your business.

Static sections

Boundless includes the following static sections:

Dynamic sections

Boundless includes the following dynamic sections:

The sidebar menu acts like a table of contents for your store. This menu appears on all pages of your store.

The sidebar menu displays two menus. The Primary menu is displayed at the top in larger type, and the Additional menu is displayed below the Primary menu in smaller type.

You can also display links to your social media accounts in the sidebar. These links are controlled by your theme settings.

Customize the sidebar menu

  1. Click Sidebar menu.

  2. From the Primary menu list, select the menu you want to display as the primary menu. Typically, this is your store's main menu.

  3. From the Additional menu list, select the menu you want to display below the primary menu. Typically, this is your store's footer menu.

  4. Click Save.

Announcement bar

You can enable the announcement bar to show a message to your customers. Your message is completely customizable and can include contact information, a link, information about store events or sales, and your store's slogan or branding message. The announcement bar can appear on all pages of your store, but you can choose to display it on the home page only.

Enable the announcement bar

  1. Click Announcement bar.
  2. Check Show announcement.

    Select Home page only to display the announcement message on the home page only.

  3. Enter the text for your announcement.

  4. Optional: Enter a URL to add a link to your announcement.

  5. To change the color of the announcement bar background, click the Bar color swatch and choose a color.

  6. To change the color of the announcement text, click the Text color swatch and choose a color.

  7. Click Save.

Your theme's header is the section that appears at the top of every page in your store. You can customize the logo that appears in the header.

You can add an additional logo that's displayed only on your home page. The home page logo is displayed over the slideshow, so you should choose a version of your logo that's easy to see on top of an image.

  1. Click Header.
  2. In the Logo area, click Select image, and then do one of the following:
    • To select an image that you have already uploaded to your Shopify admin, click the Library tab.
    • To select a stock image from Burst, click the Free images tab. From here you can enter a search term, or browse the image categories.
    • To select an image from your local computer, click the Library tab, and then click Upload.
  3. Optional: In the Home page logo area, click Select image, and then do one of the following:
    • To select an image that you have already uploaded to your Shopify admin, click the Library tab.
    • To select a stock image from Burst, click the Free images tab. From here you can enter a search term, or browse the image categories.
    • To select an image from your local computer, click the Library tab, and then click Upload.
  4. Enter the logo's width in the Custom logo width (in pixels) field.
  5. Click Save.

Slideshow

You can add a slideshow to your home page that rotates up to five images.

It's best to use high resolution images for your slides. Use images that are 3840 x 2160 px or larger, but don't exceed Shopify's upload limits.

Because the size and shape of the slideshow depends on the size and shape of the customer's device, your slideshow images will be cropped on some screens. Try to use images that have a focal point in the middle so that the important part of each image is always visible.

To learn more about the best practices for slideshow images, see Uploading images.

The slideshow section includes the following settings:

  • Slide height - Set the height of the slideshow. Select Adapt to first image slide height to base the height of your slideshow on the height of your first image.
  • Auto-rotate slides - Set the slideshow to play automatically.
  • Change slides every - Choose how often to change slides.
  • Text and icons - Choose a color for the text and icons that appear over the slideshow.
  • Image overlay - Add a layer of color over your image slide. An overlay can make slideshow text easier to read.
  • Opacity - Set the opacity of your overlay.
  • Image - Add an image slide to your slideshow.
  • Image position - Choose the most important area of the image to focus on in the slideshow.
  • Heading - Add a heading to your slide.
  • Button text - Add a button with a text label to your slide.
  • Button link - Set the URL or page that you want the button to link to. Paste in the URL or select a page from the menu. If you do not want to include a button in the section, then leave this field empty.

Customize your slideshow

  1. Click Slideshow.

  2. Use the settings to customize your slideshow.

  3. Click Save.

Action bar

By default, the action bar shows your store's main menu. You can customize your menus so the action bar shows different items based on what page your customer is looking at. On the home page, the action bar is most often used to show your product collections. Within a collection, the action bar can show further subcategories or other related collections.

For example, if your store sells apparel, your action bar might show Men, Women, and Accessories on your home page. If a customer clicks Women, the action bar might then show Tops, Pants, and Footwear on the collection page.

To make your action bar work this way, use your main menu for links to your collections. Put links to other parts of your store (your Contact or About pages) in your footer menu.

Customize your action bar

  1. Click Action bar.

  2. From the Menu list, select the menu you want to display in the action bar.

  3. Click Save.

Your theme's footer is the section that appears at the bottom of every page in your store. With Boundless, you can display a menu and icons for the payment methods you accept in your footer.

You can also display links to your social media accounts in the footer. These links are controlled by your theme settings.

You can add a menu to your footer. This displays all of the menu's links in your footer, which you can use to highlight the common pages that your customers want to access. For example, you could add a menu that contains links to your contact and shipping policies.

  1. Click Footer.

  2. To select a menu, click Change. Select a menu from the list or click Create menu to create a new one.

  3. To edit the menu, click Edit menu.

  4. Click Save.

Add payment icons

You can display icons for the payment methods that you accept in your footer. This area displays the icons that are associated with the payment provider that you have enabled in the payment settings section of your admin.

  1. Click Footer.

  2. Check Show payment icons.

  3. Click Save.

Product

The Product section is the main customizable section for product pages. You can customize this section using the following options:

  • Skip first product image - When this option is enabled, the first product image shows only on collection pages, and not on product pages. Using this option, you can design your first product image to look best on collection pages and tailor your other product images to look better in the larger space provided on product pages.
  • Image style - Choose Tall/square or Wide.
  • Show vendor - Show the product brand or vendor in the product page. For a brand or vendor to show, you need to add a vendor to the product.
  • Show quantity selector - Let users specify a quantity to add to their cart.
  • Show dynamic checkout button - Let customers skip the cart and go directly to the checkout from the featured product section.
  • Product form width - Choose a Small or Large width.

You can also display product recommendations on the Product page.

Customize your product section

  1. Select Product pages.
  2. Click the Product section.
  3. Use the settings to customize your product page.
  4. Click Save.

Product recommendations

You can display recommended products on product pages to make it easier for customers to discover other products that might interest them.

Enable product recommendations

  1. Select Product pages.

  2. Click the Product recommendations section.

  3. Check Show dynamic recommendations to show product recommendations on your product pages.

  4. Optional: To change the title that appears above the recommended products, enter a new one in the Heading field.

  5. Optional: To show or hide the vendors in the product descriptions, use the Show vendor checkbox.

  6. Click Save.

Collection

The Collection section is the main customizable section for collection pages. You can customize this section using the following options:

  • Image style - Choose whether you want images to be Tall/square or Wide.

    Tall/square is best if your product images are square or in portrait orientation.

    Wide is best if your images are rectangular or in landscape orientation.

  • Image size - Choose an image size. If you show small product images, then you can fit more images in a single row. The number of images shown per row also depends on a customer's device and window size.

  • Add spacing between images - Increase the spacing around product images.

  • Show product vendor - Show the product brand or vendor below product images. For a brand or vendor to show, you need to add a vendor to the product.

  • Show sorting options - Select this option to let customers sort the products on your collection pages.

  • Show tag filtering - Select this option to let customers filter the collection by product tag.

  • Pagination type - Choose whether you want to show numbered pages or a View more button when there are multiple pages of products in the collection.

Customize your collection section

  1. Select Collection pages.
  2. Click the Collection section.
  3. Use the settings to customize your collection page.
  4. Click Save.

You can feature a collection on your home page. Featuring collections can help you promote sales and new collections.

The Featured collection section includes the following settings:

  • Collection - Choose the collection that appears in the section. Up to 50 products will be displayed from the collection that you select.
  • Image style - Choose whether you want images to be Tall/square or Wide.

    Tall/square is best if your product images are square or in portrait orientation.

    Wide is best if your images are rectangular or in landscape orientation.

  • Image size - Choose an image size. If you show small product images, then you can fit more images in a single row. The number of images shown per row also depends on a customer's device and window size.

  • Enable image spacing - Increase the spacing around product images.

  • Show product vendor - Show the product brand or vendor below product images. For a brand or vendor to show, you need to add a vendor to the product.

  1. Click Add section.
  2. Click Featured collection, and then click Select.
  3. Click Select collection, and then select a collection from the Collection list. Up to 50 products will be displayed from the collection that you select.
  4. Use the settings to customize the section.
  5. Click Save.

Newsletter

You can add a newsletter signup to your home page. This lets you collect customer email addresses for email marketing campaigns. You can learn more about email marketing on the Shopify blog.

Add a newsletter signup to your home page

  1. Click Add section.

  2. Click Newsletter, and then click Select.

  3. Enter a heading for your newsletter signup.

  4. Enter a subheading for your newsletter signup.

  5. Click Save.

Map

You can add a Google map to your home page to show customers where your business is located.

The map section includes the following settings:

  • Heading - Add a heading to your map section.
  • Address and hours - Add your store's address and hours to your map section.
  • Map address - Set the map to show your store's location.
  • Map link label - Add a button that links to your location on Google Maps.
  • Show pin - Add a pin that shows your store's specific location on the map.
  • Google Maps API key - Add your map's API key to the map section.
  • Image - Add an image that's displayed if the map doesn't load.
  • Image position - Set the placement of the image.

Add a map to your home page

  1. Click Add section.
  2. Click Map, and then click Select.
  3. Use the settings to customize your map section.
  4. Click Save.

Rich text

Use the Rich text section to provide any written content that you want to display on your home page, or to embed any page created in your Shopify admin. For example, you can feature upcoming events by embedding your blog page, or display a page with any of the following:

The rich text section includes the following settings:

  • Wide display - Decrease the margins on either side of your text.

  • Heading - Add a heading to your rich text section.

  • Text - Add and format your custom text. If you want to feature a page from your store, then click Add content and then click Page. Select a page to feature as your home page from the drop-down menu.

  • Size - Set the size of your text.

Add rich text to your home page

  1. Click Add section.

  2. Click Rich text, and then click Select.

  3. Use the settings to customize your rich text section.

  4. Click Save.

Video

You can add a YouTube or Vimeo video to your home page. Videos can engage customers and generate interest in your business.

To add a video, you need to find the video's sharing link:

  • YouTube - A Youtube sharing link looks like this: https://youtu.be/Oc5v_ToKP7c. You can learn how to copy the sharing link for a YouTube video in this YouTube Help article.
  • Vimeo - A Vimeo sharing link looks like this: https://vimeo.com/123456789. You can learn how to copy the sharing link for a Vimeo video in this Vimeo Help Center article.

The video section includes the following settings:

  • Heading - Add a heading to your video section.
  • Video link - Add the sharing link for your video.

Add a video to your home page

  1. Click Add section.
  2. Click Video, and then click Select.
  3. Use the settings to customize the video section.
  4. Click Save.

Custom HTML

In the Custom HTML section, you can use HTML code to create custom content for your home page. For example, you can use HTML to format text blocks, create tables, or embed content from a third-party website.

Add a custom HTML section to your home page

  1. Click Add section.

  2. Click Custom HTML, and then click Select.

  3. Click Custom HTML, and enter the HTML code that you want to add to your home page.

  4. Click Save.

Ready to start selling with Shopify?

Try it free