IMPORTANT NOTICE

This branch (master) is for our new version of KS BootShop theme, which is powered by Bootstrap v5. If you are looking for our the Bootstrap v4 version please check our v1 branch

BootShop - Shopify Theme

Shopify Starter Theme powered by Bootstrap framework (v5 and v4), developed respecting Shopify themes requirements, accessibility best practices, and of course our own experience in developing themes for more than 15 years now.

Our goal is to make this project the most completed, robust and of course the most awesome Shopify theme for the Bootstrap framework.

Video introduction

Click on the screenshot below to play the video on Youtube.

Highlighted features:

Powered by Bootstrap framework (v5 or v4)
Developed respecting Shopify themes requirements
All elements are fully accessible with aria attributes
No Javascript framework dependencies (e.g jQuery)
Support for native image lazy-loading
PageSeed score 96/100 check results
All Shopify required homepage sections (~20)
All Shopify templates (cart, product, etc) have their corresponding settings
Product layout option grid or list
Ajax add to cart
Reccomended products section Learn more

Homepage sections

Carousel (Slideshow)
Collection list
F.A.Q
Featured collection
Featured product
Gallery
HTML
Image with text overlay
Image with text
Logo list
Map
Newsletter
Richtext
Separator
Testimonials
Text columns with image
Video

Demo

https://ks-bootshop.myshopify.com/

Download

Go to Releases and get the latest v2.x.x version which is ready for Bootstrap v5.

Premium Shopify Themes

In case you are interested in our Premium Shopify Themes with advanced features to increase your store conversion rates (CVR) and average order value (AOV) like Wishlist, Cart Goal, Frequently Bought Together Bundles, Recently Viewed Products, Sticky Add To Cart, Sticky Newsletter pop-up, and much more advanced features, please visit our website https://www.kondasoft.com

Getting started

There are 2 ways to install our theme (or any other Shopify theme) on your Shopify store.

1- The simplest option is by going to your Shopify Admin and installing the latest package (.zip file) from our releases. In case you need help with this please check the official tutorial from Shopify.

2- The second option is by using Theme kit, the the official command line tool from Shopify. This is the option which we will be covering below, as it gives you far more freedom to customize and modify our theme.

Installation

Note: Please, make sure you are familiar with Theme kit, official documentation before proceeding. We are assuming that at this point you have already installed Theme Kit.

1- Clone this repository (download theme files)

Create a new folder on your computer, cd to it and run the following command to copy all theme files from our GitHub repository master branch. Note: Include the dot at the end of the command to clone into your current directory.

git clone https://github.com/kondasoft/ks-bootshop .

2- Create and configure theme with Theme Kit

Run the following command to create a new theme in your Shopify store along with our theme files that you have just downloaded:

theme new --password=[your-api-password] --store=[your-store.myshopify.com] --name="ks-bootshop-v2"

Optional: Run this command to open your shopify store with our theme in preview mode.

theme open

Customization

It is advised to not directly modify theme files as you will lose changes when you upgrade our theme. The recommended way to handle this is by creating a copy of our theme and then modify it. Please follow this official tutorial to learn more.

In case you want to customize styles and scripts please continue reading below.

Modifying styles (SCSS)

To customize theme styles in the proper way as recommended by Bootstrap as well, is by working with Sass.

First, create a new file called _custom.scss inside the scr/scss folder and start adding your Sass variables and styles. To learn more about what you do in your _custom.scss file, please refer to the official Bootstrap documentation for Theming

E.g:

// src/scss/_custom.scss

// My variables
$primary: green;

// My styles
body { 
  background-color: red; // Good luck with this :)
}

Make sure you have Sass, Postcss and Autoprefixer installed globally by running the following command

npm i -g sass postcss-cli autoprefixer

Now, you can run this command to compile your Sass files into the the theme assets folder

npm run styles

To deploy your changes on your Shopify store run the following Theme Kit command:

theme deploy or: theme watch

Modifying scripts (JS)

This part will be documented soon.

Upgrading