Menu
0

Documentation

Shopify Documentation

Much of the Shopify backend is managed entirely by Shopify, which makes them the best place to look for how-tos and documentation on the core features.

Theme Customization Basics

Online Shop Documentation

Shopify Help Center

Contact Customer Support

All customizations not covered by the Shopify documentation will be covered below, but also be on the lookout for inline instructions and help text within the backend. Guidence has been embedded in the backend fields as much as possible to reduce the need for referring to this documentation.

 

Quick Links

Shopify Admin

Theme Settings & Customizer

Blog Posts

Pages

Navigation Menus

Products

Orders

Shipping

Payments

Staff Accounts

 

Sections (Home page)

Use the Theme Customizer to configure the home page via configurable sections and blocks. Each section can be ordered, configured or deleted through the drag and drop customizer interface.

Note that the header and footer sections apply to all pages of the site, but the remaining blocks represent the options for the page you are currently viewing. To view the available sections and options for a given page navigat to it in the theme customizer and the available sections will be displayed.

Templates that support sections:

  • Home
  • Product listing / Collection
  • Product
  • Search

 

Products

Products are managed in 4 places depending on the nature of the edits you would like to make:

Sales & Basics

All information relating to the selling of products in addition to basic descriptions, images, and URL are managed under the Products tab.

  • Title - The display title of the product.
    • Note that using a hyphen will break the product title into 2 lines, the second half is intended for flavor or other product identifier and will use a lighter weight font on product pages and banner images.
  • Description - The basic description of the product that will display near the top of the page. SHould be kept fairly short to avoid pushing the purchase UI too far down the page.
  • Images - Product image, backgrounds and videos
    • The first image will be used as the product hero image, which is duispalyed in search results, home page banners product listing pages and the initial image loaded on the single product page.
    • To override the Featured section background image enter background into the Alt text of the image you wish to set as the background. Background images should be at least 1024 x 585, but no greather than 2000px wide.
    • To feature a video in the product image gallery simply paste in the youtube URL into the Alt text of the image.
    • Product images should be at least 600px wide and display best when the aspect ratio is relatively balanced -- square, or 4:3. However, any image size and dimensions are technically supported.
  • Product Type & Vendor - Not required.
    • Note: To display this information you must activate this feature in the Product section.
  • Collections - A.K.A. categories, used for product organization as well as breadcrumbs
    • Adding products to the Feature collection will display the product on the home page.
    • Items which have a Compare At Price will automatically be added to the On Sale Collection, which will add the On Sale badge.
    • Products in the New Arrivals Collection will display a New badge.

More info on products here →

Reviews

Reviews can be viewed, curated and managed on a per product basis by clicking on More Actions from the edit product page and selecting View reviews for this product.

  • To perform bulk actions such as publishing deleting or unpublishing, use the check boxes next to the review you wish to include in the bulk action and select the action in the dropdown at the top of the list
  • To manage a single review click on the title in the list
    • Control visibility on the site with the Publish / Unpublish button located in the upper right corner
    • You cannot modify the review text, but you can post a publis response usng the reply feature.

More information about reviews can be found here →

Product Tabs & Featured Section

The 2 tabs located in the lower half o the product page are option. If you wish to add content to the tabs you must use the Metafields Editor by clicking on More Actions from the edit product page and selecting Edit Metafields.

Note: All Namespaces values will be moxie regardless of the field

Note: You can change the title of any tab globally via the Product section in the theme customizer.

Example

Featured Section

To display the featured content section (image background with headline, text and link) you need to have a headline at a minumum.

  • Headline
    • Click Add New Metafield
    • Key: headline
    • Value: Text for the headline of the section
    • Click Add to save your changes
    • Required: Yes. without the headline the section will not display.
  • Body Content
    • Click Add New Metafield
    • Key: content
    • Value: Text for the body of the section, supports HTML
    • Click Add to save your changes
    • Required: No
  • Background Image
    • The background image will use a dafault photo. To override this add a product image and enter background into the alt text.
    • Required: No
Product Details

The product details tab requires only 1 metafield to be created:

  • Click Add New Metafield
  • Key: details
  • Value: Text or HTML for the content of the section. Supports all HTML including embedded media. Enter <!-- break --> to create a second column.
  • Click Add to save your changes
  • Required: No

Example:

The following will create 2 columns with a list in the left column.

<p>This is one column with a list</p>
<ul>
    <li>List item</li>
    <li>...</li>
</ul>
<!-- break -->
<p>Here is a second column</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
More Information

The more info tab requires only 1 metafield to be created:

  • Click Add New Metafield
  • Key: more
  • Value: Text or HTML for the content of the section. Supports all HTML including embedded media.
  • Click Add to save your changes
  • Required: No

Global Display Settings

Basic display settings that apply to all product pages can be managed in the Product section in the theme customizer. This is primarily for controlling the display of the following:

  • Quantity message
  • Product Vendor
  • Saved Ammount
  • Compare at price
  • Tab Titles
  • Related products row
  • Share buttons
  • Reviews

 

Settings

The settings found under the General Settings tab in the theme customizer is ment to control all global aspects of the look and feel of the theme. Settings for fonts, colors, defaults and any other display option that can be controlled that is not dictated by a Section/block setting can be found here.