Zen Cart How to Change the Logo Alignment

There are many changes that you can make to your zen cart store. One thing you can do is change the position of the logo in the header. In zen cart, the logo is left aligned by default. If, for example, you wanted to change it to be right aligned, you would have to modify the includes/templates/CUSTOM/css/stylesheet.css file.

Open the file in your favorite plain text editor, and find this block of code:


#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {float: left;}

This is code is a collection of several ‘selectors’. You will want to change this code so that when you make your changes to the logo, they will not interfere with the layout of other sections. In order to do this, you must split this code into two separate statements and create a new selector/definition below it. Here is an example of this:


.centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {float: left;}
#logo {float: left;}

To center the logo use text-align: center. Or, if you want to align it to the right use float: right;

After you have made your changes, save the file to includes/templates/CUSTOM/css/stylesheet.css and upload to your server.

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

At Picaflor Azul, we specialize in custom designed responsive zen carts to fit any business, and accommodate any budget. Contact us today about converting your current zen cart to a responsive design, or to have a fantastic new custom design custom tailored to fit your needs and preferences. Now that more and more people shop online from their mobile devices(smart phones, ipads, etc.), mobile friendly websites are more important than ever to convert customers, and increase sales. We can also offer you help with module installation, wordpress integration, or a full zen cart upgrade.

zen cart plus picaflor azul equals success