How To Setup Boutique Blogger Template

Boutique is a premium looking immersive e-commerce blogger template suitable for any type of product to sell online, it has the unique layout and appealing design to attract numerous amount of visitors. Addiction is equipped with various of widgets which will help you to publish your blog more professionally. To make it easy for you we have published this detailed documentation, so that you can setup your blog correctly.
You have made a good decision by choosing our template. You can check the live demo or download the template through the button below and also Please Read this documentation carefully in order to set up your blog and please note that there’s no support for free users.

See Demo Live Preview Free Download Free Version Buy Now Premium Version

Basic Setup

1. Template Installation
2. Logo Setup
3. Template Setting
4. Shortcodes & Markups
5. Create Sitemap

Video Documentation

You can check this below video to understand the setup process much more easily, just click the below image to watch the video directly on YouTube, or click this link - How To Setup Boutique Blogger Template

Setting Up The Menu - Top

To Edit Top Menu in this theme you can follow this step:

On Blogger Dashbord Click Template
Click Edit HTML
(Top Menu) Scroll down and Find this Code :

 <ul class='nav' id='top-menu'>
  <li><a href='/'>Home</a></li>
 <li><a href='#'>Page Templates</a>
<ul class='sub-menu'>
 <li><a href='#'>Sitemap</a></li>
 <li><a href='#'>Full Width</a></li>
 <li><a href='#'>Image Gallery</a></li>
 <li><a href='#'>Portfolio</a>
 <ul class='sub-menu'>
 <li><a href='#'>Portfolio Smalll</a></li>
 <li><a href='#'>Portfolio Medium</a></li>
 <li><a href='#'>Portfolio Large</a></li>
 <li><a href='#'>Portrait Orientation</a></li>
 <li><a href='#'>Portfolio With Sidebar</a></li>
 <li><a href='#'>Portfolio No Text</a></li>
 </ul>
</li>
 <li><a href='#'>Advanced Search</a></li>
 <li><a href='#'>Member Login</a></li>
 <li><a href='#'>Blog Feed</a></li>
 <li><a href='#'>Contact Us</a></li>
</ul>
</li>
 <li><a href='#'>Shortcodes</a></li>
 <li><a href='#'>Checkout</a></li>
 <li><a href='http://www.soratemplates.com/2013/09/boutique-blogger-templates.html'>Download This Template</a></li>
</ul> 

Change # with yours URL link

Setting Up The Main Menu - Main

To Edit Main Menu in this theme you can follow this step:

On Blogger Dashbord Click Template
Click Edit HTML
(Main Menu) Scroll down and Find this Code :

 <div id='menu-content'>
<div id='menu-shadow'/>
<ul class='nav clearfix' id='secondary-menu'>
 <li><a href='#'>Backpacks</a></li>
 <li><a href='#'>Bathroom</a></li>
 <li><a href='#'>Clothing</a></li>
 <li><a href='#'>Accessories</a>
<ul class='sub-menu'>
 <li><a href='#'>Bathroom</a></li>
 <li><a href='#'>Clothing</a></li>
 <li><a href='#'>Cups and Mugs</a></li>
 <li><a href='#'>Furniture</a></li>
 <li><a href='#'>Kitchen Supplies</a></li>
 <li><a href='#'>Pillows</a></li>
 <li><a href='#'>Towels</a></li>
</ul>
</li>
 <li><a href='#'>Furniture</a></li>
 <li><a href='#'>Hats</a></li>
 <li><a href='#'>Pillows</a></li>
 <li><a href='#'>Purses</a></li>
 <li><a href='#'>School</a></li>
 <li><a href='#'>School Supplies</a></li>
 <li><a href='#'>Towels</a></li>
 <li><a href='#'>Shoes</a></li>
</ul>
</div>
<div class='clear'/>
</div>

Change # with yours URL link

Setting Up The Slider

To Edit Slider in this theme you can follow this step:

