Support
Setting the Master Header & Footer
Files
In
order to match the look of the product catalogue and E-Com pages
to your website you need to create and set masters header and
footer HTML files.
Before
we look at how to set these files you first need to understand
how these work. When the Security-Payment.com system generates
a page in will insert the html code from the appropriate header
file before the content of that page and the footer file code
below. In order for this code to be HTML valid it must include
certain elements.
Prod
Cat Header
This
file includes all the HTML layout code before the content of
the page. This must include the <head></head> section
and the opening <body> tag. You also need to link to the
style sheet used for your website design and the style sheet
for the product catalogue. The default directory for the product
catalogue is /prod_cat/ with the style sheet being name shop.css,
Therefore the header file must include the following code within
the Head Tags:
<link href="/prod_cat/shop.css" rel="stylesheet" type="text/css">
Prod
Cat Footer
This
file includes all the HTML layout code after the content of the
page. It must include the </body> tag.
E-Com
Header
This
file includes all the HTML layout code before the content of
the page. This must include the <head></head> section
and the opening <body> tag. You also need to link to the
style sheet used for your website design and the style sheet
for the product catalogue. Unlike the Prod Cat Header file all
the images used in this HTML must be in the file manager of your
control panel and any links back to your site should be the full
URL path. You must also include a copy of the style sheet for
you main site design in the file manager, we will use style.css
for the purposes of the code below. The style sheet for the E-com
pages is called shop.cs by default. Therefore the header file
must include the following code within the Head Tags:
<link
href="/retailer_files/XX/uploads/style.css" rel="stylesheet" type="text/css">
<link
href="/retailer_files/XX/uploads/shop.css" rel="stylesheet" type="text/css">
Where
XX is your retailer ID number.
All
images should be pathed with the following path:
/retailer_files/XX/uploads/
Where
XX is your retailer ID number.
Since
the e-com header and footer files are used on secure pages you
must NOT use images or style sheets located on a different website
to the Security-Payment File Manager. This will cause an SSL
error so all images used must be in your file manager.
E-Com
Footer
This
file includes all the HTML layout code after the content of the
page. It must include the </body> tag. Like the header
file any images must be pathed to the file manager and links
back to your website should be the full URL path.
Since
the e-com header and footer files are used on secure pages you
must NOT use images or style sheets located on a different website
to the Security-Payment File Manager. This will cause an SSL
error so all images used must be in your file manager.
Below
are the instructions for setting the headers and footers.
- Use
the File Manager to upload the header and footer HTML files
and Style Sheets to your file manager.
- Go
to the Retailer Control Panel and select “Headers and
Footers”from the right hand menu.
- In
the page that appears use the drop-down menus to choose the
e-com header and footer files for the Header, Footer, Secure
Header, and Secure Footer options. Choose the Prod Cat header
and footer files for the Product Catalogue Header and Footer
options.
- Choose
Submit to save these settings.
|