Installing Focus Theme is quick and easy. If you have an account with Shopify please log into your store admin. If you don't got one, try the free 14 day trial Shopify account.
Once you've logged in, go to Themes and click 'Upload a theme'.
A popup will let you upload the focus-theme.zip file. If you downloaded this theme from Themeforest make sure to unzip the received file first. You'll find the focus-theme.zip in the unziped folder. That .zip file is suitable for Shopify theme upload procedure.
After successfully uploading the theme, it should appear at the bottom of the page with an option to Publish it. Click 'Publish Theme'.
Congratulations! Your Focus Theme is ready for customizations.
In order to let you customize your store to better fit your brand and needs, Focus Theme comes with a variety of theme settings.
Start customizing your theme by clicking on 'Customize theme'.
It will take you to Theme Settings page, where you'll be able to edit all theme's settings. Settings are organized in sections for easier access.
Theme Presets are color presets that have been carefully picked. There is a selection of 3 presets coming with Focus Theme. Each preset has a focus color and a main color, along with other shades and complimentary colors. Here are the presets:
In order to switch between presets please select an option from the Presets drop down.
This section will let you upload your own logo and customize the aesthetics of the site.
You can do so by clicking the 'Browse' button under the Logo and Icon settings. In order to show it on the storefront, don't forget to tick the 'Use custom logo' checkbox.
Favicon is the little icon shown in the browser tabs near tab titles. The steps are same to logo uploading. Click on the 'Browse' button that is just above the favicon.png link. And don't forget to tick the 'Use favicon' checkbox.
Besides our 3 presets, you can generate more color combinations for your store. This is great for adjusting the color scheme of the site to match your brand guidelines.
As for the fonts, you can choose a 'Heading' font and a 'Body text' font. There are 26 fonts to play with.
You can customize the behavior of the product thumbs circles. You can find this section at the bottom of the Logo, Colors, Fonts and more.
Fill circle will resize the image so that the product image will fill all the circle. This works best for product images that have a solid background.
Fit circle will resize the image so that the product image will fit the circle at least in width or height. This works great for products with transparent backgrounds or same color backgrounds as the site's background.
This is the image zooming depth on mouseover. Depending on your product type and image quality you might want to set a higher zoom or lower one. Setting it to 0 will turn off the zooming effect. You are encouraged to experiment with these values to see what zoom scale fits best your products.
Adaptable height - the slider will adapt its height based on the active slide. This option works best for products that have a variable image heights.
Fixed height - the slider will a fixed height, which means the highest product image from the featured ones. Works best for products that go more or less similar image heights, as this will avoid the jumping of the slider.
Focus Theme comes with two ways of adding up additional content on your homepage.
It consists of a 3 column layout. Each column has the ability to hold an image, a title, a content block (be it plain text or lists), and an optional link to lead users to a more detailed section of the site if needed.
In order to make use of the features block, please fill out the Features section on your Focus' theme settings. And make sure 'Enable features block' is checked.
All you have to do is choose which page to display the content from. The advantage of this approach is that you have the tools of the WYSIWYG editor to style your content, as well make use of images and videos.
Create a new blog that will be used for testimonials. Go to Blog Posts / Manage Blogs
Click on Add a Blog.
Than populate it with blog posts that follow these instructions:
Product zoom feature - enable it by checking the zoom checkbox.
Disable quantity box - this could be useful for products that are sold in singular quantities.
Enable related products - will pull randomly related products from same category. To enable it, please tick the 'Display related products' checkbox.
Enable the 'Sort by' tag filter by ticking its checkbox.
Increase/decrease the number of products to be shown per page
Product zooming - this setting controls the zoom depth of the image located in the product pop-up. It appears when you hover on products while on collection page. A higher digit will mean a more detailed zoom. Experiment with it to discover the one working best with your products.
Focus Theme comes integrated with Mailchimp. All you have to do is plug in the Mailchimp form action URL. Wondering how to get your action url? Please read this article
Find the 'Footer section' in your Theme Settings. Once you'll know your action url, please fill it next to "Mailchimp form action URL", in the Footer section.
Find the Footer section in your Theme Settings. Scroll down, and you'll see the social links settings starting with the enable checkbox that will show/hide your social links on the store's footer.
Next, fill in the URLs for socials you'd like to display on frontend. Click Save in the upper right corner.
You got also control over the left side copy of the footer, as well the option to feature a search box on the right.
There is an official article about it. Please read it over here
Can't find your answer here? Write me at vlad [at] jantuanchik.com
Your ticket has been received.
We'll get back to you shortly.
Usually within 24 hours.