How do I remove and/or re-arrange the sideboxes?


[tube]NHmge2-XeV4[/tube]

Zen cart natively comes with many sideboxes and there are a ton more that you can install for additional functionality. If you are like me and love a clean, uncluttered, easy to navigate site, you will want to turn off most of these. This step by step tutorial will show you how to remove and/or re-arrange the sideboxes in your zen cart.

This tutorial features the Pink Boutique free zen cart template by Picaflor Azul. If you want to use it for your zen cart store, you can download it for free here.

1. Log into your zen cart admin and go to Tools -> Layout Boxes Controller

2. Select the sidebox that you want to edit or remove and click on the green “e”.

3a. To turn the box off set the “Left/Right Column Status:” to “OFF” and click on update.

3b. To turn the box on there are 3 bits of information you need to set:

  • A. “Left/Right Column Status:”–set to “ON”
  • B. “Location: (Single Column ignores this setting)”–set to “LEFT” or “RIGHT”
  • C. “Left/Right Column Sort Order:” (The position of the boxes is based on their sort order. Example: a box with a sort of 10 would be above a box with a sort of 30.)

And click on the “update” button.

If you need help customizing your zen cart web site, please contact us for a quote.

equation

Change the Color of the Sidebox Headers

This step by step tutorial will show you how to customize the color of the sidebox headers in your zen cart.

This tutorial features the All Business free Zen Cart template by Picaflor Azul. If you like the template, you can download it for free here.

In your favorite plain text editor, open includes/templates/your-template-override-directory/css/stylesheet.css find these selectors:

h3.leftBoxHeading

and

h3.leftBoxHeading a

Change the value for the property color: to your hexidecimal color code. So for example, in the stylesheet you would find:

