Style Questions on Shop

[HEAT]

Hi there.

I am having some issues in changing the logo position (when you click the logo it takes you to the main menu) and the sub-category markers.

I think they look ugly in the current version and I wonder how I can change them to more stylish ones.

Have a look at my attached picture to make you better understand what I am talking about.

Many thanks for your support.

[clydejones]

Hi there.

I am having some issues in changing the logo position (when you click the logo it takes you to the main menu) and the sub-category markers.

I think they look ugly in the current version and I wonder how I can change them to more stylish ones.

Have a look at my attached picture to make you better understand what I am talking about.

Many thanks for your support.

for the first part of your question check here:
www.zen-cart.com/tutorials/index.php?article=125

for the second part:

check the downloads section for

Better Categories Mod
OR

the Categories Dressing Mod

There are also several other mods available such as the Fly Out Menu

[HEAT]

Thanks.

I had already done this:



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.


STILL IT IS LEFT ALIGNED!!! WHY?

[clydejones]

Thanks.

I had already done this:



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.


STILL IT IS LEFT ALIGNED!!! WHY?

URL for your site?

[HEAT]

URL for your site?

www.heatperformanceparts.com/heatshop

[clydejones]

www.heatperformanceparts.com/heatshop

You can only float (left or right)

You need to change this declaration in the stylesheet:

#logo {float: center;}

To

#logo {text-align: center;}

[s_t_e_v_e]

#logo {
text-align:center;
}


RE subcats - For a simple change you can change the separators used in the admin : configuration -> layout settings..

or you can edit stylesheet and change the classes
a .category-top {}
a .category-products {}

I recomend firefox with the web developer extension

[HEAT]

You can only float (left or right)

You need to change this declaration in the stylesheet:

#logo {float: center;}

To

#logo {text-align: center;}

It worked. Many thanks.

[HEAT]

#logo {
text-align:center;
}


RE subcats - For a simple change you can change the separators used in the admin : configuration -> layout settings..

or you can edit stylesheet and change the classes
a .category-top {}
a .category-products {}

I recomend firefox with the web developer extension

Is there a list where one could find all the seperator codes?

[s_t_e_v_e]

The separator codes are just normal html characters - including special html entities such as   for a 'no break space;'

my choice would be to delete the separators in the admin and to use the stylesheet to visually separate the subcategories...