Quick Help

The knowledgebase is a categorized collection of answers to frequently asked questions (FAQ) and articles. You can read articles in this category or select a subcategory that you are interested in.



Bespoke Theme

Solution

Bespoke-theme

[edit] Creating a Bespoke Theme

Ask Shopfitter to do it

The easy way to have a bespoke design for your website is to commission Shopfitter to build one for you - these start from around £500 plus VAT or US$1000.

Contact us on our help desk to enquire.


Create your own

To build your own theme requires advanced knowledge of XHTML, CSS (cascading stylesheets) and a little XML would be helpful.

  • The first step is to use Windows Explorer to open C:\Program Files\ShopFitter\ShopFitter 4\themes and copy and paste one of the existing themes - choose one that is most similar to what you want.
  • Rename the theme folder and then open the images folder to alter the screenshot.jpg file. This will help you find your new theme to test it in Shopfitter.
  • Next, launch Shopfitter and your shop, then select the theme you've created.

Here is a list of all the files that are involved in handling theme layout and styling, these contain standard XHTML code, CSS and a little bit of XML:

Main theme inc files:

  • Category.inc - controls category page (1up default)
  • Altcategory.inc - controls alternative category page (2up)
  • Product.inc - controls product page
  • Exproduct.inc - controls excluded items page
  • Cart.inc - controls cart/basket page
  • Checkout.inc - controls checkout page
  • Info.inc - controls info pages
  • Index.inc - controls index/home page
  • Search.inc - controls search page


Section theme inc files:

  • Header.inc - controls link menu
  • Footer.inc - controls footer section


Advanced theme inc files:

  • Subcat.inc - controls sub-category menu
  • Noaltcategory.inc - controls alternative out of stock category (2up)
  • Noprodcat.inc - controls out of stock product on category section
  • Noproduct.inc - controls out of stock product page
  • Relprod.inc - controls related products section
  • Norelprod.inc - controls out of stock related products section
  • Config.xml - controls left/right menu
  • Sitestyle.css - stylesheet
  • Templateheader.dat - Controls main layout - header / doctype / menus – pulls in all other info
  • In addition there are images


All the above files can be edited in an HTML editor and handle the layout of separate sections of the pages.

When you compare the code in the .inc files with the resulting html page it's fairly plain to see where each of the

areas open and close.
 
Was this article helpful? yes / no

Article details

Article ID: 52

Category: Themes

Date added: 2014-11-24 09:45:14

Views: 451

Rating (Votes): Article rated 3.6/5.0 (26)

Go back

 
Powered by Help Desk Software HESK, brought to you by SysAid