Templates

Spark includes templates for each page type that Shopify supports.

Spark's templates:

  • Addresses

  • Orders

  • About page

  • Article

  • Password

  • Blog

  • List collections

  • Contact page

  • Page

  • Search

  • Activate account

  • Register

  • Reset password

  • Login

  • 404

  • Cart

  • Account

  • Collection

  • Product

Home page

Spark's home page is incredibly customizable. It's one of Spark's core features. You can completely customize the page using over twenty home page sections.

We recommend that you visit our three store demos for Spark to see how these sections can be used and get a sense of how flexible the home page can be: Chic, Ecstatic, and Minimal.

For more information about customizing the home page, see the following articles for each section, displayed in the same order as in your Customize theme editor.

Blogs

  • Blog posts

Collection

  • Collection list

  • Featured collection

  • Featured collection row

Image

  • Image with features

  • Image with text

  • Slideshow

Product

  • Featured product

Promotional

  • Logo list

  • Newsletter

  • Social proof

Store Information

  • Map

  • Questions and Answers

Text

  • Inline features

  • Quotes

  • Rich text

  • Testimonials

  • Text columns with images

Video

  • Video

  • Video Hero

Collection pages

Spark's Collection pages template is used for all of your collections. Similar to home page and product page, the Collections pages template is flexible and comes with over fifteen sections that you can add.

And here it is on a mobile device::

See our article about the Collection pages section for more information about collection page-specific settings.

In addition to changing the look and feel how the collection items are displayed, you can add the following sections to your collection pages:

  • Blog posts

  • Collection list

  • Featured collection

  • Featured collection row

  • Image with features

  • Image with text

  • Logo list

  • Newsletter

  • Social proof

  • Questions and Answers

  • Inline features

  • Quotes

  • Rich text

  • Testimonials

  • Text columns with images

  • Video

  • Video Hero

Note that these settings and sections are shared between all of your store's collections.

Product pages

Spark's Product pages template is used for all of your products. Similar to the home page and collection pages, you can add feature sections, as well as customize the look and the feel of the page.

And here it is on a mobile device::

See our article about the Product page section for more information about product page-specific settings.

In addition to changing the look and feel of your product pages you can add the following sections to your product pages:

  • Blog posts

  • Collection list

  • Featured collection

  • Featured collection row

  • Image with features

  • Image with text

  • Logo list

  • Newsletter

  • Social proof

  • Questions and Answers

  • Inline features

  • Quotes

  • Rich text

  • Testimonials

  • Text columns with images

  • Video

  • Video Hero

Note that these settings and sections are shared between all of your store's product pages.

Blogs

You can customize how your Blogs page looks. The blogs page is where you can find a list of all your blog posts.

In addition to changing the look of the page, you can add the following section to your blog posts pages:

  • Featured collection

For more information about Shopify's blogs features, see their Blogs documentation.

Customize your blogs page

To customize your blogs page:

STEPS
  1. From your Customize theme editor, choose Blogs from the pages drop-down menu at the top of the screen.

  2. Select Blog pages from the list of sections.

  3. Choose how many Articles per row should be displayed. (Two, Three, or Four.)

  4. Choose whether to Show RSS icon.

    RSS is a way for customers to subscribe to your blog. Only some people use it, but the people who do love it. Learn more about it from RSS.com's article How Do RSS Feeds Work?. The RSS icon looks like this:

  5. Choose whether to Show published date.

  6. Choose whether this page should Show article excerpts.

    You can add excerpts when you add or edit the blog post. See Shopify's Display an excerpt from a blog post documentation for instructions. If you don't do this, Spark automatically adds a preview of the first few sentences and then trails off with a "...".

  7. Click Save.

Settings reference

The Blog pages template has the following settings:

Articles per row

Choose how many articles to show per row of blog posts. Choose Two, Three, or Four.

Show RSS icon

Check this checkbox to show an RSS icon that links to the current blog's RSS feed.

Show article excerpts

Check this checkbox to show article excerpts on the blogs page.

If you leave this unchecked, only the title and featured image are displayed.

Images aspect ratio

Choose to display your images as Square, Landscape, or Portrait. The default Natural setting will display the original orientation of your images.

Blog posts

You can customize how your blog posts look and feel.

This is a brief overview of the page template. For more in-depth information on the settings and content of blog posts, see our [Articles][article] page.

STEPS
  1. Add social share buttons so customers can quickly share posts to their social media accounts:

  2. Add a featured collection section:

You can also add the following section type to your blog posts pages:

  • Featured collection

Cart

Spark's cart page is simple and shows customers exactly what they need to see.

Here it is on a mobile device::

Set up the cart page

To customize the Cart page:

Settings reference

The following Cart settings are available:

Show notification when item is added to cart

