Top 10 questions

From Zen Cart(tm) Wiki
Revision as of 04:40, 21 September 2011 by DrByte (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Top 10 Questions asked by new Zen Cart® Users

Introduction

Your Zen Cart® is successfully installed so let’s take a look at how you can execute the most commonly made changes to a default installation. As you follow these steps, your store will become more and more your own.


Especially for inexperienced users, it is wise to decide exactly what you want to change and how you want to change it before starting to make the changes. You will need a text editor to change the content of the files and an FTP client to upload your changes to your server. (see Useful Tools For Working With Zen Cart®)


The answers in this section assume you have read Creating your own template and have either created your own template or have downloaded one of the pre-defined templates.


CAPITALIZED words refer to a folder or language that you choose. We use CUSTOM for your template and ENGLISH for your language by default. Change these if needed.


The “Top 10 Questions” asked by Zen Cart® users changes regularly. Rather than a #1 - #10 list, the questions have been grouped for economy of editing. This section encompasses the following items:

  • The Header Image
  • The Logo
  • The “Sales message or Tagline” text
  • The “Congratulations!” greeting message
  • The “Welcome Guest” message
  • The “Breadcrumb”
  • The Copyright text in the footer area


How do I change the Header Image?

Template based on the Classic Template

By default Zen Cart® uses header_bg.jpg for the name of this image, but you can use your own filename for the background image.


Using an image editor, create a new background graphic and save it to includes/templates/CUSTOM/images/header_bg.jpg and upload the file to your server.

Template based on the recommendations for Zen Cart® version 1.3.+

Using an image editor, create a new background graphic and save it to includes/templates/CUSTOM/images/your_header_image.???.


Now open your stylesheet.css and find or add the following code.

 #logoWrapper {
 width:760px;
 height:110px;
 background-image:url(../images/your_header_image.???);
 background-repeat:no-repeat;
 }


Change the file name to that of your own header image, adjust the width and height to those of your header image, save the stylesheet and upload both files to your server.


How do I add and position a new logo?

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_LOGO_WIDTH', '192px');
 define('HEADER_LOGO_HEIGHT', '64px');
 define('HEADER_LOGO_IMAGE', 'logo.gif');

Make the needed changes, save the file to includes/languages/ENGLISH/CUSTOM/header.php and upload 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 and upload to your server.

How do I remove the logo completely?

If you don't want or need a logo, open includes/templates/CUSTOM/common/ tpl_header.php find and comment out this line of code by adding <!-- at the beginning, --> at the end and // between the words php and echo, as shown below.

<!-- <div id="logo"><?php // echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">'
 . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE,
  $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?></div> -->

Save the file and upload it to your server.


How do I Change the Sales message or Tagline?

To change the sales message goes here or Tagline Here text to say what you want open the includes/languages/ENGLISH/header.php file in your text editor. Find the following line of code:

define('HEADER_SALES_TEXT', 'TagLine Here');

Replace the tagline text with your own text, making sure that the single quote marks are not left out.

Save the edited file to your includes/languages/ENGLISH/CUSTOM folder.

If you are using the classic template save the file to includes/languages/ENGLISH/classic/header.php

How do I Remove/Delete the Sales message or Tagline?

Earlier versions of Zen Cart® required changing 3 files to accomplish this. This was necessary in order to eliminate the "empty div" bug in IE.

With Zen Cart® v1.3.5 and newer this is easily accomplished by changing only 1 file and the "empty div" bug in IE is no longer a concern.

Open the includes/languages/ENGLISH/header.php file in your text editor. Find the following line of code:

define('HEADER_SALES_TEXT', '');

Delete the tagline text, making sure that the single quote marks are not deleted.

Save the edited file to your includes/languages/ENGLISH/CUSTOM directory.


How do I Change the Congratulations! Message?

If you want to change the Congratulations! You have successfully installed your Zen Cart® E-Commerce Solution? Text with your own open the includes/languages/ENGLISH/index.php file and find the following code:

