When creating Exchange we had one main goal: To Make WordPress eCommerce Easier. This includes everything from the insertion of products on our Custom Add Product Page, to dealing with payment processors, and even creating beautiful, functional, custom WordPress themes.
We have an ever expanding Codex for the nitty gritty details of creating a theme for Exchange, but I wanted to give you a few basic tips as well to help you dive in to creating a custom theme for your site.
1. Start with your most important pages
A customer’s first impression with your online store can make all the difference. This is why I recommend starting your custom design with the Store page, which holds an archive of all of your products. Whether you’re selling an eBook or your band’s latest album, you want to present your product in an attractive way. The Store page is a great place to show a featured image, your product title, price, and of course a link to see full details.
Which leads to the next page you should create: the single product page. This is where you can include more images, a quick description, and Exchange even allows you to add a variety of meta information from the advanced section including categories, tags, download expirations, etc. This is the last screen your customer will see before making their purchase decision, so be sure to include any relevant information needed to make the sale.
The third important item you’ll want to pay special attention to is the Super Widget. The iThemes Exchange Super Widget is what is used to display purchase options, add items to your cart, apply coupons and multiple other things. You’ll definitely want to make sure and apply special attention to this widget as it will play a major part in the experience your customer has while purchasing from your site.
2. Make sure to enable all add-ons that you want to provide integration for
One of the mistakes I made when creating my first was forgetting to turn on all the add-ons that I wanted to provide integration for. For example, the Super Widget includes fields for applying coupons when you have the Basic Coupons add-on enabled. I went through styling my entire theme before realizing that I didn’t have that add-on enabled, so that section of the Super Widget looked a little funky when I enabled it. Easy fix, but would have been easier to have just enabled it from the beginning!
This will not only help save you time, but will provide your theme with more flexibility as it will have styling for as many add-ons as possible. Since you won’t always know which add-ons someone using your theme will have enabled, it’s best to provide styling for as many as you can.
3. Don’t be afraid to think outside the box
Just because the default Exchange templates display pages in a certain way doesn’t mean you have to stick to that.
- Try out new ways to display your grid of products.
- Try not displaying them in a grid at all.
Our Exchange Theme API allows you to have control over how you’d like your theme to present the store’s content.
4. Use a Sample Exchange Store XML
Nobody wants to insert sample products over and over again when testing out and creating new themes. Much like the Theme Unit Test that you should be used to, you can create an importable file of data to auto-insert all of those products for you.
This saves time, but also allows you to make sure you’ve covered all possible options for how a product might look.
- What if the product doesn’t have images?
- Does your single product page display a list of categories/tags?
- What if the product title is really long?
- How does the price field look when it has 7 figures? (Who knows, somebody might be selling million dollar ebooks!)
I’ve created a sample one for you that you’re welcome to use. You can even use it as a starting point to make one for yourself. Download the Exchange Unit Test XML file here and use the WordPress importer to stock your store with some sample products.
Free theme you can use to get started
Shortly after iThemes Exchange launched, we also released a free theme for you to use. This theme is a child of TwentyThirteen, the default theme for WordPress 3.6.
We named ours August (after it’s birth-month) and you can view a demo or download it for free below.