Documentation (pre Shopify sections)

This only applies to theme licenses that were purchased before December 14, 2016. If you purchased the theme after that date, please visit the current documentation.

Please note that normal support hours are Monday to Friday, 9am to 5pm GMT. We aim to reply to all emails within 24 hours. You can use the contact form to get in touch.

Theme features

  • Responsive design: looks great on desktops, laptops, tablets and mobiles. Give it a try on your iPhone or iPad now.
  • Highly customizable: change colors, fonts, background image through the theme settings. No coding required!
  • Supports multi-currency
  • Product sorting on collection pages - sort by price, A to Z, newest etc.
  • Great for SEO: uses the latest Shopify SEO features and product data is formatted for schema.org so that product listings are optimized on search engines.
  • Branded checkout: a seamless checkout for your customers using your logo and color scheme. You can also add a custom checkout header to your checkout screens!
  • Customer accounts: customers can register, login, change addresses and view past orders.
  • Flexible slideshow: a home page slideshow that can be any height.
  • Home page content: you can feature links to collections and products on your home page. Optionally include welcome text too.
  • Newsletter integration: easily link your Mailchimp account to the newsletter form.
  • Social integration: share by Twitter, Facebook, Google+ and Pinterest.

Products per row

You can easily set the number of products displayed on each row.
  1. Click "Customize theme" and see the section named "Collection page". You can choose the number of products per row.

Controlling collection thumbnail image height

Your collection grid can look a little messy when the featured product images are all different sizes. For best results, try to make sure all your featured product images are the same size and shape. If that isn't possible, the theme includes an option that allows you to limit the maximum image height in your collection grid:
  1. Click "Customize theme" and click the section named "Collection page".
  2. Tick the checkbox named "Limit image height" and enter the maximum image height in pixels.
  3. Save your changes.

Multi-currency setup

It's easy to configure multiple currencies:

  1. First, you need to modify your money formats. That's part of Shopify admin. Just follow, these instructions...

    Set money format for Shopify currency
  2. Then see the section named "Currency" in your theme settings. Make sure the default currency matches your store currency.

Using Google fonts

It's easy to use Google fonts in your theme.

  1. You can choose a different font for your headings and body text.
  2. Click "Customize theme" and see the section named "Typography".
  3. Choose your font by clicking the dropdown labelled "Font".
  4. You can also choose the font weight and style.

Top menu bar setup

You can add any links you like to the top menu bar. Here's what you need to do:

  1. Click "Navigation" from the admin sidebar and create a new linklist. Add your links to the linklist and save.
  2. Click "Themes" from the admin sidebar and then click the "Customize theme" button.
  3. Click the section named "Navigation" and look for the "Main menu" heading.
  4. Choose your linklist from the "Choose menu" dropdown
  5. Save your changes

NOTE: if you want a dropdown from one of your menu items, just use Shopify's Navigation area to create a linklist with the same name. For example, let's say that you have a link on your top menu bar named Hats. Just create a linklist named Hats, add a few links to it and it'll automatically appear as a dropdown on your top menu bar.

Sidebar menu setup

You can add any links you like to the sidebar menu. Here's what you need to do:

  1. Click "Navigation" from the admin sidebar and create a new linklist. Add your links to the linklist and save.
  2. Click "Themes" from the admin sidebar and then click the "Customize theme" button.
  3. Click the section named "Navigation" and look for the "Sidebar menu" heading.
  4. Choose your linklist from the "Choose menu" dropdown
  5. Save your changes

NOTE: if you want a dropdown from one of your menu items, just use Shopify's Navigation area to create a linklist with the same name. For example, let's say that you have a link on your side menu named Shoes. Just create a linklist named Shoes, add a few links to it and it'll automatically appear as a dropdown in the side menu.

Adding a contact form

You can easily add a contact form to a page. In Shopify admin, click "Pages". Click the page that you'd like to add a contact form to. You'll see a section named "Template" near the bottom of the screen. Choose "page.contact" and you'll have a fully working contact form!

Setting up the newsletter form

It's easy to link your newsletter form to a Mailchimp subscriber list. These instructions assume that we're using the new version of Mailchimp...

  1. You'll need a free Mailchimp account
  2. Login to your Mailchimp admin area and create a new list (or you can use an existing list)
  3. Click the list you'd like to use for holding your Shopify newsletter subscribers
  4. Click "Signup forms"
  5. Click "Embed a form"
  6. Click "Naked"
  7. Here's the only bit of the code you need to copy...
  8. Now, in Shopify admin, click "Customize theme", click the "Sidebar" section. Look for the "Newsletter form" heading and paste that bit of code into the "Form action url" field

Terms & conditions checkbox

The Sunrise theme provides a checkbox on the cart page to ask your customers to agree to your terms and conditions. All you need to do is create a page named "Terms and conditions" then add your content to it. See Shopify's docs for more info on creating pages...
Docs - how to create a new page

If you don't need the agree terms checkbox, you can switch it off. To do that, just click "Customize theme" and see the section named "Cart page".

Adding HTML for an accordion

You add an accordion style section to a product description, page or blog. All you need is some simple HTML. For example this will give you an accordion with 2 sections...

<div class="gt-accordion">
<h4>First section title</h4>
<div>Content for first section goes here</div>
<h4>Second section title</h4>
<div>Content for second section goes here</div>
</div>

Adding responsive videos

You can easily add videos to your product descriptions, pages, blog posts etc. There's no need to add extra HTML. The theme handles that for you. All you need is the video embed code from somewhere like Youtube or Vimeo, like this...

Customer accounts

The Sunrise theme has a full set of templates for customer accounts. To enable customer accounts for your store, you'll need to edit your preferences...

  1. In Shopify admin click "Settings" then "Checkout".
  2. Scroll down to "Customer accounts" and change the option to "Accounts are optional".
  3. Don't forget to save your changes.

Using the slideshow

  1. Create your slides in your favorite graphics editor. Suggested width is 800px. Slides can be any height but for best results, make them all the same height.
  2. Open theme settings and expand the "Home page - slideshow" section to add your slides.
  3. You can switch each individual slide on or off and each slide can link to a different URL.
  4. You can also set a caption for each slide. If you don't want a caption, just leave it blank.
  5. Use the slideshow options in theme setting to control the speed and effects for your slideshow.

Footer links

The Sunrise theme uses the "Footer" linklist for footer links. You can edit the links by clicking "Navigation" from Shopify's admin sidebar.

Theme styles

Visit the styles page to see how standard HTML is styled.