Are you trying to add a logo instead of the header text, or are you trying to replace the whole header with your own image?
Also, if you could provide a link to the site you’re working on, that might be helpful. Thanks.
Thank you for responding! http://www.gluesky.com/ is the site, I got the header and description to hide, but the header is now so small. What can I do to make the header taller? I want my art/logo to fit above the “about”.
Thanks!
Well here is where I am now http://www.gluesky.com/ , I found out how to make the header taller, but not the art or the about to be where I want it. Here is some of the code, not sure what is relevant here:
From header-default:
<body class="<?php sandbox_body_class() ?>">
<div id="page">
<p id="top"><a id="to-content" href="#content" title="<?php _e( 'Skip to content', 'sandbox' ) ?>"><?php _e( 'Skip to content', 'carrington' ); ?></a></p>
<div id="header" onclick="location.href='http://www.gluesky.com/';" style="cursor: pointer;">
<div class="wrapper">
<strong id="blog-title"><a href="<?php bloginfo('url') ?>/" title="Home" rel="home"><?php bloginfo('name') ?></a></strong>
<p id="blog-description"><?php bloginfo('description'); ?></p>
<div id="navigation">
<ul>
<?php wp_list_pages('title_li='); ?>
<?php
global $user_ID;
if($user_ID) {
echo '<li class="secondary"><a href="' . site_url('wp-login.php?action=logout', 'login') . '">' . __('Log Out', 'carrington') . '</a></li>';
} else {
echo '<li class="secondary"><a href="' . site_url('wp-login.php', 'login') . '">' . __('Log In', 'carrington') . '</a></li>';
}
?>
<?php wp_register('<li class="secondary">', '</li>'); ?>
</ul>
</div><!-- #navigation -->
</div><!-- .wrapper -->
</div><!-- #header -->
<div id="sub-header">
<div class="wrapper">
<?php cfct_form('search'); ?>
<div id="all-categories">
<span class="heading">Categories:</span>
<ul>
<?php wp_list_categories('title_li='); ?>
</ul>
</div><!-- #list-categories -->
</div><!-- .wrapper -->
</div><!--#sub-header-->
<hr class="divider">
<div class="wrapper">
and from the css:
.wrapper {
clear: both;
margin: 0 auto;
width: 960px;
}
#header {
background: #51555c url(../images/header-gradient.gif) repeat-x bottom;
color: #cecfd1;
height: 130px;
}
#header .wrapper {
background: url(../images/header-texture.jpg) no-repeat center bottom;
overflow: hidden;
padding: 13px 10px 10px;
}
#header a,
#header a:visited {
color: #fff;
}
#header #blog-title {
font-family: "Avenir Light", "Futura Light", helvetica, arial, sans-serif;
display:none;
font-size: 3em;
font-weight:normal;
line-height: 1;
margin-bottom: .16666666em;
}
#header #blog-title a:hover {
text-decoration: none;
}
What would I change here to make the art fill and to make the about and log in at the bottom of the header?
The header background image is only 200px high, so short of creating a new, taller image, you could try opening the carrington-blog.css file and find the following:
#header .wrapper {
background:transparent url(../images/header-texture.jpg) no-repeat scroll center bottom;
overflow:hidden;
padding:13px 10px 10px;
}
Increase the first value in padding from 13px to about 83px and see what that looks like.
Yay!! Thank you, that worked 🙂
This is somewhat related to this topic. Where in the CSS might I look to change how far down the page the header links appear (About, etc). I’ve added my own header image but now the page links run through the header image. I am also using Carrington Theme. Thanks!
http://fscchildrensliterature.com/
