Legend: CAPITALIZED words refer to a folder or language that you choose. We use CUSTOM for your template and ENGLISH for your language by default. These generic terms should be changed to the name of the template/language you are using.
By default Zen Cart uses logo.gif for the name of this image, but you can use you own filename for the logo.
Using an image editor, create your new logo and save it to includes/templates/CUSTOM/images/your_image_name.??? and upload it to your server.
After creating your logo you can adjust the height, width and logo name in includes/languages/ENGLISH/header.php
define('HEADER_ALT_TEXT', 'Powered by Zen Cart :: The Art of E-Commerce');
define('HEADER_LOGO_WIDTH', '192px');
define('HEADER_LOGO_HEIGHT', '64px');
define('HEADER_LOGO_IMAGE', 'logo.gif');
Make the needed changes reflecting the name of your site, and the width, height and filename of your logo.
save the file to includes/languages/ENGLISH/CUSTOM/header.php and upload it to your server.
By default, the logo is left aligned. Changing the alignment involves making a modification to your includes/templates/CUSTOM/css/stylesheet.css. Open the file and find the following:
#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {float: left;}
Since this is a collection of several “selectors” (#logo, .centerBoxContents, etc) and in order not to interfere with the layout of other sections, split this into two separate statements and create a new selector/definition below it, like this:
.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {float: left;} #logo {float: left;}
To center the logo use text-align: center; or to align it to the right use float: right;
Make the needed changes, save the file to includes/templates/CUSTOM/css/stylesheet.css and upload to your server.>>
