Theme Documentation

By default, this theme uses the Main Menu link list as the menu on the left side. You can see this link list, and all others, under the Links tab in the admin panel. 

Additionally, in this theme, each collection is listed underneath "Chocolates" in the Main Menu. This was accomplished by adding a new link list with the same name as its parent link title. 

Navigation > Social Media Links

In the theme settings under Footer / Social Media, there are fields for the following social media integrations: 

• Facebook
• Twitter
• Google+
• LinkedIn
• Pinterest
• Email
• Mailchimp

By default, if you fill out any of these URL fields, the corresponding social media icon will become active and clickable on the left side menu. The exception is Mailchimp; if you fill out the Mailchimp signup URL field, a newsletter field will appear at the bottom left side of the footer. 

Homepage > Slideshow Images

If you'd like to show the full-screen slideshow on your store's homepage, in the Theme Settings, check the box under Homepage > Show slideshow on homepage. You can choose between a slide and fade animation, as well as set the speed at which slides change. 

If it's hard to read text on top of your images, you can choose to make the slideshow images more transparent by changing the slideshow's opacity. For this theme it is set at 0.4, which indicates that the images are 40% opaque. You can also add a background color to your navigation to make text easier to read, see above in Navigation > Background color on homepage.

For every slide image that you'd like to show on the homepage, you'll need to check the box that says Show slide # (where the # is whatever number slide it is). Below that is a field to upload the slide image.

There's also a field to add a URL where the image is linked. We don't recommend this unless something in the image indicates that it should lead to a particular page (for example, the image contains text with the name a particular collection or product). 

Top Bar > Fixed Header

This theme was designed with a slim, fixed top bar. When a page is scrolled, the background of the top bar will change to the color selected under Cart/search background color (on scroll). Leave that field empty if you don't want the top bar to have a color on scroll.

You can also add a slight drop shadow to this bar by clicking the box next to Show shadow on page scroll.

Top Bar > Add to Cart Styles

This theme comes with an ajax add-to-cart functionality -- that is, whenever a product is added to the cart, a window pops up on the top right of the screen, indicating the product and providing a link to the cart. The cart button inherits the button style settings specified in General Body Styles > Buttons. 

Collections Page > Choosing a layout

On the Collections page, you have the option to display rows of two, three, or four products.

Note: in an ordinary desktop browser, the product title and price are viewable over the image on hover, so if you're leaning toward a four-product row layout, keep in mind that the text needs to fit within the visible image dimensions. 

Product Page > Zoom-on-hover

By default, on the product pages, the products images zoom in when hovered over. You may turn this feature off by unchecking the box under Product Page >  Enable zoom on hover.

Forms > Dropdown and Input Styling

In the theme settings, you are able to style the background color and border color of form input boxes, product variant drop-downs, and quantity input boxes. This setting can be found under General Body Styles > Textboxes / Dropdowns.

Contact Page > Setting Up

To set up a page with a Contact form, you must first create a new page under the Pages tab in the left admin panel. Name it "Contact," or whatever you feel like naming it. 

For the form to show up, you will need to change the page template to "page.contact" in the Template dropdown. 

Contact Page > Sidebar

To add a sidebar to the Contact page template, you must first create a new page under Pages in the left admin menu. Call your page "Contact Sidebar" or something. Next, add whatever information you'd like the sidebar: a physical address, email and telephone number, social media URLs, etc. Publish the page. 

Now, to assign it as the contact page sidebar, select the new page in the theme settings, under Contact Page > Contact page sidebar.

Footer > Mailchimp Integration

This theme automatically integrates with the Mailchimp mailing list service. You will need a Mailchimp account, and within Mailchimp you'll need to create a mailing list for people to sign up for. 

After you make your list, you'll need to get some code from it. In Mailchimp, click on your list, and you should see a gray menu bar near the top. Click on the "For Your Website" button, and underneath that, "Signup Form Embed Code." 

From there, you'll need to find the textbox under the "Create Embed Code" button. Within the textbox, scroll until you find some code that says <form action="..." You will need to copy everything with those quotation marks. It should begin with http://, end with a bunch of numbers and letters, and look something like this: 

Paste this code in your Shopify Theme Settings under Footer / Social Media > Mailchimp signup URL. After that, visitors to your store will be able to sign up for your mailing list through the Newsletter box on the bottom left of the website.