ShopSite Soft Theme
Version Added: ShopSite Version 10 sp2
Theme Colors & Backgrounds
Colors and background images for this theme can be modified under Preferences > Layout Settings.
- Text Color - Page text, product description and SKU, left navigation link text, top navigation link text and mini cart body text.
- Background Color - Background color for body, sides, and footer of page.
- Link Color - Link text hover color for top navigation, and mini cart header text color.
- Visited Link Color - Page name, product name, and link text hover color for left navigation.
- Active Link Color - Left navigation section headers (i.e. categories, more info), link text hover color for mini cart, and product price.
- Table Shade Color - Table shade color, top navigation background color, recalculate text background color, lines between sections in cart.
- Background Image - Repeating pattern for body, sides, and footer of page.
- Color 1 - Thin lines of color beneath the built-in links at the top of the page, beneath the page name, and above the footer.
- Color 2 - Link color for built-in links at the top of the page, customer registration link color in cart, cart page name, thin lines on eiter side of the body, and thin line beneath each link in the side navigation.
- Color 3 - Do not change this color. It controls which CSS file is used for the theme.
- Color 4 - Header background color.
- Color 5 - Not applicable in this theme.
Theme Tips and Tricks
This theme is using a template with many tricks that you can do it further enhance the look of your store. The main trick has to do with the include file called 3Column-SelectTheme.sst. What you'll want to do is (1) first go to Merchandising > Custom Templates > Includes > Copy ShopSite Include, and make a copy of the 3Column-SelectTheme.sst include file. (2) Next, make a copy of YOUR copy and name it the exact same name as the original. You can then remove your copy (the copy which does not have the exact same name as the original). In this include, you will find many VAR tags. One example is [-- VAR.SubproductDisplay "select" --]. This VAR tag determines how the subproducts are displayed for the products in your store. "Select" means that they are displayed in a pull down menu. You can change the text "select" to "radio" to have the subproducts be radio buttons, "checkbox" to have the subproducts displayed with checkboxes to add multiple subproducts to the cart at once, or "table" which will display the subproducts in a table format, each with its own add to cart button. (3) Once you have changed the VAR tags to "yes" or "no" or something else, you can save changes, then go to Utilities > Publish > Regenerate, to republish your website using the new settings.
Other options found in the file 3Column-SelectTheme.sst include:
- [-- VAR.Breadcrumbs "yes" --]: this tag will control the display of breadcrumbs on your product more information pages.
- [-- VAR.CartProgressBar "yes" --]: this tag will control the display of the cart checkout progress bar.
- [-- VAR.PrintThankYouScreen "yes" --]: this tag will control the display of the print button on the thank you screen and in the customer registration feature.
- [-- VAR.FooterCategories "no" --]: this tag will control the display of additional category sections at the bottom of all pages. You will need to duplicate the include file called "3Column-FooterCategories.sst" if this tag is set to "yes."
- [-- VAR.SearchOnAllPages "no" --]: this tag will add the search field in the header to all pages including the cart pages.
- [-- VAR.AdditionalSEO "no" --]: this tag will repeat certain fields on your store pages for additional SEO.
- [-- VAR.ExtraProductFields "no" --]: this tag will display all of your additional product fields on your product more information pages.
- [-- VAR.ProductInfoMoreInfoOnly "no" --]: this tag will remove ordering options, quantity input, etc, from displaying on your product category pages, so that these fields are only displayed on your product more information pages.
- [-- VAR.SubproductDisplay "select" --]: this tag controls the format your product subproducts are displayed in.
- 3Column.sst - page template.
- 3Column-Product.sst - product template.
- 3Column-GiftCert.sst - gift certificate template which controls how the gift certificate ordering page looks, how the gift certificate email receipt looks, and how the printable email receipt within the back office looks.
- Multi-Use-TellAFriend.sst -tell a friend template which controls how the tell a friend pop up looks, as well as how the tell a friend email looks.
- 3Column-Cart.sst - shopping cart template which controls how all the pages of the shopping cart look, how the order email receipt looks as well as how the cross sell items are laid out on the shopping cart screens.
- 3Column-CustReg.sst - customer registration template which controls how all of the customer registration screens look, as well as how the customer registration emails look.
- 3Column-Search.sst - search template which controls the layout of the search results screen.
- BasicPage-Link.sst - default link template for page links on the search results screen.
- BasicProduct-Search.sst - default product template for the product results on the search results screen.
- 3Column-03.css - include with CSS which sets colors.
- 3Column-03.css - publish file containing CSS for this theme.
- 3Column-Basics.css - publish file containing all default CSS for this theme.
- 3Column-crFooter.sst - include file specifying the bottom of the customer registration screens.
- 3Column-crHeader.sst - include file specifying the top of the customer registration screens.
- 3Column-EmailReceipt.css - include file containing the email CSS.
- 3Column-FooterCategories.sst - optional include file for additional link sections at the bottom of the screen.
- 3Column-LeftBar.sst - include file containing things such as the security logo, payment options logo and gift certificate link.
- 3Column-SelectTheme.sst - include file specifying which CSS files to use, as well as different optional settings such as how the subproducts are displayed.
- 3Column-TopLinks.sst - include file containing top links for the page.
- 3Column.css - include file linking to CSS files.