Getting Started
Apply Theme
From the store admin panel, navigate to Storefront > My Themes and find the Austin template. Click on the 3 dots next to the template name and select the Apply option from the drop-down that appears. Select whichever child theme you would like to use for your store.
Theme Editor
Once an Austin template has been applied, you can navigate to the theme editor to begin the majority of your customizations. Under the Current Theme heading, there should be a blue Customize button to the right of the main Austin image. Click this to launch the theme editor.
Customize!
Recommended Image Sizes : Regardless of the images you use, the theme will do its best to make any image work where you place it. However, if the dimensions differ from what is recommended, there is no guarantee that it will not look grainy or distorted.
Content Manager
As of Austin v1.3.0, all primary content for the home pages has been moved from the en.json file to Theme Settings and default text widget placement. If for any reason, you need to revert your theme back to using the values in the en.json file, you can do so by changing this setting here:
Theme Colors
After launching the Theme Editor, click on the 'Theme Styles' icon (the one shaped like a painter’s palette) to open the theme settings. In the 'Global' settings, you will find basic color options, some display options for page headings, and other fundamental options for your store.
Austin Night
The 'Night' variant allows you to toggle a background image for the mega menu dropdown, the footer, and the homepage Newsletter signup banner.
Austin Vogue
Note that the 'Vogue' variant uses a unique pair of settings to determine the background colors of certain elements: the homepage’s Newsletter signup banner and testimonials carousel, and primary action buttons.
Header & Footer
Header
The options for the theme header included in Austin consist of the container background, Logo, Navigation colors, and the ability to display certain promotional links and messages.
Promo Message & Blog Navigation
The promo message (default “Orders over $50 Ship Free!”) and the Gift Certificate / Blog Navigation can be toggled on and off in the theme settings. If the BC blog is not active, the Blog link will not show. Additionally, you can edit the promo message text by changing the appropriate field in the theme editor.
Mega Menu Images
The 'Show Images in Sub Menu' checkbox allows you to toggle the main category image on and off in the navigation drop-down. This image refers to whatever image you upload to the Edit Category page in the admin panel.
Recommended Image Size: 500x350 pixels.
Content Pages in Menu
In order for a content page’s link to appear in the main navigation, it must be made visible in the store’s Control Panel, as well as listed in the 'Included Pages' input in the theme settings. If you want to show multiple page links, separate the list with a comma and a space: About, Privacy Policy, etc.
Footer
The store’s footer, located at the very bottom of the site, can be customized in a small variety of ways. This includes the container background, text and link colors, the alternate Logo and store location/operating hours, and the urls and text for the links that appear in the custom 'Support' navigation column.
The various column visibility can be toggled on and off, as can the address and the store’s operating hours. The hours can be edited in the appropriate field in the theme settings. The address information is pulled from the ‘Store Profile’ in the general admin panel.
Home Page
Carousel
The main image carousel uses the built-in 'Home Page Carousel' options for its content. From there, you can upload the background images, edit the primary lines of text, button text, and button link. The options in the theme editor let you determine whether or not to have the carousel, toggling the navigation arrows on and off, and various colors.
Recommended Image Size: 1390x840 pixels.
Product Lists
There are two product lists that populate on the home page by default: New Products and Featured Products. You can toggle the appearance of these lists on and off, as well as set how many products can appear in each section.
Custom Content Rows
These custom content rows are another optional feature for your site’s home page. From the Theme Editor, you can choose to show or hide each individual row, as well as set any relevant colors.
You can swap out image names from your store's Image Manager, and edit text areas by utilizing the Page Builder's default Text widget. Fonts will automatically be styled to match the theme.
Newsletter Signup Banner
Testimonial Carousel
Image + Text 1
Recommended Image Sizes: (Tall) 540x810 pixels; (Short) 495x290 pixels.
Image + Text 2
Recommended Image Sizes: (Tall) 540x810 pixels; (Short) 540x580 pixels.
Image + Text 3
Recommended Image Sizes: (Icon) 55x55 pixels; (Tall) 540x810 pixels.
Promo Hero Banner
Recommended Image Size: 970x540 pixels.
You may notice that, when dropping in these text widgets, there will be some padding that shifts the text out of alignment slightly. You can get rid of this by clocking on the parent 'Column' field around your widget and setting the default padding to 0:
Blog Feed
Category Pages
Show Subcategory List on Sidebar
This setting in the category page allows you to choose whether or not you have a secondary list of your shop categories included in the top of the left column for easier navigation.
Category Title Banners
To set the background image for a category title banner, upload the image you would like to use in your store’s Image Manager (must be a .jpg file), and name the image file as follows:
category-banner-{{category ID}}.jpg
To find the Category ID, go to Products > Product Categories > click on the category in question. You should be able to see the ID in the URL bar, at the end of the string.
Brand Title Banners
Similar to the category banner images, brand images are fetched from your store’s image manager. Upload the image you would like to use in your store’s Image Manager (must be a .jpg file), and name the image file as follows: {{brand-name}}.jpg . For example, if your brand is named ‘Austin’, your image file would be ‘austin-light.jpg’.
Recommended Image Size: 1560x350 pixels.
Products
Play Video
The 'Play Video' button does not require any special attention to function. As long as there is a product video uploaded, this will automatically appear.
Short Meta Description
The brief pseudo-description of a product (located just below the product name) can be set by editing the individual product’s 'Meta Description' field:
Details
The Details section is populated using the general 'Product Description' text editor.
Warranty
The Warranty section is populated using the 'Warranty Information' field in the product editor.
Downloads
This product content section appears if there are specific custom fields set with values containing links to download files. The 'Custom Field Name' must be called 'Download'. The formatting for the 'Custom Field Value' is as follows: [[Text you want to appear as the download link]]
Content Pages
Unique Title Banners
There are a small handful of unique title banners across the Austin theme. They are at the top of the blog index and entries, on the main brands listing page, the custom About Us template, and the default Contact Us template. They can all be swapped out by uploading a custom image via your store's image manager, and then changing the file name in the appropriate theme field:
Recommended Image Size: 1150x350 pixels.
About Us Page
The Austin theme comes with a special template for your company page in order to help it stand out a little against your other content pages. In order to set this up, you must edit your About page to use the 'about-us' template in the page admin, as shown below:
Contact Us Page
This template is automatically applied to any page that is set with the option of 'Allow people to send questions/comments via a contact form.' All images and verbiage (not including the form fields) can be edited via the theme editor.
Recommended Image Sizes: (Tall) 650x850 pixels; (Icons) 55x55 pixels.