Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Header text font and colur

Header text font and colur

Views: 1,276

Results 1 to 14 of 14
8 Jun 2011, 8:10 PM
#1
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

Header text font and colur

Hi I'm new zenacrt bit have a question about headers. I have google this question and searched the forum and FAQs bit there must be an answer somewhere.

I can edit the header text (H1) but don'tm know how to change the font or colour of the main text. I can't find it in the stylesheet file and it seems to be the only text that I can't change the colour of!
please help, John

8 Jun 2011, 11:15 PM
#2
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,182
Plugin Contributions:
0

Re: Header text font and colur

John,
could you please provide a link to your site without the http://www. so much easier to help you...

9 Jun 2011, 6:18 AM
#3
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

Re: Header text font and colur

Sure, curvesandcorsets.com/catalog please bear in mind that it is work in progress:D

9 Jun 2011, 6:41 AM
#4
misty avatar

misty

Inactive

Join Date:
Apr 2004
Location:
UK
Posts:
5,752
Plugin Contributions:
1

Re: Header text font and colur

BACKUP Stylesheet first..then alter

body {    margin: 0;    [B]font-family: verdana, arial, helvetica, sans-serif;    font-size: 62.5%;    color: #ffffff;[/B]    background-color: #a600a6;    }
9 Jun 2011, 7:18 AM
#5
chris007 avatar

chris007

New Zenner

Join Date:
Jun 2011
Posts:
1
Plugin Contributions:
0

Re: Header text font and colur

Hi johnybravo,

Ready suggestion carefully and implement step by step follow

**Changing the Colors & Fonts **

Start by opening the style sheet in your favorite text editor: /includes/themes/template_custom/css/stylesheet.css All of the pages are broken into smaller pieces called "classes" and each class has a style. The class styles are used to control the look of your fonts, colors, text size, borders, background images, etc. Change the colors by substituting standard HTML color numbers for the text and background colors. Change the fonts by increasing or decreasing the size, change the font by using a different font name.

To remove a CSS element, such as a border, simply comment out the line you don't want to use with a "/" (slash, asterisk) at the beginning of the line and "/" (asterisk, slash) at the end of the line. After making your changes upload the stylesheet to the directory, refresh your browser and admire your handywork.

**Changing the Header **

To change the images, upload your logo and header background images to the image directory: includes/themes/template_custom/images/ Either name your images to match the .css file or rename the images in the stylesheet. You can use GIF, JPEG or PNG images. See "Changing the Text and Titles" for instructions on changing headline in the header.

Enjoy

Regards
Chris Theron
Attune Infocom Inc
Visit: ##########################(Dot)com
Email : info(At)##########################(Dot)com
Zen cart Developer

9 Jun 2011, 7:37 AM
#6
misty avatar

misty

Inactive

Join Date:
Apr 2004
Location:
UK
Posts:
5,752
Plugin Contributions:
1

Re: Header text font and colur

Easiest way to view stylesheet settings is to download/install
Firefox and then add Web Developers Tool Kit

10 Jun 2011, 4:55 PM
#7
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

Re: Header text font and colur

Thanks for your replies but unfortunatley they do not answer my question. Misty I think I will have to download fire fox as the coding you suggest changes the body text colour and not the header.

Chris, thank you but that answer is in the Zen-cart FAQ which also does not tell you how to change the header **font **or colour.

If you look at my link you will see that the Header title "Curves and Corsets" is black. I am trying to turn it white to match the body text and also change the font slightly.

11 Jun 2011, 2:32 AM
#8
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,182
Plugin Contributions:
0

Re: Header text font and colur

Find this:

catalog/includes/templates/classic/css/stylesheet.cssFind this:
The highlighted red font below will change to ffffff> #tagline {
color: #000000;
font-size: 2em;
text-align: center;
vertical-align: middle;}

Take time and click the link on the top left hand on this page called: Tutorials/FAQ

Search for: override system

11 Jun 2011, 9:50 PM
#9
johnybravo avatar

johnybravo

Zen Follower

Join Date:
Jun 2011
Posts:
107
Plugin Contributions:
0

Re: Header text font and colur

Thanks haredo, I didb't know it was "tagline" in the style sheet that changed it. If it specifiaclly mentions it in the FAQ then I can't find it. I also did a search in the forum for the font and found that I need to add the line "font-Family". Again I couldn't find this in the FAQs.

12 Jun 2011, 2:14 AM
#10
haredo avatar

haredo

Totally Zenned

Join Date:
Apr 2006
Location:
Texas
Posts:
6,182
Plugin Contributions:
0

Re: Header text font and colur

Your welcome, and ty for posting the solution..

16 Jul 2011, 12:17 AM
#11
valerie6128 avatar

valerie6128

New Zenner

Join Date:
Aug 2010
Posts:
67
Plugin Contributions:
0

Re: Header text font and colur

I have downloaded crisom editor and have no idea where to look to change my background, what do I open to change it, any help would be greatly appricated. I see all types of files, ect but really do not know what do.

I do not see anything that says stylesheet???????

Thanks,
Valerie

16 Jul 2011, 12:18 AM
#12
valerie6128 avatar

valerie6128

New Zenner

Join Date:
Aug 2010
Posts:
67
Plugin Contributions:
0

Re: Header text font and colur

I also want to change the text on the top of my home page any one know how.

16 Jul 2011, 12:23 AM
#13
valerie6128 avatar

valerie6128

New Zenner

Join Date:
Aug 2010
Posts:
67
Plugin Contributions:
0

Re: Header text font and colur

I found this under featured php I just want to change the background to a solid color do I do it here?

}
?>

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html <?php echo HTML_PARAMS; ?>> <head> <meta http-equiv="Content-Type" content="text/html; charset=<?php echo CHARSET; ?>"> <title><?php echo TITLE; ?></title> <link rel="stylesheet" type="text/css" href="includes/stylesheet.css"> <link rel="stylesheet" type="text/css" href="includes/cssjsmenuhover.css" media="all" id="hoverJS"> <script language="javascript" src="includes/menu.js"></script> <script language="javascript" src="includes/general.js"></script> <?php
17 Jul 2011, 1:02 AM
#14
rescoccc avatar

rescoccc

Totally Zenned

Join Date:
May 2010
Location:
WA State
Posts:
1,700
Plugin Contributions:
2

Re: Header text font and colur

You'll find your style sheet in includes/templates/YOURTEMPLATE/css. Download the stylesheet.css file, open it in a text editor, and the first section will look like this:

body {
margin: 10;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 62.5%;
color: #000000;
background-color: #ffffff;
}

Change background-color: to whatever color you desire and then re-upload the file to the same location.