WordPress › Support » How To Change Header

neilcg
Member
Posted 3 years ago #

Hi All

I have taken over a blog and hate the header. I want to change the images and text. I just can't find where to do this. I have looked in the header.php and the stylesheet .css.

The theme is Excellence by Jai Nischal Verma, but I think it has been altered a fair bit by previous owner.

Any help would be greatly appreciated. Many Thanks

The header.php is here:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/tabber.js"></script>
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/tab.css" type="text/css" media="screen" />
<script type="text/javascript">
<!--
function popup(url)
{
 params  = 'width='+screen.width;
 params += ', height='+screen.height;
 params += ', top=0, left=0'
 params += ', fullscreen=yes';

 newwin=window.open(url,'windowname4', params);
 if (window.focus) {newwin.focus()}
 return false;
}
// -->
</script>

<?php wp_head(); ?>
</head>
<body>
<div id="wrapper">
<div id="header">
</div>

<div id="nav_left"><!-- --></div>
<div id="navigation">
<ul id="menu">
<li class="<?php if (((is_home()) && !(is_paged())) or (is_archive()) or (is_single()) or (is_paged()) or (is_search())) { ?>current_page_item<?php } else { ?>page_item<?php } ?>"><a href="<?php echo get_settings('home'); ?>">Home<?php echo $langblog;?></a></li>
<?php wp_list_pages('sort_column=menu_order&depth=1&title_li='); ?>
</ul>
</div><!-- end of navigation -->
<div id="nav_right"><!-- --></div>

<table id="mainbody" >
	<tr>
		<td valign="top">
			<div id="buyform">
				<?php include (TEMPLATEPATH . '/sidebar2.php'); ?>
			</div>
		</td>
		<td>

The Stylesheet:

*/

