Edit the Header Pages

Overview:

DO NOT RENAME OR REMOVE ANY PAGE THAT CAME WITH YOUR SHOPPING CART

The header pages are include pages that are included in all of the shopping cart pages. They hold your logo/banner image and provide a place to put your navigational hyperlinks to other pages in your web site. You can also blend Ecomm Pro into your web site schema by changing colors on these pages.

• YOU DO NOT HAVE TO EDIT ANY OF THE PAGES MENTIONED BELOW.

Edit Your Headers:

• BE VERY CAREFUL WHEN EDITING THESE PAGES

• DO NOT EDIT YOUR ORIGINAL DOWNLOADED PAGE LOCATED IN C:\Ecomm\Pro

  • Edit only the copy that is in your web.

  • If you "mess up", simply go to your original and copy and paste to your web.

• There are TWO header.asp pages that can be edited. These two pages ARE DIFFERENT.

  1. One is \scart\header.asp. This page is on top of all the Shopping Area Pages.

  2. The other is \scart\admin\header.asp. This page is on top all of the Control Panel Pages.

  3. Since the two pages are in different directories, the same hyperlinks would not work for both.

  ---

   

  Edit the \scart\header.asp file:

• Open the scart\header.asp page with your favorite html editor (hopefully this is MS FrontPage)

• The first thing that you will notice is that, even though you copied your logo to \scart\images it is NOT DISPLAYED on the header while in your html editor. This is because this page pulls the image name from the database settings in Company Info. It needs be on the server then opened with a browser from there to see the image.

• The \scart\header.asp page is an html table with 3 rows. The 3rd row is divided into 3 cells.

• The 1st (top) cell holds your image.

  • If your image has a background color other than white, it wont look right.

  • Change that cell background color to match your logo's background color.

  • Right click in the 1st cell area and select Cell Properties. Edit Background color.

• The 2nd row (center row) is an html table cell with a Black Background.

  • This cell can be use to hold links to other pages in your web site that are NOT part of the shopping cart system. The shopping cart navigation is already setup.

  • You can change the background color in the same manner mentioned above.

  • You CAN DELETE this row if you want or remove the text and NOT put any links.

• The 3rd and last row of the table contains the Search Engine input text box and button.

  • You may add links/small images or whatever to the 2nd and 3rd cell (from the left)

  • You can edit the input box AND/OR the button. (colors, font, border and size) below is the html.

  • style="border: 1 solid #0066FF; font-family:arial; color:#0066FF; font-size: 8pt; font-weight:bold; background-color:white;

  • border: 1 solid #0066FF; = border thickness and  color

  • font-family:arial; color:#0066FF; = font face and color

  • font-size: 8pt; font-weight:bold; = font size and weight if you don't want bold then completely remove the font-weight:bold;

  • background-color:white; = background of the button OR input box.

  • For colors you can use EITHER html color code OR the html color name.

    e.g. #0066FF OR blue

     

    ---

     

  Edit the \scart\admin\header.asp file:

• Open the scart\admin\header.asp page with your favorite html editor (hopefully this is MS FrontPage)

• The first thing that you will notice is that, even though you copied your logo to \scart\images it is NOT DISPLAYED on the header while in your html editor. This is because this page pulls the image name from the database settings in Company Info. It needs be on the server then opened with a browser from there to see the image.

• The \scart\admin\header.asp page is an html table with 3 rows. The 3rd row is divided into 3 cells.

• The 1st (top) cell holds your image.

  • If your image has a background color other than white, it wont look right.

  • Change that cell background color to match your logo's background color.

  • Right click in the 1st cell area and select Cell Properties. Edit Background color.

• The 2nd row (center row) is an html table cell with a Black Background.

  • This cell can be use to hold links to other pages in your web site that are NOT part of the shopping cart system. The shopping cart navigation is already setup.

  • You can change the background color in the same manner mentioned above.

  • You CAN DELETE this row if you want to or remove the text and NOT put any links.

• The 3rd and last row of the table.

  • This row contains 3 cells.

  • You may add links/small images or whatever to these cells.

  • You CAN DELETE this row if you want.

• After Editing you headers, click Save and Publish your web.

Helpful Hints:

1. You CAN remove the image source html code, that pulls the image file name from the database,

   and add an image to the header.asp pages as you normally would. You would not need the file name in company setting, but if it's there you can leave it.

   e.g. Remove:

   <img src="images/<%= strBanner %>"> (shopping pages header)

   or the

   <img src="../images/<%= strBanner %>"> (admin pages header)

   Add your own img src

   e.g. <img src="images/image_name.jpg"> (with the preceding the image must be in /scart/images/)

2. REMEMBER IF YOU MESS UP - Copy and Paste a fresh copy from C:\Ecomm\Pro.

3. REMEMBER ALSO THAT THE TWO PAGES ARE DIFFERENT.

4. DO NOT OVERWRITE scart/header.asp with scart/admin/header.asp!

   The images would not work and you would loose the Search Engine input box.

   The same applies to overwriting in the opposite way. (admin to scart) DO NOT DO IT.

5. DO NOT LET YOUR IMAGES STRETCH THE TABLE PAST 750 pixels wide (center row if images are added).

6. Keep your top row image/logo to less than 750 pixel wide.

Top