Categories

Advanced Bootstrap Theme

Advanced Bootstrap Theme - Web Agencies and Web Developers - it's time to bring new life to your themes! Advanced Bootstrap Theme is a perfect skeleton for each nopCommerce Theme. Very simple, but also the best nopCommerce template to build your templates!

What does the package contain?

Advanced Bootstrap theme – Why should you reinvent the wheel when you can use what someone else has taken the pain to write and make available for you to use. It's time to build themes based on responsive, high performance, fast and modern skeleton - Advanced Bootstrap Theme for nopCommerce. Previous Bootstrap Theme was a bulls-eye. Now, we've decided to improve it, we've already got feedback from web developers that it's the real huge time saver for them!

Ajax Widget - to create a featured products from categories section on homepage.

Quick Filter - A nopCommerce widget to filter the products dynamically with desired criteria and without the whole page reloading. NopCommerce widget making the filtering on products easier and faster by basing it on ajax requests.

Swiper Slider -  Swiper is the most modern mobile touch slider. Used by almost 20,000 of users! It's lightweight slider, because it doesn't use any JavaScript libraries like jQuery. Swiper slider widget for nopCommerce is probably the most configurable slider widget on the market.

How to configure Advanced Bootstrap Theme

Install the all plugins from the package:

- Ajax Widget,

- Quick Filter,

- Swiper Slider.

Ajax widget is responsible for showing the featured products from categories. Just edit category, check the "Show on homepage" checkbox, open the product list and mark few products as Featured. Refresh the home page and that's all. 

If you want to have filters on category pages it's time to install them. Same with Swiper Slider. 

Demo theme using topic to show 3 boxes.

Boostrap boxes
If you would like to use this same on your store, just copy content displayed below and paste it as source code with system name "home_banner". 

<div class="row home-banner">
<div class="col-lg-4">
<div class="content"><a href="/jewelry"> <img class="img-fluid" src="/images/uploaded/jewelry.png" alt="" /> </a>
<div class="d-flex align-items-center justify-content-center flex-column">
<div class="header">JEWELRY<br /> EARINGS SALE</div>
<div class="body"><em>Earings &amp; Necklaces</em></div>
<div class="footer">From: $120.00</div>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="content"><a href="/jewelry"><img class="img-fluid" src="/images/uploaded/headphones.png" alt="" /></a>
<div class="d-flex align-items-center justify-content-center flex-column">
<div class="header">HEADPHONES<br />ALL FOR SALE</div>
<div class="body"><em>Bluetooth &amp; AUX</em></div>
<div class="footer">From: $90.00</div>
</div>
</div>
</div>
<div class="col-lg-4 ">
<div class="content"><a href="/jewelry"><img class="img-fluid" src="/images/uploaded/phone.png" alt="" /></a>
<div class="d-flex align-items-center justify-content-center flex-column">
<div class="header">Electronics<br /> PHONES SALE</div>
<div class="body"><em>Phones &amp; Accessories</em></div>
<div class="footer">From: $120.00</div>
</div>
</div>
</div>
</div>

SwiperSlider by default installation does not show at this same place. To enable show slider at the header column 3, add widget zone "mainslider"

Boostrap slider

back to top