X-Cart forums - change category font size (left hand navigation column)

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - change category font size (left hand navigation column) (https://forum.x-cart.com/showthread.php?t=52748)

change category font size (left hand navigation column)

Greetings!

i need a little help.

i have tried to make the font size of my categories smaller. but i cant seem to find where to do that...

i have tried various routes...

i know that the categories are listed via /customer/categories.tpl

Code:

{*

$Id: categories.tpl,v 1.35 2009/05/12 07:37:15 max Exp $

vim: set ts=2 sw=2 sts=2 et:

*}

{capture name=menu}

{if $active_modules.Flyout_Menus}

  {include file="modules/Flyout_Menus/categories.tpl"}

  {assign var="additional_class" value="menu-fancy-categories-list"}

{else}

  <ul>

    {foreach from=$categories_menu_list item=c name=categories}

      <li{interline name=categories}><a href="home.php?cat={$c.categoryid}" title="{$c.category|escape}">{$c.category}</a></li>

    {/foreach}

  </ul>

  {assign var="additional_class" value="menu-categories-list"}

{/if}

{/capture}

{include file="customer/menu_dialog.tpl" title=$lng.lbl_categories content=$smarty.capture.menu}

but all that does is create an un-numbered list of the categories, there isnt any way to change the font size there.

i can tell from there that i need to be looking at "menu-categories-list"

i have tried to find in my css files where that is, and i thought i had found it, but changing it had no effect...

in main.css

there is this...

Code:

/*==============================================================================

  side-bar styles

==============================================================================*/

/*

  categories list

*/

.menu-categories-list img.icon {

  background: transparent url(images/dingbats_categorie.gif) no-repeat left top;

}

.menu-categories-list ul li {

  padding: 4px 0px 5px 20px;

  background: transparent url(images/category_bullet.gif) no-repeat 8px 5px;

}

.rtl .menu-categories-list ul li {

  padding: 4px 20px 5px 0px;

  background: transparent url(images/category_bullet_invert.gif) no-repeat right 5px;

}

.menu-categories-list ul li a:link,

  .menu-categories-list ul li a:visited,

  .menu-categories-list ul li a:hover,

  .menu-categories-list ul li a:active

{

  font-size: 12px;

}

i would think that the last line, font-size 12 pixels would be what i am looking for. but when i change it, nothing changes on my customer side...

any help would be appreciated.

thanks.
michael

Re: change category font size (left hand navigation column)

.menu-categories-list ul li a:link, .menu-categories-list ul li a:visited, .menu-categories-list ul li a:hover, .menu-categories-list ul li a:active

Thats the css selector the font size is in for your site. If you don't see any changes, clear your cache. I tested in firebug and changing font size in that did work. You may also want to recache your templates if clearing your browser cache didn't work.

Re: change category font size (left hand navigation column)

recache my templates? how do i do that?

i have changed the 12px line to 22px, and uploaded it, and then refreshed my browser (f5) and it downloaded the main page again, but the fonts are the same size still....

michael

Re: change category font size (left hand navigation column)

I recached your templates for you :P
In the future, when you make changes to the .tpl files you will need to go to http://www.chippiesavalanche.com/cleanup.php to clear out the template cache.

Also, just pressing f5 wont clear your cache. Assuming you use firefox, hold down ctrl and press f5 with ctrl still being held down.

Re: change category font size (left hand navigation column)

thanks!

i finally had to force the size change issue....

in categories.tpl, i added a font size command, at -5, that made them smaller.

crude but it works... i dont know why the css didnt work...

Re: change category font size (left hand navigation column)

Remove the <font> tags. They're deprecated and will be removed in future HTML revisions. When that happens, any compliant browsers will revert and act as if <font> doesn't exist.

Again, assuming you use firefox you can do Tools->Options->Advanced->Network->"Clear now" button

That will clear your cache. Everything is updating fine on my end.

Re: change category font size (left hand navigation column)

Greetings!

well, im using ie7.... (already cleared that cache)

ok... i removed the font tags from categories.tpl, and changed the 12px line to 7px (from the example above) it put the category font size back to the original size (too large)

i dont understand why its not changing....

am i missing something?

i upload the files to /skin1 (main.css) and skin1/customer (categories.tpl)

but the changes dont take effect...

if i add a couple of letters say "sdfsdf" in categories.tpl, and press f5, they show up immediatly, but font changes dont..

very confusing....

been programming for a while, and its not making sense why its not working

Code:

.menu-categories-list ul li a:link,

  .menu-categories-list ul li a:visited,

  .menu-categories-list ul li a:hover,

  .menu-categories-list ul li a:active

{

  font-size: 7px;

}

is what i have it set to now.... it should show as about normal sized text, but its not... its showing as larger text...

any suggestions?

michael

ps. appreciate the help

Re: change category font size (left hand navigation column)

I just checked, it's still set to 15px. Your 7px is being overridden as well.

The CSS you need to look for:

Code:

.menu-categories-list ul li a:link, .menu-categories-list ul li a:visited, .menu-categories-list ul li a:hover, .menu-categories-list ul li a:active {

font-size:15px;

font-weight:bold;

}

The one you edited was this:

Code:

.menu-categories-list ul li a:link, .menu-categories-list ul li a:visited, .menu-categories-list ul li a:hover, .menu-categories-list ul li a:active {

font-size:7px;

}

Looks the same, but is different. That means theres another .css file you have to edit. I cant tell you which, since firebug isn't listing the css file names.

Re: change category font size (left hand navigation column)

I did find this piece of code in skin1\main.css

.menu-dialog .content {
border: 0px;
background-color: #ffffff;
padding: 8px 10px 20px 10px;
overflow: hidden;
}
.menu-dialog .content a:link,
.menu-dialog .content a:visited,
.menu-dialog .content a:link
{
color: #324c76;
font-size: 9px;

There was no font size originally in this code. I changed it to 9 to see the effects and it did change the category font size but it changed all the other menu font sizes as well.

I'm going to keep looking for a bit so if I find anything else I'll let you know.

Re: change category font size (left hand navigation column)

Okay here it is.

skin1\modules\Flyout_Menus\Icons

.fancycat-icons-c li.closed ul {
display: none;
}
.fancycat-icons-c ul li a:link,
.fancycat-icons-c ul li a:visited,
.fancycat-icons-c ul li a:hover,
.fancycat-icons-c ul li a:active
{
color: #324c76;
font-size: 11px;

Also if you want to compress the lines and bring them closer together you can change the line-height to 7 or 8 or any number.