Welcome to the Complete guide for Booster Theme
In this complete guide for Booster Theme, we will go over the essentials steps to customize Booster Theme. This guide shows the most effortless path we found to use Booster Theme, this way, you save lots of time and effort. Instead of starting from top to bottom or just zig-zagging between every features Booster Theme has to offer, follow this, and you'll have a smooth onboarding with us!
Important: If you feel this guide is not going deep enough in every section, we made something for you. The In-depth tutorials are tutorials and videos about every section/feature. Each of those tutorials goes settings-by-setting to explain you everything about the theme. There will be a link to the in-depth article under each section in this article if you need it.
It is a long guide, we made a one-page checklist to help you track your progress. Download it here!
This guide divides the process of customization into 3 steps.
Step one is to add some basics content like a featured collection and a CTA, those types of sections are really the base of any online store and it's a great idea for you to start with those to familiarize yourself with the theme. Also, we do it this way because when we will go through step two, we will modify lots of theme settings that reflect in those sections.
Step two will be to modify most of the theme settings to fit your brand style. We called it Adding your own touch because this is what Booster is all about, Booster Theme is so flexible and customizable that it can fit any niche or brand. You simply need to learn to use the theme right and use it as its full capability. Going through that step, we will modify the core elements of your store like your buttons, product cards, colors combination, store layout, and more.
Step three is all about polishing your store. In the third step, we will go over many features and options that Booster Theme has to offer. You might not need all those features in your store, see this as an optional list where you can find great ideas to polish your store. For example, you might not need to use the currency converter for your store because you are selling in only one currency, but still, it is on the list because lots of people will need to do it. This part is also significant to learn about features of the theme you didn't know about yet.
1.Add some basics content
2.Add your own touch
2.4 Base colors
3.Polish and adjust your design
Optimize the user experience
3.5 Blog cards
3.6 Info badges
3.9 Contact Us page
3.10 Checkout Page
3.11 Product Page content
3.12 Reviews app
3.13 Advanced buttons
3.14 Gallery and Swatches
3.15 Inline Upsell
3.17 Countdown timer
3.19 Messenger chat
3.20 Floating contact
3.21 Basic GDPR notice
3.22 Recently Bought
Step 1 - Add some basic content
Customize your first Call To Action
Need more explanation about Call To action? Here it is!
Doing this first, lets you play with the basic settings you'll find on almost every homepage section in the theme and familiarize yourself with them.
Make sure to add a button to your Call to Action, because we will modify the default button later in that guide.
Add a Featured collection
Need more explanation about Featured collection? Here it is!
Featuring one of your collections is always a great idea to showcase some of your best products. Later in that guide, we will modify your product cards and the changes will be reflected in that section.
Note: Of course, a store needs more than 2 sections, we are keeping this simple for you to explore. Feel free to revisit your homepage and finish it when all your theme settings are set properly. Booster Theme has more than 25 different homepages sections to explore.
Configure your header and footer
Navigation of your online store is super important. The header and the footer are the two main places you are going to use a navigation menu.
Usually, the header is used to link to your products, collection, and other pages that are important for your customers. On the other side, in the footer you should include more than just a navigation menu, you will also want to use it to give information about your brand, links to your social media, payment methods, and more.
Need more explanation about the Header? Here it is!
Need more explanation about the Footer? Here it is!
Step 2 - Add your own touch
Configure your theme settings
In Booster Theme, the theme settings are the core. They are used as the default settings for almost every element on your store, because of this you want to make sure to set them up as early as possible. Once it's done, you can start adding content and keep a brand constancy.
Need more explanation about Branding Theme setting? Here it is!
In the branding theme settings, you'll want to add:
- your default logo
- the logo variant for mobile
- Others variant if needed also
This way customers clearly see your logo on your header when landing on your store and also see your tiny logo on the browser tab.
The header with a logo is looking way better than a header with no logo.
Location, Contact & Social media
You can use the Social media & the Contact block inside your Top bar, Bottom Bar, and Footer to showcase those information/links. Just like this:
Full-width background 1280px max-width
As you can see, modifying the layout can be a game-changer for your store.
What's amazing also is that you can select a specific section layout for every section, if you feel like the default section won't fit for a section. This makes Booster Theme extremely flexible.
You will also have the possibility to modify the border radius, border width, and spacing between your section.
Base colors are probably the MOST important setting on your Booster theme because you want your store to have your brand colors. Also, with the accent combination, you can bring some great consistency to your store.
In the section Layout colors, you'll be able to select colors for every principal element on your store. In Primary & Secondary accent, you'll be able to make two combinations that will be usable in lots of sections of your theme. Make sure to set up them now, you won't have to think about setting up colors later on. You'll simply have to select between Combination 1 or 2. Don't worry you will still be able to use some custom colors if needed.
It is also here that we will set up the font size of the store: Small, Base, Medium, Big for the default text and also Heading and subheading font size.
Buttons and inputs
You'll first be able to set up your button dimensions, and after you have to make your Primary Button and your Secondary Button, lots of options are offered to you and make those buttons highly customizable. Input fields can also be altered using this theme setting.
Product & Collection cards
Step 3 - Polish and adjust your design
Already to the last step! In the third step, we will go over many features and options that Booster Theme has to offer. You might not need all those features in your store, see this as an optional list where you can find great ideas to polish your store. We decided to divide this section into 3 sections:
The first one is about the features/settings that help you with your store user experience in general.
The second one contains every in-theme apps you can use.
Optimize the User Experience
Product card tags
Adding some tags to your product card is really amazing to showcase your discounts to your customers. It enhances the shopping experience for your customers.
Cart & Add to Cart
Cart & Add to Cart is a theme setting that offers the possibility to choose your quick cart style, you can also choose what happens whenever someone adds a product to their cart. You have the choice between lots of options.
Top bar, Bottom bar, Sub footer
Need more explanation about Top bar, Bottom bar, Sub footer? Here it is!
Those 3 elements are really handy to inform your customers, you could put some scrolling messages on your top bar to inform customers that you are offering FREE shipping. There's so much other content you can also use on those 3 elements. Make sure to try them.
Having a newsletter in your store is a nice way to get newsletter subscribers for your email marketing! You can add a newsletter in multiples locations on your store. It is easy and fast to do, why not do it?
If you added a blog section to your homepage, did you think to modify your blog card's style? Well, if you didn't this is the theme setting you'll need. This setting offers 5 different blog card styles, see what fits the best for you!
Info badges can be an amazing way to showcase the best element of your products or brand. Let's say you are a fashion store, you can use those badges to showcase that you are eco-friendly and part of the Ethical trading initiative.
Need more explanation about Internationalization? Here it is!
Maybe you are selling in multiples countries! This is a fantastic feature for you! Set up a currency converter, this way, everyone can enjoy shopping with their own currency.
Search & navigation
Need more explanation about Search & navigation? Here it is!
Do you want to customize your collection page's pagination, then this is the place, you can choose between 4 different options and you add breadcrumbs on your pages to ease the navigation. You can add also a suggested collection if there's is no result to your search bar.
Create a Contact Us page
Creating a contact us page is super easy with Booster Theme! It's super important to have a clear way for your customer to contact you! Simply use the page.contact template, and you'll have the ability to add fields to your page, this way customers can leave their message and their e-mail for you.
Your checkout page is one of the last steps of your sales process. Make sure to customize it to your brand! You change the colors, add some image banners, the typography, and your logo also!
Product page content
Need more explanation about Product page content? Here it is!
If you want your product page to be unique, make sure to do this. Your product page content is almost everything that is your product page from product price to product description. What's nice about this section is that you can change your element's order by dragging the different sections. Making the product page SO flexible. Various content blocks are availaible, make sure to discover them.
Reviews app(Loox, Alireviews, or Shopify reviews)
Many different review apps exist for your Shopify apps store, we made sure to integrate the 3 most popular directly into the theme. Having a review app is super important these days, if you want to generate some social proof this is an amazing yeah!
Need more explanation about Advanced buttons? Here it is!
Advanced buttons are advanced settings that enable you to change your Add to cart and Buy it now button on your product pages. You can use this to make those two buttons custom instead of relying on your default button combination. Minor setting that is super useful.
Gallery & Swatches
In one of the most important settings, you can choose to show the selected variant's image, this way, people see the product directly and don't need to search it into your gallery. There are also advanced options to modify your swatches style if you need.
Need more explanation about Inline Upsell? Here it is!
The inline-upsell is like a Frequently Bought Together section, you might have seen this feature on some websites, the goal of this feature is to increase your AOV(average order value) by offering a product that combines well with the desired product.
Need more explanation about Recommended? Here it is!
Recommend section is all about related products to the current one or previously seen product. You can select the option "personalized offers", which provide the user-tailored recommended offers. This section can be of great use to increase your AOV.
The countdown timer creates a sense of urgency, you can either show it on your product cards and on your product page. You can also customize it and add text to it.
The upsell/cross-sell app triggers a pop-up, offering more products, after adding an item to the cart. You will be able to use 5 conditions for that pop-up. It's an amazing feature if you wish to increase your conversation rate!
Need more explanation about Messenger chat? Here it is!
Never heard of the Messenger chat feature yet? This one is truly amazing to offer your customers an easy way to contact you through their messenger profile. After setting up this feature, a small widget will appear on the bottom of your page to offer a live chat experience to your customers by connecting them to your Facebook business page inbox.
Need more explanation about Floating Contact? Here it is!
Like the messenger chat, a small widget on the bottom of your page will appear and show a mail icon that redirects to one of your pages, usually the Contact Us.
Basic GDPR notice
Since 2016, if you are selling in the European Union, you have to let your visitors know you are using cookies. This law makes this feature mandatory if you are selling in the EU, make sure to active the GDPR notice in that case. Button and text are customizable also.
The in-theme app recently bought allows you to generate sales notifications. Your visitors will see those pop-ups and feel that other people are buying your products also. Using this to your advantage will surely help you create some social proofs for your visitors.