Documentation

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!
  • Support Shopify sections for an easier way to customize your store's home page content.
  • Supports multi-currency. No need for any 3rd party currency apps.
  • 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.
  • 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 and featured videos too.
  • Social integration: share by Twitter, Facebook, Google+ and Pinterest.

Working with sections

Shopify's theme editor offers an easier way to customize your store's home page content. You can add, reorder, and remove content on your store's homepage using sections. Sections let you customize your store's design and content in a quick and visual way. See the Shopify docs for a great intro to using sections.

Multi-currency setup

It's easy to configure multiple currencies:

  1. Just click "Customize theme" then in the sidebar click "General settings" and see the section named "Currency". Make sure the default currency matches your store currency.
  2. Type the currencies you want to support separated by a comma.
  3. Don't forget to save your changes.

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", then in the sidebar click "General settings" 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 menu. Add your links to the menu and save.
  2. Click "Themes" from the admin sidebar and then click the "Customize theme" button.
  3. Click the section named "Header" and you can set the menu dropdown to your menu.
  4. Save your changes

NOTE: if you want a dropdown from one of your menu items, just use Shopify's Navigation area to create a menu with the same name. For example, let's say that you have a link on your top menu bar named Hats. Just create a menu 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 as many links as you like to the sidebar menu. Here's what you need to do:

  1. Click "Navigation" from the admin sidebar and create a new menu. Add your links to the menu and save.
  2. Click "Themes" from the admin sidebar and then click the "Customize theme" button.
  3. Click the section named "Sidebar" and you'll see a dropdown that you can use to select the menu you want to display.
  4. Save your changes

NOTE: if you want a dropdown from one of your menu items, just use Shopify's Navigation area to create a menu with the same name. For example, let's say that you have a link on your side menu named Shoes. Just create a menu 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

If someone submits the newsletter form they'll be added to the customers area in Shopify admin with a tag of "newsletter" so it's easy to identify where they came from.

  1. If you want to disable and hide the newsletter box, click "Customize theme" and click the "Sidebar" section then scroll down to the "newsletter form" heading. Don't forget to save your changes.

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 then click the cart icon in the header. Once you see the cart page, you'll notice a new section appear in the sidebar named "Cart page". Use the settings in that section and don't forget to save your changes.

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 1000px. Slides can be any height but for best results, make them all the same height.
  2. Click "Customize theme" and see the section named "Slideshow". Note the live preview of the site will need to be on the home page to see the "Slideshow" section.
  3. Use the slideshow options to control the speed and effects for your slideshow.
  4. Each individual slide can link to a different URL. You can also set the alt text foe SEO. Just add your image to the slide and click the "update" link and choose "Edit image".
  5. You can also set a caption for each slide. If you don't want a caption, just leave it blank.

Footer links

By default, the Sunrise theme uses the "Footer" menu for footer links. You can change that to pull links from a different menu like this...

Click "Customize theme" and click the "Footer" section. Choose your menu from the dropdown and don't forget to save your changes.

Theme styles

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

 

 

PLEASE NOTE: These instructions relate to themes that were purchased on or after December 14, 2016. If you're looking for instructions for an earlier version of the theme, you can find them here.