// This section deals with the "home" page at the top level with no   options/products selected
/*Replace this text with the headline you would like for your shop.
For  example: 'Welcome to My SHOP!'*/
define('HEADING_TITLE', 'Congratulations! You have successfully installed your
Zen Cart® E-Commerce Solution.');
} elseif ($category_depth == 'nested') {
// This section deals with displaying a subcategory
/*Replace this line with the headline you would like for your shop. For
example: 'Welcome to My SHOP!'*/
define('HEADING_TITLE', 'Congratulations! You have successfully installed your  
Zen Cart® E-Commerce Solution.'); 
}

Replace the text starting Congratulations with your own text. Make sure that the single quote marks are not left out, save the file and upload to your server.


How do I Change the Welcome Guest Message?

If you want to eliminate Welcome Guest! Would you like to log yourself in? message completely, turn off the Customer Greeting in your Admin > Configuration > Layout settings > Customer Greeting > Show on Index Page and set to 0.


If you want to replace this message with one of your own, start your text editor and open the includes/languages/ENGLISH/index.php file and locate these lines of code:


 if (STORE_STATUS == '0') {
 define('TEXT_GREETING_GUEST', 'Welcome <span class="greetUser">Guest!</span>
  Would you like to <a href="%s">log yourself in</a>?');
 } else {
 define('TEXT_GREETING_GUEST', 'Welcome, please enjoy our online showcase.');
 }
 define('TEXT_GREETING_PERSONAL', 'Hello <span class="greetUser">%s</span>!');


As you can see, there are two Welcome messages depending upon whether you wish you Zen Cart® to be a fully functioning store, or just a showroom. Edit the message starting from the word Welcome but be careful not to change the text in angled brackets, or the brackets themselves. Make sure that the single quote marks are not left out. If you want to include an apostrophe in your text e.g. Lucy's Store, you will need to put an escape character before the apostrophe, i.e. Lucy\'s Store.


How do I remove the Home in the middle column next to the Categories box?

These are called the breadcrumbs, showing where you are and how to get back to previous locations. You can either turn it off completely or you can turn it off only on the main page. Although this looks a little odd on your home page, they can be very useful to your users as they go deeper into your site.


You can turn them off in Admin > Configuration > Layout settings > Define Breadcrumb Status and set to 0.


To turn them off on the main page, edit includes/templates/CUSTOM/templates/common/tpl_main_page.php.


Find the following lines of code:


 <!-- bof  breadcrumb -->
 <?php if (DEFINE_BREADCRUMB_STATUS == '1') { ?>
 <div id="navBreadCrumb"><?php echo $breadcrumb->trail(BREAD_CRUMBS_SEPARATOR);  ?></div>
 <?php } ?>
 <!-- eof breadcrumb -->

For Version 1.3.0+ change to:

 <!-- bof  breadcrumb -->
 <?php if (DEFINE_BREADCRUMB_STATUS == '1' && ($current_page!='index' || (int)$cPath>0)) { ?>
 <div id="navBreadCrumb"><?php echo  $breadcrumb->trail(BREAD_CRUMBS_SEPARATOR); ?></div>
 <?php } ?>
 <!-- eof breadcrumb -->

For Version 1.3.5 change to:

<!-- bof  breadcrumb -->
<?php if (DEFINE_BREADCRUMB_STATUS == '1' && !$this_is_home_page) { ?>
<div id="navBreadCrumb"><?php echo $breadcrumb->trail(BREAD_CRUMBS_SEPARATOR); ?></div>
<?php } ?>
<!-- eof breadcrumb -->

Save the file and upload to your server.


How do I change the copyright message in the footer?

If you find it necessary to change the footer for some reason, be sure to read the explanations below before making any edits. Then open the includes/languages/english.php file in your text editor.

Find the following lines of code:

define('FOOTER_TEXT_BODY', 'Copyright © ' . date('Y') . ' 
<a href="' . zen_href_link(FILENAME_DEFAULT) . '" target="_blank">' . STORE_NAME . '</a>. 
Powered by <a href="http://www.zen-cart.com" target="_blank">Zen Cart</a>'); 

The date('Y') automatically inserts the current year, so there's no need to change that unless you want to break the automatic function of the date display.

The zen_href_link(FILENAME_DEFAULT) will automatically insert your store's URL as found in the HTTP_SERVER setting of your configure.php file. It is recommended not to change this.

And the STORE_NAME will automatically show the name of your store, taken from your setting in Admin->Configuration->My Store->Store Name.

If you do decide to make changes, be sure to save the file to includes/languages/CUSTOM/english.php and upload to your server.

It is considered common courtesy to leave Powered by Zen Cart® intact as it assists in advertising the Zen Cart® project that is allowing you to create your new store and hopefully make money from it. If you want to list your shop in the Zen Cart® Showcase, you must leave the 'Powered by Zen Cart®' link in the footer for identification.


Where do I find the files I would edit to change other parts of my cart (i.e. template files, sideboxes, etc.)?

If you want to turn your sideboxes on and off, or move them left and right, you do this from the Admin panel in Admin > Tools > Layout boxes controller.


Other files you would modify are located in includes/templates/template_default.


Which file(s) you edit will depend on which page of your shop you want to customize. Working with these files is fairly easy since they are clearly marked with
<!--bof whatever-->
and
<!--eof whatever-->


This makes moving sections of the file easy. After editing any of these files save them in your /CUSTOM folder.


The most common file(s) to be customized are:

  • Language Files
    • includes/languages/english.php
    • includes/languages/english/*.php
    • includes/languages/english/html_includes/*.php
  • Template Files
    • includes/templates/template_default/common/tpl_header.php
    • includes/templates/template_default/common/tpl_footer.php
    • includes/templates/template_default/common/tpl_main_page.php
    • includes/templates/template_default /templates/tpl_product_info_display.php
  • Sidebox Files
    • includes/modules/sideboxes
    • includes/templates/template_default/sideboxes


A lot of your basic customization can be done from your Admin panel in:

  • Admin > Configuration
  • Admin > Catalog > Product type > Product > General > Edit Layout
  • Admin > Tools > Layout boxes controller


What directories contain all the images? (i.e. buttons, icons, images etc.)?

  • /images folder: This is where your product images are located.
  • /includes/languages/ENGLISH/images folder: icon.gif (your language flag).
  • /includes/templates/CUSTOM/buttons/ENGLISH folder: contains the buttons used by the cart.
  • /includes/templates/CUSTOM/images folder: contains header_bg.jpg, logo.gif and other images required by your template files.
  • /includes/templates/CUSTOM/images/icons folder: contains additional images used by the cart (specific to your template).


NOTE: If your template is looking for an image in the /includes/templates/CUSTOM/images folder but cannot find it, Zen Cart® will use the image in the /includes/templates/template_default/images folder.


How do I change the category (or any other sidebox) title?

Look in includes/languages/english.php. Suppose you want the Categories sidebox to have a different title. Look for:


 define('BOX_HEADING_CATEGORIES', 'Categories');

Additional changes for sideboxes will follow this pattern:

 define('BOX_HEADING_XXXXXXXX', 'New Title');

Make the needed changes, save the file to includes/languages/CUSTOM/english.phpand upload to your server.


Can I use an image for the sidebox header?

The short answer is yes. You can use two methods to achieve the result.


Method 1

Using an image editor, create your image sets with a name for each sidebox you want to change and save your graphics to includes/templates/CUSTOM/images/ and upload it to your server.


In your includes/languages/CUSTOM/english.php find this line of code:


 define('BOX_HEADING_CATEGORIES', 'Categories');


You can change it as follows:


 define('BOX_HEADING_CATEGORIES', 'your_english_graphic.jpg');


Now in includes/modules/sideboxes/CUSTOM/categories.php find this:


 $title = BOX_HEADING_CATEGORIES;


and change it to:


 $title = zen_image($template->get_template_dir(BOX_HEADING_CATEGORIES,
 DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . BOX_HEADING_CATEGORIES,
 HEADER_ALT_TEXT);


Note: You would do this for each of your sideboxes.


Make the needed changes, save the files and upload to them to your server.


Method 2

If you want to replace the default Zen Cart® background image (tile_back.jpg) to be used for all the sideboxes use an image editor to create your image (using the same dimensions as tile_back.jpg) and save it to includes/templates/CUSTOM/images/ and upload it to your server.


Now open you stylesheet.css and find following:


 .leftBoxHeading, {
 margin: 0em;
 background: url(../images/your_background_image.jpg) #FF6699;
 padding: 0.5em 0.2em;
 }	
 .rightBoxHeading {
 margin: 0em;
 background: url(../images/your_background_image.jpg) #FF6699;
 padding: 0.2em 0em;
 }


Change the image file name in each of the URL functions, save the stylesheet and upload both files to them to your server.