Using buttons/images in left hand sideboxes

[mommydesigns]

I have a customer who likes her current design but I'm not sure it's do-able in Zen. Right now, she has .jpg images in the left hand navigation panel for all of her main categories and pages (ie. Conact Us, About Us, etc).

Is this do-able in Zen or can we only use the Text from the Category names we create?

Thank you!

Jennie

[kobra]

Yes this attainable.

Check the image for the sidebox headings that you have for the width in pixels.

Insure that you set the box and column width to match in your admin.

There are at least two types or ways to do this.
One is using a styled sidebox header image(over the default rectangle with a solid color) and this would use the normal method for the box description.

Another is to have a complete image with the description as part of the image. I will assume that this is what you have.

Collect the default box titles and the image that you want to replace for these.

In your english.php file open it in a text editor. find the titles that you need to change. For illustration the categories is represented:

Find:

define('BOX_HEADING_CATEGORIES', 'Categories');

The red highlighted text would be replaced with:

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

You also need to alter the sidebox file for each that you want to change: find includes/modules/sideboxes/categories.php file and open this in your text editor. Find this entry:

$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);

Repeat for each that you will alter and save them to your override folder for your template in includes/modules/sideboxes/your_template/categories.php

Place the images files in: includes/templates/your_template/images/
folder.

[mommydesigns]

Thank you so much! Just getting all the buttons together to start doing this. I'll post an update when I get it done. :)

[Berserker]

Kuroi,

How do i get rid of the default rectange used for the sidebox header? When I upload an image with curvy edges, it still inside this rectange thing. How do i get rid of it?

Thank you

[Berserker]

Sorry...I mean Kobra :)

[kuroi]

Now you've offended us both! Good job we're buddies.

I seem to remember that you decided to stick with the Classsic Template and id so then between the two stylesheets there are at least four places where either background images or background colors are set for the sidebox headings - all of which could result in a colored or decrative rectangle sitting behind your heading images.

Very quickly, there's one here (already commented out)

/*.rightBoxHeading {
margin: 0em;
background-color: #663366;
padding: 0.2em 0em;
}*/

another here (also commented out)

.leftboxheading, .rightboxheading, .centerboxheading, .singleboxheading {
/*background-color: #abbbd3;*/
font-size: 10px;
font-weight: bold;
color: #ffffff;
padding: 3px;
height: 20px;
padding-left: 5px;
}

and two here (which are probably the ones still doing the damage)

TR.leftboxheading, TR.rightboxheading, TR.centerboxheading, TR.singleboxheading {
background: #abbbd3;
background-image: url(../images/tile_back.jpg);
}

[Berserker]

kuroi,

do i delete those codes?

p.s really sorry about the wrong name :)

[kuroi]

Depends how confident you feel about CSS. I always delete them because I have no worries about putting them (or something similar) back if I change my mind. And I feel that there's more than enough CSS in the stylesheets already without old, unused stuff hanging around as well.

But if you're less sure about CSS and want to be able to see what you've done, and maybe go back if it goes horribly wrong, the commenting out approach would work too.

[kuroi]

P.S. Kobra ALWAYS gets my name wrong ... but we're still buddies, so no problem

[kobra]

Hey All,

My memory chips were burning... ..so I knew someone was talking 'bout me.

Berserker,

If you have the ability to install a second instance of ZenCart and have access to another MySQL DB, you really need to do this and work on it as you can .. ..the old 'classic' template with the associated 2 stylesheets and tables. As time and Zen Cart moves forward don't get stuck with this version. Over very little time you will be soo happy that you did for it really is overall much easier to style than the table based version.

Seriously, quit your own head and becoming frustrated.

And Oh yes, Kurio & I are over the pond mates.