h3.leftBoxHeading {font-size: 1.3em;color: #1bbee7;text-transform:uppercase;}
h3.leftBoxHeading a{font-size: 1.0em;
color: #1bbee7;text-transform:uppercase;}

and change it to:

h3.leftBoxHeading {font-size: 1.3em;color: #your hexidecimal color code;text-transform:uppercase;}
h3.leftBoxHeading a{font-size: 1.0em;
color: #your hexidecimal color code;text-transform:uppercase;}

And save the file.

If you need help customizing your zen cart web site, please contact us for a quote.

equation

Remove the Gift Certificate FAQ & Discount Coupons Links From the Information Sidebox

Would you like to remove the Gift Certificate FAQ and Discount Coupons links from the information sidebox? This step by step tutorial will show you how to do this easily from the zen cart admin.

This tutorial featured the Alysa Rounded free zen cart template by Picaflor Azul. You can download this template for free here.

Remove Discount Coupons Link

1. Log into your zen cart admin and go to Configuration -> Define Page Status:

2. Select “Define Discount Coupon” and click on the “edit” button.

3. To remove the link from the Information Sidebox, select option “2= Link OFF, Define Text ON” or “3= Link OFF, Define Text OFF”.

Remove Gift Certificate FAQ Link

1. Log into your zen cart admin and go to Module -> Order Total.

2. Select “Gift Certificates” and click on the “remove” button.

If you need help customizing your zen cart web site, please contact us for a quote.

equation

Disable the category/inventory counts (the numbers beside the category links)



If you don’t like to see the numbers next to your categories in the category sidebox, this step by step tutorial will show you how to turn them off.

This tutorial features the Apparel Boutique free zen cart template by Picaflor Azul. You can download it for free here.

1. Log into your zen cart admin and go to Configuration -> My Store

2. Select “Show Category Counts” and click on the “edit” button.

3. Click on “false” and then click on the “update” button.

Go to your site and see the results.

If you need help customizing your zen cart web site, please contact us for a quote.

equation

Change the Width of the Sideboxes


[tube]d9ETQVYbVCM[/tube]

This tutorial will show you step by step how to adjust the width of the zen cart sideboxes to fit your design and shop needs perfectly.

This tutorial will use our free zen cart template Alysa Rounded as an example. You can download this template for free here.

The left hand sideboxes are here:

1. Log into your zen cart admin and go to Configuration -> Layout Settings

2. Select Column Width – Left Boxes or Column Width – Right Boxes -whichever side you want to change and click on the “edit” button.

3. Add your new width and click on the “update” button. It can be expressed as a percentage of the total page width (20%) or as a relative size (190px). For example, if you want the sideboxes to shrink and grow depending on the window size you would set the left and right hand columns to 20% and the sideboxes to 100%.

4. If your new width is more than the Column Width – Left or Column Width – Right (if this is what you changed) then you will want to change this as well. Select the Column Width – Left, put in the new width (I prefer this to be wider than the sideboxes width) and click on the “update” button.

If you need help customizing your zen cart web site, please contact us for a quote.

equation

Turn On the Header Search Box

Make good use of your zen cart store’s header by adding a search box. This functionality is native to zen cart and easy to implement when you follow this step by step tutorial.

Log into your zen cart admin and go to Admin -> Tools -> Layout Boxes Controller:

Find the sideboxes/search_header.php and click on the green “e”.

Set the “Single Column Sort Order:” to something other than 0 and click “On” for “Single Column Status:”, then click on “update”.

You have just turned on the header search box! If you are using the Aberdeen Neutral template, it will look like this:

You can download all of the free zen cart templates by Picaflor Azul by clicking here. All of our free zen cart templates feature the ability to turn the search header box on or off.

If you need help with your zen cart web site, please contact us for a quote.

big contact Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

equation Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

Change the Names of Page 2, Page 3, or Page 4 Links in More Information Sidebox

This is a part of a series of tutorials on customizing the More Information Sidebox. Other tutorials in this series are:

How to Customize the More Information Sidebox

How to Change the Page Titles of Page 2, Page 3, or Page 4 in More Information Sidebox

How to Change the Browser Bar and Breadcrumbs Titles of Page 2, Page 3, or Page 4 in More Information Sidebox

How to Change the More Information Sidebox Header

This tutorial will show you step by step how to change the names of the Page 2, Page 3, or Page 4 links in the More Information sidebox.

In your favorite plain text editor, open includes/languages/english.php. On or around line 147 find this code:

// information box text in sideboxes/more_information.php - were TUTORIAL_
define(
'BOX_INFORMATION_PAGE_2', 'Page 2');
define(
'BOX_INFORMATION_PAGE_3', 'Page 3');
define(
'BOX_INFORMATION_PAGE_4', 'Page 4');

Change the text in green to your new text.

// information box text in sideboxes/more_information.php - were TUTORIAL_
define(
'BOX_INFORMATION_PAGE_2', 'Your Page Name');
define(
'BOX_INFORMATION_PAGE_3', 'Your Page Name');
define(
'BOX_INFORMATION_PAGE_4', 'Your Page Name');

Save the file to your template override directory, in this case includes/languages/custom-template-directory/english.php

***This is a php file and MUST be edited in a plain text editor. If you try to edit this file in any type of wysiwyg editor, the code will be corrupted and when you insert the file back into your zen cart it will break your entire site.***

If you need help with your zen cart web site, please contact us for a quote.

big contact Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

equation Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

Change the More Information Sidebox Header

This is a part of a series of tutorials on customizing the More Information Sidebox. Other tutorials in this series are:

How to Customize the More Information Sidebox

How to Change the Page Titles of Page 2, Page 3, or Page 4 in More Information Sidebox

How to Change the Browser Bar and Breadcrumbs Titles of Page 2, Page 3, or Page 4 in More Information Sidebox

How to Change the Names of Page 2, Page 3, or Page 4 Links in More Information Sidebox

This tutorial will show you step by step how to change the title of the More Information Sidebox header.

In your favorite plain text editor, open includes/languages/english.php. On or around line 147 find this code:

// information box text in sideboxes/more_information.php - were TUTORIAL_
define(
'BOX_HEADING_MORE_INFORMATION','More Information');

Change the text in green to your new text.

// information box text in sideboxes/more_information.php - were TUTORIAL_
define(
'BOX_HEADING_MORE_INFORMATION','Your Sidebox Heading');

Save the file to your template override directory includes/languages/custom-template-directory/english.php

***This is a php file and MUST be edited in a plain text editor. If you try to edit this file in any type of wysiwyg editor, the code will be corrupted and when you insert the file back into your zen cart it will break your entire site.***

If you need help with your zen cart web site, please contact us for a quote.

big contact Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

equation Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

Change the Page Titles of Page 2, Page 3, or Page 4 in More Information Sidebox

This is a part of a series of tutorials on customizing the More Information Sidebox. Other tutorials in this series are:

How to Customize the More Information Sidebox

How to Change the Browser Bar and Breadcrumbs Titles of Page 2, Page 3, or Page 4 in More Information Sidebox

How to Change the More Information Sidebox Header

How to Change the Names of Page 2, Page 3, or Page 4 Links in More Information Sidebox

This tutorial will show you step by step how to change the page title of the pages in the More Information Sidebox.

Open includes/languages/english/page_2.php. Find this code:

define('HEADING_TITLE', 'Page 2');

Change the ‘Page 2’ to your page name.

define('HEADING_TITLE', 'Your page name');

Save the file to your template override directory includes/languages/english/custom-template-directory/page_2.php

***This is a php file and MUST be edited in a plain text editor. If you try to edit this file in any type of wysiwyg editor, the code will be corrupted and when you insert the file back into your zen cart it will break your entire site.***

If you need help with your zen cart web site, please contact us for a quote.

big contact Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

equation Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

Customize the More Information Sidebox

The More Information sidebox in zen cart is perfect for adding extra pages of content to your site. It is very useful because you can edit the content of the pages via the define pages editor in the zen cart admin. By default, it comes installed with generic page names, titles, etc. This tutorial will show you step by step how to customize this sidebox to use it for your custom content. This tutorial will use our free zen cart template Andover Modern as an example. You can download this template for free here.

Preparation

Go to your Admin -> Tools -> Layout Boxes Controller and activate the more_information.php sidebox.

Change the Name of the Sidebox and the Names of the Sidebox Links

In your favorite plain text editor, open includes/languages/english.php. On or around line 147 find this code:

// information box text in sideboxes/more_information.php - were TUTORIAL_
define(
'BOX_HEADING_MORE_INFORMATION','More Information');
define(
'BOX_INFORMATION_PAGE_2', 'Page 2');
define(
'BOX_INFORMATION_PAGE_3', 'Page 3');
define(
'BOX_INFORMATION_PAGE_4', 'Page 4');

Change the text in green to your new text.

// information box text in sideboxes/more_information.php - were TUTORIAL_
define(
'BOX_HEADING_MORE_INFORMATION','Your Sidebox Heading');
define(
'BOX_INFORMATION_PAGE_2', 'Your Page Name');
define(
'BOX_INFORMATION_PAGE_3', 'Your Page Name');
define(
'BOX_INFORMATION_PAGE_4', 'Your Page Name');

Save the file to your template override directory, in this case includes/languages/andover_modern/english.php

***This is a php file and MUST be edited in a plain text editor. If you try to edit this file in any type of wysiwyg editor, the code will be corrupted and when you insert the file back into your zen cart it will break your entire site.***

Change the Page Name and Browser Bar/Breadcrumb Title

Open includes/languages/english/page_2.php. Find this code:

define('NAVBAR_TITLE', 'Page 2'');
define(
'HEADING_TITLE', 'Page 2');

Change the ‘Page 2’ to your page name.

define('NAVBAR_TITLE', 'Your page name'');
define(
'HEADING_TITLE', 'Your page name');

Save the file to your template override directory, in this case it is includes/languages/english/andover_modern/page_2.php

Add Your Text to the Page

Log into your zen cart admin and go to Admin -> Tools -> Define Pages Editor

Select define_page_2.php from the pull down menu.

Enter your page content into the big box.

You are all finished!

If you need help with your zen cart web site, please contact us for a quote.

big contact Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart

equation Zen Cart Tutorial: How to Add a Facebook Like Box to Zen Cart