New Custom Theme Fields Module

Over the last couple of weeks, we’ve released some great features and improvements like Multiple Managers and Email Notification Settings. We’re culminating in a huge feature announcement before the end of January, but for now, let’s talk about our newest addition, Custom Theme Fields!

With the new Custom Theme Fields Module, designers using HTML and CSS in their custom theme can quickly add fields to Products, Categories, News Items, History Items, and Roster Items. After you’ve added fields to one of these things, you can use them in your dashboard just like other fields and then easily access the values from your custom theme.

There are countless uses for Custom Fields, but here are just a few:

  • Add a preorder checkbox field to products and when checked, display a special banner on product pages, letting your fans know that item is a preorder.
  • Add artist and album name textfields to products so that you can easily style them differently on product pages, rather than showing a single product name.
  • Add a label logo image field to history items so you can display the logo of the label that released a record on its history item page.
  • Add a product summary textarea field so that you can display product summaries on your shop’s index page and full descriptions on product pages.
  • Add a video textarea field to roster items so that you can add a YouTube video embed code for each of your bands, that always displays in a certain part of your roster item’s page, separate from the description.

Those are just some of the things you can do with Custom Fields, and to help make them as flexible as possible, there are four types of custom fields you can create: checkbox, image, textfield, and textarea. The checkbox, textfield, and textarea fields are self explanatory, but the image field is a special helper field that provides an image upload button next to a textfield. Just click the upload button, choose your image, and an image URL will appear in the textfield.

After you’ve set up your fields and entered values on your Products, Categories, News Items, History Items, and Roster Items, you can access the values from your theme’s custom HTML like so:

{% if product.custom['preorder'] %}
  This is a preorder!
{% endif %}

Or output the value like:

{{ product.custom['album-name'] }} by {{ product.custom['artist-name'] }}

To get started, just follow these steps:

  1. Go into your dashboard by signing in on the homepage.
  2. Go to your store’s “Modules” > “Manage Modules” area.
  3. Scroll to the bottom and install the “Custom Theme Fields” Module.
  4. Go into a Product editor (or Category, News Item, History Item, or Roster Item editor).
  5. Scroll down and click “Configure Custom Theme Fields”.
  6. Decide what new fields you’d like available on all of your products, add them and click save.
  7. The new fields will instantly appear. Add values and click save.
  8. Update your theme’s HTML to use your new fields!

With Custom Theme Field, the possibilities are endless, so we can’t wait to see what you come up with! If you have any questions, please feel free to contact us.