remove category side box from main page

Hello,

I am tired from searching all the world :lamo: to solve my problems :

1- I want to remove the category side box from the main page and let it appear in all other pages.

2- I want to change the category links to be blocks not just words and have spaces between each category name in the side box as show in the photo i sent with my post.

1. Check post #4 here:

http://www.zen-cart.com/forum/showthread.php?t=159053

2. That's done in the stylesheet, with background colors, etc.

To find what to change, install the Firefox browser and the Web Developer plugin for Firefox. You can use those to see where in the stylesheet you change the styling of the various page elements.

Ctrl-Shift-Y will allow you to hover over a section of the page and see the class and id names for that section in the box at the top. The statements in the stylesheet that begin with # are id's and the ones that begin with dots are classes.

Ctrl-Shift-E will open the CSS editor and allow you to edit the stylesheet and see the changes in real time without changing anything permanently. An essential tool.

Some prefer Firebug, which does much the same thing.

stevesh:

1. Check post #4 here:

http://www.zen-cart.com/forum/showthread.php?t=159053

That is great solution for my problem and it's solved now :clap::clap: .

stevesh:

2. That's done in the stylesheet, with background colors, etc.

To find what to change, install the Firefox browser and the Web Developer plugin for Firefox. You can use those to see where in the stylesheet you change the styling of the various page elements.

Ctrl-Shift-Y will allow you to hover over a section of the page and see the class and id names for that section in the box at the top. The statements in the stylesheet that begin with # are id's and the ones that begin with dots are classes.

Ctrl-Shift-E will open the CSS editor and allow you to edit the stylesheet and see the changes in real time without changing anything permanently. An essential tool.

Some prefer Firebug, which does much the same thing.

I am in the stylsheet already and i play in the correct place [ i think coz i am not perfect in CSS ]

i 'll show you the cod after i change it and how it look like, But i want it to show as the photo i attached so plz help me with the correct cod and correct place :

/* categories box parent and child categories */
A.category-top, A.category-top:visited {
	color: #2C2C2C;
	text-decoration: none;
	background-image: url(../images/category_back.gif);
    border-right: 80px solid #B5AE9B;
	font-size: 1.5em;
    font-family: "Arial', serif;
	}

it's look as you see in the attached photo in this replay, But i want it to same as the previous one.

You need to add
display: block;
to the style rule shown above.

Do you have a file /includes/templates/your_template/images/category_back.gif?

border-right: 80px solid #B5AE9B;
Do you really want an 80px colored block on the right of the text?

Thank you for your fast and correct replay. :clap::clap:

gjh42:

You need to add
display: block;
to the style rule shown above.
:clap::clap:
Yes that is the missing cod to show them as block

gjh42:

Do you have a file /includes/templates/your_template/images/category_back.gif?

Yes and it wasn't the problem the problem was. How to make the category link show as block.

gjh42:

border-right: 80px solid #B5AE9B;
Do you really want an 80px colored block on the right of the text?

:no: No. It was one of my stupid tests :no:
Now the correct cod i am using now is :

/* categories box parent and child categories */
A.category-top, A.category-top:visited {
color: #2C2C2C;
display: block;
text-decoration: strong;
background-image: url(../images/category_back.gif);
padding: 0.4em 0.2em;
font-weight: bold;
font-size: 1.4em;
font-family: "Arial';
}

I have another small question :

I am using EZ-pages at header [ EZPagesTop ]

I want to make them to fill the bar not just be all at left.
I want to replace [ :: ] between each EZ-page name in the top and replace it with [ | ].
Here is the cod in my stylesheet if that can help :

#navEZPagesTop {
background-color: #3e3e3e;
font-size: 0.95em;
margin: 0em;
padding: 0.5em;
}

thunder2010:

I want to replace [ :: ] between each EZ-page name in the top and replace it with [ | ].

ADMIN > CONFIGURATION > EZ-PAGES SETTINGS

EZ-Pages Header Link Separator
Default =  :: 

change to:
EZ-Pages Header Link Separator
 | 

One way would be to add this to the stylesheet:

#navEZPagesTop a {
margin:0 9em 0 9em;
}

Adjust the 9em to suit your site.

Admin - Configuration - EZ Page Settings to change the separator.

rbarbour:

ADMIN > CONFIGURATION > EZ-PAGES SETTINGS

EZ-Pages Header Link Separator
Default =  :: 

change to:
EZ-Pages Header Link Separator
 | 

Thank you .. this is exactly what i need for this problem.

stevesh:

One way would be to add this to the stylesheet:

#navEZPagesTop a {
margin:0 9em 0 9em;
}

Adjust the 9em to suit your site.

Admin - Configuration - EZ Page Settings to change the separator.

Thank you man for this help too :clap: