Can’t give specifics without seeing your site.
In general, the header text will be set in /wp-content/themes/{themename}/header.php
Look at that file.
If you header text is set in an <h1> ..... </h1> tag, and that tag is contained within a
<div id="header">
<h1> ..... </h1>
</h1>
structure
you would add this to style.css
#header h1 { font-size: 36px; }
that will change the font size on h1, but only h1 found within an IF of header.
You must substitute whatever tag is wrapped around your header text in your theme for <h1>, and the ID of the div that tag is contained within for id="header"
Thread Starter
lotgla
(@lotgla)
My site is this one:
http://www.glanssmycken.se
It’s the font for “Glanssmycken” in the header I would like to change from Arial to Vivaldi. I can change in style.css but then all the text on the site is changed and that doesn’t look so good…
In my file header.php this is the code:
<!-- Header -->
<div id="header">
<h1 class="blog-title"><a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a></h1>
<p class="blog-description"><?php bloginfo('description'); ?></p>
</div>
In style.css:
html
{
font:normal 12px Arial, Helvetica;
background:url(../img/bg/background.png) repeat !important;
}
And also:
#header
{
clear:both;
width:980px;
height:120px;
}
#header .blog-title
{
padding:30px 20px 0px 20px;
font-size:30px;
}
#header .blog-title a
{
text-decoration:none;
}
#header .blog-description
{
padding:0px 20px 0px 20px;
}
#header * {font-family:Vivaldi}
Would be a quick easy way to apply it to all elements in the header.
Of course remember, that is only going to display for users with the font installed, mac, windows or other os alike, if the PC being used to view the site doesn’t have the font, it’ll default to something else… regardless of which method is used in the CSS.
#header basically targets the elements with id=”header” and anything following that before the opening { is a sub-element.., in this case we use * , which simply means ALL.
Hi
Try adding this to your stylesheet /wp-content/themes/{themename}/style.css
#header .blog-title, #header .blog-title a {
font-family: Vivaldi, arial, helvetica;
}
The other fonts in the list are in case Vivaldi is not installed on a computer. Vivaldi would not be a common font. When a browser can’t find on the computer a font it is supposed to display, it goes down the list and uses the first font it finds. If it can’t find any, it uses the default font defined in the browser’s setup.