/**************** Body *********************/
*{margin:0;padding:0;}
body{background:#adadad; top repeat-x; font-family:Arial; font-size:14px;}
#wrapper {width:932px; margin:auto;}

/**************** Links & formatting *********************/
a, a:link, a:visited, a:active {color:#669900; text-decoration:none;}
a:hover{color:#666666;}
h2.message {font-size:12px; color: #666; background-color:#EFEFEF;
 padding:5px 5px 5px 10px; margin-bottom:10px; text-transform:uppercase; font-weight:normal;}

/**************** Header *********************/
#header {height:65px;
 padding-bottom:0px; margin-top:10px; margin-left:10px; position:relative;
 background:url(images/top-tab.png);background-repeat:no-repeat;}
#logo {width:171px; float:left; background:url(images/logo-white-background.png); height:60px;}
#logo h1 a {color:#CCCCCC; font-size:134px; display:block;}
#logo h1 a:hover {color:#FFFFFF;}
#logo h2 {color: #666666; font-size:11px; text-transform:uppercase; margin-top:2px;}
#logo_right {width:350px; float:right;}
#topsearch {margin-top:10px; float:right; margin-right:10px;}
.rss {width:105px; height:56px; position:absolute; bottom:0px; right:180px; display:block;}
.searchfield {padding:5px 7px 5px 7px; border:none; color:#ccc; font-family:Arial, Helvetica, sans-serif; background-color: #4A4A4A; font-size:12px; width:160px;}

/**************** Navigation *********************/
#nav_left {width:17px; height:30px; background:url(images/menu-left-edge.png); float:left; }
#navigation{height:30px; background:url(images/menu-centre.png) repeat-x;
 float:left; width:875px; }
#menu{text-align:left; z-index:50; position:relative; margin-top:1px; }
#menu li{display:inline;list-style:none; font-weight:bold; font-size:14px;}
.page_item a:link, .page_item a:visited{color:#fff; line-height:34px; display:block; padding:0 20px 0 20px; float:left; margin-right:5px; margin-top:-4px;}
.page_item a:hover {color:#fff;  text-decoration:none; repeat-x;}
.current_page_item a:link, .current_page_item a:visited{color:#fff;margin-right:5px;line-height:34px; padding:0 20px 0 20px; display:block; float:left; text-decoration:none;}
#nav_right {width:17px; height:30px; background:url(images/menu-right-edge.png); float:left; }

/************main body**********/
#mainbody {width:876px; background-color:#fff; margin-left:15px;}

#cformsii{ padding:0px; margin:0px;}

/*************form*****************/
#buyform {float:left; width:180px; background-color:#fff;}

/**************** Entry *********************/
#blog { width:420px;float:left; margin-top:20px; margin-left:10px; padding-left:10px; }
#blog li{margin-left:20px; list-style-type:none;}
.post {padding:10px 0 30px 0;}
.post h2 {line-height:32px; margin-bottom:5px;}
.post h2 a{font-size:26px; color:#333333; letter-spacing:-1px;}
.post h2 a:hover {color:#000000;}
html>body .post  ul { margin-left: 0px; padding: 0 0 0 30px; list-style: none; padding-left: 10px; text-indent: -10px; }
html>body .post  li { margin: 7px 0 8px 10px; }
.post ul li:before{ content: "0BB 020"; }
.post img {margin:0 10px 10px 10px;}
.date {font-size:11px; color: #669900; padding:5px 0 5px 0; position:relative; height:20px;}
.comms { position:absolute; right:0px; top:0px;}
.comms a {font-size:11px; text-transform:uppercase; font-weight:bold; color: #fff; background:url(images/comment.gif) no-repeat; padding:10px 0 0 0px; text-align:center; display:block; height:18px; width:107px;}
.comms a:hover {color: #456127;}
.meta{background-color:#EEEFE0;border:1px solid #dbdbdb;color:#333;font-size:10px;line-height:20px;margin:10px 0px 10px;padding:2px 6px 2px 6px;text-transform:uppercase;width:445px;}
.meta a { color:#666; font-weight:bold;}
.meta a:hover {color:#000;}
.date span { font-weight:bold; color:#669900;}
.content {line-height:24px; color:#333;}
.content p {margin:0 0 15px 0;}
.postmetadata {padding:5px; border:1px solid #dbdbdb;background-color:#EEEFE0; font-size:10px; line-height:18px; text-transform:uppercase;}

/**************** Sidebar *********************/
#sidebar {float:left; width:210px; padding:20px 0 0 40px;}
#sidebar p {color:#666; line-height:20px;}
#sidebar ul li {list-style:none;}
#sidebar h2 {font-size:15px; color:#333333; margin:20px 0 20px 0; clear:both;}
h2.author {background:url(images/author_icon.jpg) left no-repeat; padding-left:24px;}
.authimg {float:left; margin:0 20px 0 0;border:1px solid #999999;}
.ads li {list-style:none; display:inline; margin-right:15px;}
.ads li img {border:1px solid #999999;}
.adhere a {font-size:11px;}

#sidebar2 ul li {list-style:none;}

.sidebar1, .sidebar2 {float:left; width:200px; margin-bottom:20px;}
.sidebar1 h2, .sidebar2 h2 {background:url(images/categories.jpg) left no-repeat; padding-left:24px;}
.sidebar1 ul li ul li {padding:5px 0 5px 10px; font-size:12px; list-style:none; }
.sidebar2 ul li ul li {padding:5px 0 5px 10px; font-size:12px; list-style:none;}

/**************** Comments *********************/
.alt{margin:0;padding:10px;}
.commentlist{padding:0;}
.commentlist li{background-color:#EEEFE0;border:1px solid #dbdbdb;list-style:none;margin:15px 0 10px;padding:5px 5px 10px 5px;}
.commentlist li ul li{margin-left:10px;margin-right:-5px;}
.commentlist p{color:#666666;font-size:12px;margin:10px 5px 10px 0;}
.children{padding:0;}
#commentform p{margin:5px 0;}
.nocomments{margin:0;padding:0;text-align:center;}
h2#comments{clear:both;color:#333333;font-size:15px;margin:0px 0 20px 0;}
h2#respond{clear:both;color:#333333;font-size:15px;margin:20px 0 20px 0;}
.commentmetadata{background-color:#fff;color:#333;font-size:13px;margin:0;padding:3px 5px 3px 5px;}
.commentmetadata a{color:#333;font-weight:bold;}
#author, #email, #url{background:#EEEFE0;border:1px solid #dbdbdb;color:#666666;font:12px Arial;margin-right:5px;padding:3px;width:12em;}
#comment{background:#EEEFE0;border:1px solid #dbdbdb;color:#666666;font:12px Arial;padding:3px;width:99%;}
#submit{font:1em Arial;margin-bottom:15px;margin-top:5px;padding:2px;}

/**************** Footer *********************/
#footer { height:104px; background:url(images/footer.jpg) repeat-x;}
.copyright {font-size:11px; color:#fff; width:930px; margin:auto; padding:20px 10px 10px 10px; text-transform:uppercase;}
.copyright a{color:#97BE3D;}
.copyright a:hover {color:#fff;}

/**************** Gallery *********************/
.gallery {text-align:center;}
.gallery img {padding:2px; height:100px; width:100px;}
.gallery a:hover {background-color:#ffffff;}
.attachment {text-align:center;}
.attachment img { padding:2px; border:1px solid #999999;}
.attachment a:hover {background-color:#FFFFFF;}
.imgnav {text-align:center;}
.imgleft {float:left;}
.imgleft a:hover {background-color:#FFFFFF;}
.imgleft img{ padding:2px; border:1px solid #999999; height:200px; width:100px;}
.imgright {float:right;}
.imgright a:hover {background-color:#FFFFFF;}
.imgright img{ padding:2px; border:1px solid #999999; height:100px; width:100px;}

/*******Miscellaneous*******/
.navigation {clear:both;}
.alignleft {font-weight:bold; float:left; margin:10px 0 20px 0; text-transform:uppercase; font-size:12px;}
.alignright {font-weight:bold; float:right; margin:10px 0 20px 0; text-transform:uppercase; font-size:12px;}
acronym, abbr, span.caps {cursor: help;}
acronym, abbr {border-bottom: 1px dashed #999;}
blockquote {margin: 6px 10px 6px 10px; padding-left: 10px; border-left: 2px solid #E0E55F; }
blockquote cite { margin: 5px 0 0; display: block; }
pre {border: solid 1px #9a9a9a;color: blue;margin: 10px;padding:10px;background: #f3f2ed}
code {font-size:1.0em;color: #0099CC; display:block; margin-bottom:15px; }

yellaojrak
Member
Posted 3 years ago #

Image: I think editing #header {background:url(imagefile/here);} and/or #logo {background:url(imagefile/here);} would do.

Text: From your dashboard, go to Settings, everything is there.

neilcg
Member
Posted 3 years ago #

Hey

Thanks for the reply. I will look at that tomorrow and report back.

Thanks for your help.

Neil

neilcg
Member
Posted 3 years ago #

Hi

I looked at setting but could not find anywhere to edit these, any more clues would be fantastic.

Thanks

Neil

yellaojrak
Member
Posted 3 years ago #

Okay then. Site url, please?

neilcg
Member
Posted 3 years ago #

Hi Yellaojrak

So grateful for your help and offer to help further, much appreciated, but I have actually decided to chnage theme and the issue is sorted.

However I do have another issue which I am going to post on a new thread. It relates to fonts, I want all my pages to use helvectica but dont know how to edit the stylesheet to accomplish this.

If you can help with this I would be most grateful, but as I say I will submit a new thread on it also.

Thanks

Neil

yellaojrak
Member
Posted 3 years ago #

Oh, that's supossed to be in your theme's style.css. Look for a word 'body' in there. Within body's brackets, look for 'font-family' or 'font'. Then edit the first font name. Example:
body {font-family:Tahoma,Verdana,Arial,sans-serif;}

edit
body {font-family:Helvetica,Verdana,Arial,sans-serif;}

neilcg
Member
Posted 3 years ago #

Hey

Thanks, I know exactly where that is. I tried to put helvetica as so:

"helvetica" but it didn't work.

So simple I just move it to the front.

Thanks so much.

Neil

neilcg
Member
Posted 3 years ago #

Hi yellaojrak

You have been so helpful, I wonder if you might just help once again, much appreciated. I am fairly new to this and learning so much all the time.

I want to insert a couple of images from file into the header. I am just not sure of the best way to do it.

The url is : http://www.greenbananaguide.com and I want to put the images on the right hand side just in front of the rss logo.

The header section of my stylesheet is below. Do I need to for example open the images in dreamweaver and get the code and insert it in the stylesheet. If I am correct where would I put it?

Thanks again.

*/
 /* ----------------------------------------------
   HEADINGS, SITE NAME AND SLOGAN
------------------------------------------------- */
.ftitle {
	height:170px;
	margin-bottom: 5px;
	color: #0000FF;
	background-color: #99FFFF;
	width: 250px;
	overflow: hidden;
}
h1 {
	font-size: 18px;
	color: #6b6b6b;
	font-weight: bold;
	padding: 16px 10px 15px 10px;
}
h3 {
	padding: 16px 10px 4px 10px;
	font-size: 14px;
	color: #6b6b6b;
	font-weight: normal;
}
h2 {
	font-size: 16px;
	color: #6b6b6b;
	font-weight: normal;
	padding: 0px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 4px;
	}
#header h1#logo-text a {
	position: absolute;
	float: left;
	margin: 0; padding: 0;
	font: bold 25px;;
	text-decoration: none;
	color: #fff;
	top: 55px; left: 35px;
        font-size: 27px;
}
#header p#slogan {
	position: absolute;
	margin: 0;
	padding: 0;
	color: #FFFFFF;
	letter-spacing: -0.5px;
	top: 75px;
	left: 35px;
	font-size: 18px;

}
#sidebar h3 {
	color: #7f931d;
	text-transform: none;
	font-size: 1.6em;
	width: 280px;
	margin-top: 10px;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 2px;
	clear: both;
	list-style: none;
}
 ul.categories {
 	text-decoration: none;
 	}
#footer-wrap h3 {
	color: #7f931d;
	margin: 0;
	padding: 10px;
	text-transform: uppercase;
	text-align: center;
}
#central .title {
	font-size: 14px;
	clear: both;
	padding-top: 5px;
	float: left;
	padding-bottom: 2px;
	width: 550px;
}
 /* ----------------------------------------------

starlan620
Member
Posted 3 years ago #

I also have a problem on changing the header and I don't follow the solution given, it is because I am not technically trained and slow to follow.

starlan620
Member
Posted 3 years ago #

Hi Ms. yellaojrak, what do you mean by, "Okay then. Site url, please?" and where can I find the site url? Please help me...ty!

Samuel B
moderator
Posted 3 years ago #

starlan620
she means what is the url to your site?
different themes do things differently

yellaojrak
Member
Posted 3 years ago #

@neilcg: I'm not sure I get you right, but...

If you want to change the green thing in your header, you can add something like this:
#header {background:url('urlofyourimagehere');}

If you want to add something like the rss button in your header, I think you're going to have to deal with the theme's php file (e.g., header.php).

@starlan620: site url is the site's address. E.g., http://wordpress.org/support/

neilcg
Member
Posted 3 years ago #

Hi yellaojrak

Thanks very much again. Sorry I was not clear. Yes I want to add an image like the rss button onto the green header.

I will try this in the header php.

I wonder, would I do something similar to the background suggestion that you gave replacing background with image.

I will have a go anyway.

Most grateful

Neil

yellaojrak
Member
Posted 3 years ago #

I'm not good with php, so sorry I can't help much. But if you have the script already, I think you can put it in the header.php. Don't forget to back up the file, well... just in case.

Sorry.

neilcg
Member
Posted 3 years ago #

Hi Thanks

I am muddleing through.

WordPress.org

Forums

How To Change Header (16 posts)

Topic Closed

About this Topic

Tags

Code is Poetry