On Blogger Dashbord Click Template
Click Edit HTML
(Slider) Scroll down and Find this Code :

 <div id='slides'>

 <div class='slide'>
 <div class='featured-image'>
 <a href='#'><img alt='Back To School Supplies' height='230' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXEUF0R6IS86fqHCd_RCxHXuASMjaxX1ylvfibynwHPJDRbSXVmdfQ1T07IPZEVszB3kmRD1D6LwuIbLjkhK-RVqGsddqGQyRKB81JYP0vGQho5e_HVLEaTyB3UVQD0fNunolaaF8aHhs/s380/f-2.png' width='380'/></a>
 <div class='featured-price'>
 <a class='add_cart et-shop-item' href='#'>Add To Cart</a>
 <a class='more_info' href='#'>More Info</a>
 <span class='price'>25</span>
 <span class='currency_sign'/>
 </div>
 </div>
 <div class='featured-description'>
 <h2 class='featured-title'><a href='#'>Back To School Supplies</a></h2>
 <p>Vivamus eget nulla id elit volutpat dignissim sit amet quis lectus. Nulla viverra odio at odio molestie rutrum. Mauris vitae augue ac leo lobortis hendrerit. Nulla facilisi. Class aptent...</p>
 <a class='readmore' href='#'><span>More Info</span></a>
 </div>
 </div>

 <div class='slide'>
 <div class='featured-image'>
 <a href='#'><img alt='Fancy Shoes' height='230' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4gTHwOYXwk3UHPSl15vyuxhBh_a-VNcMXTRCeEnrpeQW_mc1FssuW-dA81FtzV85wWs94Okoc5rmROqoOQup7P0pFZeI5lqa9P4tvTnQ7noArlRsuRnm-v6oZFEzVoVhc3q-RwrKsqZI/s380/f-4.png' width='380'/></a>
 <div class='featured-price'>
 <a class='add_cart et-shop-item' href='#'>Add To Cart</a>
 <a class='more_info' href='#'>More Info</a>
 <span class='price'>68</span>
 <span class='currency_sign'/>
 </div>
 </div>
 <div class='featured-description'>
 <h2 class='featured-title'><a href='#'>Fancy Shoes</a></h2>
 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec suscipit adipiscing lectus id dapibus. Pellentesque vel urna tellus. Aliquam erat volutpat. Mauris malesuada dapibus ornare....</p>
 <a class='readmore' href='#'><span>More Info</span></a>
 </div>
 </div>

 <div class='slide'>
 <div class='featured-image'>
 <a href='#'><img alt='Designer Pillows' height='230' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidjKUtU6b__Xz2TFv_0JfFoa19X5ReP8USxPR6FQ94DjPReiX0xk6IBGsw94CuUVCo6F3vsW-An3wt3Mm3t3Ge3eUuCzgORWqWX3RENPyr4QuilQst56TJ8R4IwNQxIya1mi1FB5oNgXc/s380/f-11-113950_380x230.png' width='380'/></a>
 <div class='featured-price'>
 <a class='add_cart et-shop-item' href='#'>Add To Cart</a>
 <a class='more_info' href='#'>More Info</a>
 <span class='price'>20.95</span>
 <span class='currency_sign'/>
 </div>
 </div>
 <div class='featured-description'>
 <h2 class='featured-title'><a href='#'>Designer Pillows</a></h2>
 <p>Ut lacinia dolor sed diam auctor sodales. Morbi dapibus suscipit laoreet. Quisque bibendum iaculis augue tempus posuere. Donec nisi odio, volutpat vel vestibulum nec, dapibus a nisl....</p>
 <a class='readmore' href='#'><span>More Info</span></a>
 </div>
 </div>
 </div> 

Change above details with your details.

Configure Page Navigation Widget

To Edit Page Navigation in this theme you can follow this step:

On Blogger Dashbord Click Template
Click Edit HTML
(Page Navigation) Scroll down and Find this Code :

 var posts=12, // Number of posts in each page

num=2, // Number of buttons will display

Change above details with your details.

How to add price to a product

The price tag works if you add the specific html code inside your post html section to do so follow below step.

On Post Editor Dashboard.
Click HTML Tab
Paste Below code in the top :

<span class="item-price">15</span>

Change above details with your details.

How to change currency sign

To Edit Currency sign in this theme you can follow this step:

On Blogger Dashbord Click Template
Click Edit HTML
Scroll down and Find this Code :

var currency="£";

Change above details with your details.

Installation And Custom Services

We provide plenty of templates for free but if you want something unique for your blog then let us create a unique design for your blog, Just tell us your needs and we will convert your dream design into reality. We also Provide Blogger Template Installation Service. Our Installation service gives you a simple, quick and secure way of getting your template setup without hassle.

Contact Us Custom template Services