>
>
>

ShopSite Boot Two Themes

The ShopSite Boot Two template files were created to make it easy for designers to create the main look for the page (ie. header, navigation menus and footer), while having all the innerds already coded and styled for them to utilize most ShopSite features as well as Twitter Bootstrap. These template files make it so that designers can create custom templates that will automatically be updated with the majority of new ShopSite features when there is a new release.

To modify any of these template files you would go to Merchandising > Custom Templates, and click on the section the template file is in (i.e. "Product Templates" or the product template files or "Include Files" for include or publish files). Then click on "Copy ShopSite Template." Make a copy of the ShopSite template you want to edit. Save changes. Then make a copy of your copy and rename it the exact same name as the original. (You can then delete your original copy with a different name). Your copy will override the original template file. If you ever want to revert back to the original template file you can simply delete (or rename) your copied file and regenerate your site.

How To Use The Boot Two Template Files

Step 1: Select Any Theme Using Boot Two Templates Start by going to Preferences > Themes, and select any theme that is already using the Boot Two templates. A list of themes using these templates are found at the bottom of this page.

Step 2: Change Color 5 To #FFFFFF. It is important that you go to Preferences > Layout Settings, and change the Store Color 5 to #FFFFFF (or something that is not #0000??) so that the files in step 3 are used.

Step 3: Set Your Custom Theme Settings. Go to Merchandising > Custom Templates > Includes > Copy ShopSite Include, and make a copy of the Bootstrap-Two-CustomTheme.sst include file. Then make a copy of your copy and rename it the exact same name as the original. This will override the original. Now you can follow the instructions within this include file to customize the Boot Two template files.

Step 4: Select Your Header And Footer Layouts. There are many header and footer layouts already built into these themes. You can select a basic layout, then add your own CSS styles to the header elements to get the look you want.
Header Variations
Footer Variations

Complete List Of Template Files

Below is a complete list of template files that are being used by the BB templates as well as a brief description of how or where the file is being used. Not all files are being used in all stores.

Page Templates

Boot-Two.sst - Default page template.
Boot-Two-NoSideNav.sst - Optional page template with same layout as the default, but without the side navigation menus.

Product Templates

Boot-Two-Product-NoSideNav.sst - Default product template.
Boot-Two-Product.sst - Optional product template. Same layout as the default, but does display side navigation menus on product more information pages.

Other Templates

Boot-Cart-NoSideNav.sst - Default shopping cart template.
Boot-Cart.sst - Optional shopping cart template. Same layout as the default, but does display side navigation menus on the first shopping cart screen.
Boot-Search-NoSideNav.sst - Default search results template.
Boot-Search.sst - Optional search results template. Same layout as the default, but does display side navigation menus on the search results screen.
Boot-GiftCert-NoSideNav.sst - Default gift certificate template.
Boot-GiftCert.sst - Optional gift certificate template. Same layout as the default, but does display side navigation menus on the gift certificate screen.
Boot-Registration.sst - Default customer registration template.
Boot-WishList.sst - Default wish list template.

Include Files

Bootstrap-AbandonCartPopUp.sst - Script and HTML for the abandon cart pop up on the shopping cart screen.
Bootstrap-AjaxMini.sst - Ajax and HTML for the Ajax add to cart pop up.
Bootstrap-AjaxSignIn.sst - Ajax and HTML for the Ajax customer sign in pop up.
Bootstrap-Two-Carousel.sst - HTML for the carousel feature on the home page.
Bootstrap-Two-FooterVariations.sst - Scripts and stylesheets displayed before the >/body< tag.
Bootstrap-Two-Head.sst - Scripts and stylesheets included in the >head< section of all pages.
Bootstrap-Two-HeaderVariations.sst - controls which header file is used, or this one is used for custom designs using these template files.
Bootstrap-Two-LeftMenu.sst - HTML to start the main page columns.
Bootstrap-Two-ProductDefine.sst - Default define for products on category pages.
Bootstrap-Two-SubProductDefine.sst - Default define for sub products.
Bootstrap-Product-Head.sst - Meta tags and CSS specific to product more information pages.
Bootstrap-Two-Product-MoreInfoImageRow.sst - HTML and Script for the more information graphic and extra product graphic display.
Bootstrap-PriceOnly.sst - Simplified product price display.
Bootstrap-PriceSimple.sst - Basic product price display.
Bootstrap-PriceSimpleSave.sst - Default price display for more information pages which includes "you saved" details.
Bootstrap-Two-RegistrationBottom.sst - Footer specific to customer registration pages.
Bootstrap-Two-RegistrationTop.sst - Header specific to customer registraton pages.
Bootstrap-Two-RightMenu.sst - HTML for both left and right navigation menus.
Bootstrap-Two-Search.sst - IF statements and HTML for the search form on all pages.
Bootstrap-VARs-DOCTYPE.sst - VAR tags used in these templates as well as the DOCTYPE tag and opening meta tags.
Bootstrap-VARs-Theme.sst - Sets different theme files based on the store color field 5.


boot.css - CSS used on all store pages.
boot.js - JavaScript used on all store pages for the mini cart, navigation and other global features.
bootcgi.css - CSS used on all CGI pages such as the search results, gift certificates, registration and shopping cart screens.
bootstrap-two.min.css - CSS used on all store pages.

Other Themes Using These Template Files Include:
Edgewise, Split, Electric, Thin, Outline, Jeans, Seeing Double