Artificer is a WooCommerce theme with an arts and crafts aesthetic designed for sole traders and small startups looking to sell handmade products.
Of course there are alternate stylesheets for other types of stores, plus the theme is responsive placing it right into the hands of your customers thanks to mobile optimized layouts.
Installing your Theme ↑ Back to top
To learn how to install your theme please reference our documentation here: Installing a Theme
Checking your theme version ↑ Back to top
You can confirm your theme and WooFramework version by going to: Artificer > Framework
Activate your Theme Key ↑ Back to top
After you install your theme, be sure to activate your theme key by downloading and installing the WooCommerce Helper plugin. This will verify your site when contacting support and will enable 2-click updates for quick theme upgrades down the road.
Updating your theme
It is very important to ensure you have the latest version of your theme at all times. This is the best way to proactively troubleshoot issues on your site.
Set up The Homepage ↑ Back to top
After you’ve installed the theme, you will notice your homepage looks a bit empty. You must install and activate the WooCommerce plugin to begin setting up your homepage. To learn more about setting up WooCommerce please see the docs here: Setting up WooCommerce
Stand First ↑ Back to top
This is the main text area on the homepage with a button for a call to action.
The main headline is your site title which you can set in Settings > General. To set the text beneath go to: Artificer > Settings > Homepage Options > Stand First to add your text.
Other homepage content ↑ Back to top
There are a couple of other options on the Homepage theme option. First you can specify your store information (phone number, email address) and whether you want to display that on the homepage or not. This only appears on the homepage sidebar. Secondly, you can define whether to display your latest tweet or not. This will also appear in the sidebar and your Twitter ID is specified in the contact details tab.
Homepage Products ↑ Back to top
The products on your homepage are pulled in from your featured products and ordered chronologically.
To mark a product as featured go to: Products > Products and select the Star in the featured column (see image below).
You can alternatively select the Quick Edit option to see the Featured product box.
The fourth most recent product will appear larger than the rest, so remember to re-order the products by date accordingly.
WooCommerce Image Sizes ↑ Back to top
While we’re talking about the featured products, you’ll want to be sure to set your WooCommerce image sizes correctly. In particular, since the fourth most recent product has a larger image size than the rest. Set your image sizes as follows.
- Catalog Images – 197px width / 197px height
- Single Product Image – 425px width / 425px height
- Product Thumbnails – 100px width / 100px height
If you’ve already uploaded product images be sure to use the Regenerate Thumbnails plugin to create new thumbnails for your site.
WooCommerce Options ↑ Back to top
Beneath the Homepage settings you’ll find the WooCommerce Options. Here there are a few options regarding your products, and the layout of your WooCommerce pages.
Products ↑ Back to top
Here you can specify how many products to display per page, on product archive pages.
Layout ↑ Back to top
Here you can specify whether or not to display a sidebar on the shop archive pages. If so you can populate that sidebar with widgets as usual. However if you choose not to display a sidebar here the product container will simply expand to fill the full width of the theme wrapper.
Custom Shortcodes ↑ Back to top
There are three custom shortcodes built into Artificer which you can use throughout your site.
Mini Features ↑ Back to top
The mini features shortcode allows you to to easily display short snippets of content in columns of 3 alongside icons, as displayed in the screenshot above.
This shortcode should be laid out like so:
[mini-feature icon=”http://path.to/image.png” title=”Feature 1″]
[mini-feature icon=”http://path.to/image.png” title=”Feature 2″]
[mini-feature icon=”http://path.to/image.png” title=”Feature 3″]
Take note that features will most effectively be displayed in multiples of three as the CSS automatically sorts the mini features in to rows of 3. Also note than the mini features must be wrapped inside the [mini-feature-wrap].
Sale ↑ Back to top
The [sale] shortcode allows you to easily display a sale banner anywhere on your site. This tandems nicely with our sale page template.
To use the [sale] shortcode simply wrap your sale banner content within [sale] tags like so:
[sale]Sale now on, up to 50% off all stock![/sale]
Sticky ↑ Back to top
The [sticky] shortcode allows you to easily display notices on your site which are styled to appear as post-it notes. This is perfect if you want to make a short piece of content stand out somewhere on your site. It can be aligned to the right or the left of your content and be given a custom class.
To use the [sticky] shortcode simply wrap your message within [sticky] tags like so:
[sticky]This is a sticky note, awesome![/sticky]
As you would expect, you can attach any class name you like to the sticky shortcode, just incase you want to add any further custom styles to a particular sticky.