This article covers how to customize your Artisan theme using the Theme Editor.

Artisan comes with a variety of settings which allow you to customize your store without modifying any code. To access these settings navigate to Storefront > My Themes and click on the "Customize" button associated with the theme currently applied to your store.

Here we will walk through the key settings available in each section and how they effect your store.

Colors

In the colors section there are a variety of options allowing you to tailor the theme colors to your branding. You have the ability to set these with either a HEX or RGB value, or use the color picker to chose a new color.

Fonts

In the fonts section you have control over the font families used throughout the site. You can control the body, headings, text logo, and product card title fonts separately. This section also has options to set font sizes for various elements.

Settings

Global

Number of links per column in drop downs allows you to select how many sub links are shown in each column of the navigation drop downs. The theme is setup to do a smart calculation based on this number to ensure that third level links don't get split into multiple columns. This also means if a column doesn't have enough space to fit the next group of second and third tier links it will start a new column.

Below is an example where the number of links per column is set to 10.

Desktop sticky navigation, when this option is checked, the navigation bar becomes sticky as you scroll down the page on desktop screen sizes.

Require Customer Login to Purchase, when this option is checked, makes it impossible for visitors to purchase from your store without having an account and being logged in.

Product Grid

Product Card Image Ratio allows you to set the size ratio of your product card images. Depending on the height to width ratio of your product images you can customize exactly the Product Card Image Ratio to optimize the display of your product cards. 1:1 is the default which is a square image with the same height to width ratio. There are a variety of settings all the way from 16:9 which is wide and short, to 9:16 which is tall and narrow. This same option exists for Subcategory Image Ratio as well which allows you to optimize your subcategory image display.

This section also contains settings which allow you to specify how many products you would like to show per row on desktop, tablet, and mobile.