Forums / Templates, Stylesheets, Page Layout / Hiding the sidebox heading fonts/links....

Hiding the sidebox heading fonts/links....

Locked

Views: 7,563

Results 21 to 29 of 29
This thread is locked. New replies are disabled.
9 Oct 2007, 11:49 AM
#21
miles avatar

miles

Zen Follower

Join Date:
Oct 2006
Location:
At Home
Posts:
357
Plugin Contributions:
0

Hiding the sidebox heading fonts/links....

Aha..when you said > there is nothing else you need to do beside load your boxhead-manufacturers.gifI knew what went wrong. I have to rename each image to its own name.

e.g
Categories sidebox header - boxhead-categories.gif
Manufacturer sidebox header - boxhead-manufacturers.gif

Now its done. Works like charm.

Thanks gjh42 for your support.:smartalec:

- Nothing is impossible. Some things are just less likely than others. -

28 Sep 2009, 11:12 AM
#22
xman888 avatar

xman888

Zen Follower

Join Date:
Jan 2007
Posts:
226
Plugin Contributions:
0

Re: Hiding the sidebox heading fonts/links....

Hello,

Is this mod meant to remove the text/colour bar in the sideboxes, and replace it with my custom logo, or do I need to make extra code changes to remove the text/colour bar of the sideboxes?

I tried to follow the thread, however got extremely confused.

Kind regards,
Anthony

28 Sep 2009, 1:25 PM
#23
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Hiding the sidebox heading fonts/links....

The mod by itself will not affect the "color bar" which is a background image named tile_back.gif; it will replace the text with the image that you save with the correct name.

You don't need to do any of the coding that this thread describes, just download and install the Image Titles mod from Free Addons.

If you need any more assistance, please post in the Image Titles Support Thread.

15 Jan 2010, 4:23 PM
#24
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: Hiding the sidebox heading fonts/links....

I have a method that uses just the CSS to hide the text and display an image instead, so this method needs no code changes - and if you later want to revert to the text headings, its a matter of either "commenting out" or deleting the relevant css declarations.

The method involves:

  1. Creating suitable images for each sidebox, making sure that they are a standard height and width (where width does not exceed the sidebox width setting you have specified in your admin>>>configuration>>>layout settings...Column Width Left Boxes and Right Boxes.

Give these images suitable names (categorieshead.jpg , etc...) and FTP them to your template's images folder.

  1. Creating the CSS declarations, and making sure these are appended to the BOTTOM of stylesheet.css so they override earlier declarations governing sidebox headings.

The css looks like this:

/* - - - - - SIDEBOX HEADINGS WITH IMAGES AND NO TEXT - JUST CREATE NEW IMAGES FOR ALL ACTIVE SIDEBOXES - - - - - -*/ 
/* - - - - PART ONE. DETERMINE THE ID FOR ALL RELEVANT SIDEBOXES AND APPEND TO THIS LIST - - - */
/* - - - - WHERE HEADING IS A LINK BE SURE TO INCLUDE THE LINK AND VISITED ID - - - -  eg: #whatsnewHeading a, #whatsnewHeading a:visited */

#categoriesHeading, #reviewsHeading, #reviewsHeading a, #reviewsHeading a:visited, #informationHeading, #moreinformationHeading, #whatsnewHeading, #whatsnewHeading a, #whatsnewHeading a:visited, #ezpagesHeading, #extralinksboxHeading {
	color: transparent;
	font-size: 0px; /* --- makes text headings invisible in MSIE - Stupid MSIE behaviour -----*/
	height: 30px; /* - - HEIGHT OF YOUR IMAGES */
	background-position: top left;
	background-repeat: no-repeat;
	background-color: transparent;
	}
/* - - PART TWO. NOW FOR EACH SIDEBOX LISTED ABOVE - CALL ITS IMAGE FROM YOUR TEMPLATES IMAGE FOLDER - - */
#categoriesHeading {
	background-image: url(../images/categorieshead.jpg);
}
#reviewsHeading {
	background-image: url(../images/reviewshead.jpg);
}
#informationHeading {
	background-image: url(../images/informationhead.jpg);
}
#moreinformationHeading {
	background-image: url(../images/moreinformationhead.jpg);
}
#whatsnewHeading {
	background-image: url(../images/whatsnewhead.jpg);
}
#ezpagesHeading {
	background-image: url(../images/ezpageshead.jpg);
}
#extralinksboxHeading {
	background-image: url(../images/extralinkshead.jpg);
}

20 years a Zencart User

15 Jan 2010, 4:37 PM
#25
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Hiding the sidebox heading fonts/links....

Nice work! The one concern I would have is that search engines are said to not like "hidden" text (transparent/white-on-white, 0 height...).
If it can be confirmed that this is not a real problem in this usage, I would recommend the method.

16 Jan 2010, 10:44 PM
#26
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: Hiding the sidebox heading fonts/links....

What about just leaving font-size: 0px; and getting rid of "transparent"?

Will the SE's see font = 0px and penalize that too?

20 years a Zencart User

16 Jan 2010, 10:51 PM
#27
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: Hiding the sidebox heading fonts/links....

Looking at the source code I don't actually think that either transparent or font=0px in the CSS will have any influence on SE activity here...

Where's Melanie Prough... ? Please help us here!

20 years a Zencart User

16 Jan 2010, 11:03 PM
#28
schoolboy avatar

schoolboy

Totally Zenned

Join Date:
Jun 2005
Location:
Cumbria, UK
Posts:
10,327
Plugin Contributions:
0

Re: Hiding the sidebox heading fonts/links....

Here's an interesting post in webmasterworld.com...

There have been reports of googlebot fetching some stylesheets, I myself have never seen it

I think as part of google Algo that they may very well try to fetch a stylesheet for further reading if the site it's crawling also raises some other flags.

I do not believe it can or ever will simply fetch a stylesheet and parse it for the words display: none; or visibility: hidden; or z-index: -9999px; etc..

the Cascade and Specificty would make it very hard for them to put it all in context based on a single rule and besides there are very many legitimate uses for such rules. If anything they, google, might just get enough flags from various sources of their algo, not just the css, to warrant a hand check on a site. So if you're using it legitimately all will be well, regardless of if the stylesheet is read or not.

There's a lot of FUD promoted about stylesheet properties and hidden text, but common sense always prevails ;)
Google themselves are using an image replacement technique which uses the word "hidden" in the css

20 years a Zencart User

17 Jan 2010, 3:41 AM
#29
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Hiding the sidebox heading fonts/links....

Yes, that's one of those things that a human can glance at and say "no problem", while a bot might or might not get the correct take on it... only a well-placed expert can say for sure.