Check this checkbox to open the cart drawer when the customer adds an item to their cart to let them edit their order or go to their cart or directly to checkout.

Enable cart notes

Check this checkbox to let customers add special shipping instructions for their order.

To learn how to edit your order notes label, see Shopify's [Enable order notes on your cart page][cart-notes] article

Collection list page

You can change the look and feel of your /collections/all page, which is where a customer can view a list of all of your product collections.

And here it is on a mobile device::

By default all of your collections are shown. But Spark can help you override this behavior, and let you instead show a list of collections you want to feature.

For more information about collections, see Shopify's Collections

Set up your Collection list page

Add selected collections

Settings reference

The following settings are available for the collections list template:

Select collections to show

Choose what collections are displayed. By default, the Collection list page will display all visible collections.

If you choose Selected, make sure to scroll to the top of these settings and Add collections.

Show collection description

Choose whether to Show collection description.

Collection descriptions are add in the Collections area in your Shopify dashboard.

Collections per row

Use the slider to display between 2 and 6 collections per row.

Images aspect ratio

Choose to display your images as Square, Landscape, or Portrait.

The default Natural setting will display the original orientation of your images.

Page

Pages are a Shopify feature. You can learn more about creating pages from Shopify's Pages documentation. Spark styles all pages to match your theme and theme settings.

You may be interested in Spark's special page templates:

  • About page

  • Contact page

Or you may be interested in adding image grids to pages

About page

Pages are a Shopify feature. You can learn more about creating pages from Shopify's Pages documentation. Spark styles all pages to match your theme and theme settings.

You can change the page template to page.about, which allows you to prepend your page with up to 5 images and a description.

How to set up an about page

To make any page into an about page:

Settings reference

Bonus: You can also add special content layouts to your about pages.

Settings reference

The following settings are available for each image you add to the About page:

Image

Add or upload an image for the current collage block.

Paste a link to an MP4 file that should be auto-played in the collage block, taking the place of the image.

For more information, see our article about how to add a video.

About pages have the following settings:

Intro

Add some introduction text to the about page. We recommend keeping this to a short paragraph or two.

Contact page

Pages are a Shopify feature. You can learn more about creating pages from Shopify's Pages documentation. Spark styles all pages to match your theme and theme settings.

You can change the page template to page.contact, which allows you to prepend your page with a special image and display a contact form.

How to set up a contact page

To make any page into an contact page:

Settings reference

Settings reference

Contact pages have the following settings.

Image

Add or upload an image for the current collage block.

Password page

Before you launch your store, you can use Shopify's password page feature to stop customers from looking at your store. Only the people you give a password to can view your store.

Set up your password page

To set up Spark's password page template:

  1. Check out Shopify's Add password protection to your online store documentation to learn how to password protect your store.

Settings reference

The password page has the following settings:

Heading

Add heading text.

We recommend keeping this short. Just a few words long.

Text

Add the main page body text.

We recommend keeping this to a paragraph or two. You can use rich text features here. Make some of your text bold or italic. You can also add links.

Show share buttons

Check this checkbox to show sharing buttons that redirect customers to social media websites, prompting them to share your store.

The buttons include Pinterest, X (Twitter), and Facebook.

404 page

Spark has a 404 page template. "404" is a code used on the web that means "The page cannot be found." A customer might end up on a 404 page if they typed in a URL wrong, or if the page they are visiting no longer exists because you have hidden or deleted it.

You can change your 404 page's text content in the theme's Language editor. Read Shopify's language documentation to learn more about how to change the wording in your theme.

Add special layouts to pages with shortcodes

Create unique grid layouts and accordions on your pages with our special "shortcodes." Shortcodes are small blocks of HTML that you can paste directly into the page text editor in your Shopify admin.

Shortcodes are supported on Pages, About pages, and Blog posts. Accordion shortcodes are also supported on Product pages, great for additional product details.

Follow the instructions below to use and edit shortcodes for:

  • Accordions with collapsible tabs

  • Grid layouts with image and text

Add accordions with shortcodes

The accordion shortcodes create collapsible tabs with headings that reveal more text when clicked on. They're great for adding additional details to your pages.

Follow the steps below to use our shortcode generator with easy-to-use fields that automatically creates a shortcode without needing to edit the HTML yourself.

Steps

  1. Finally, click View page to see how your accordions look on your page.

Add grid layouts with shortcodes

The grid shortcodes lets you create multiple columns and sizes of both images and text blocks.

We'll walk through editing the code step-by-step below, so you won't have to know exactly how HTML or code tags work to make the edits you need.

Before we begin, we have a few recommendations to keep in mind:

Recommended

  1. Use images with the same height in pixels.

  2. Backup your original page content.

  3. Add the images before editing the HTML.

Steps

In your Shopify admin: