Need help? Check out our Support site, then


WordPress.com Forums » CSS Customization

Clickable header image and no header text in Sandbox theme

  1. pyratus
    Member

    Hey all!
    How can I make my header image link to the home page (www.eightforawish.com) and hide the blog name and description text in the Sandbox theme?
    Here's all of my CSS, many thanks;
    <br /> #primary {<br /> width:200px;<br /> }</p> <p>div#secondary {<br /> width:240px;<br /> margin-left:-270px;<br /> text-align:right;<br /> }</p> <p>div#content {<br /> margin-right:385px;<br /> }</p> <p>body {<br /> background-color:#000000;<br /> font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;<br /> margin:0;<br /> }</p> <p>div#wrapper {<br /> width:100%;<br /> margin:0;<br /> }</p> <p>div#nav-above,div#nav-below {<br /> height:1em;<br /> width:100%;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:18px;<br /> letter-spacing:-.04em;<br /> color:#336666;<br /> }</p> <p>div#nav-above {<br /> margin-bottom:1em;<br /> }</p> <p>div#nav-below {<br /> margin-top:1em;<br /> }</p> <p>.alignleft,div.nav-previous {<br /> float:left;<br /> margin-left:25px;<br /> }</p> <p>.alignright,div.nav-next {<br /> float:right;<br /> margin-right:25px;<br /> }</p> <p>p {<br /> font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;<br /> font-size:14px;<br /> }</p> <p>a {<br /> color:#336666;<br /> text-decoration:none;<br /> }</p> <p>h3 {<br /> color:#ffffff;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:24px;<br /> letter-spacing:-.08em;<br /> }</p> <p>blockquote {<br /> width:80%;<br /> background-color:##00aaaa;<br /> border-top:2px solid #00aaaa;<br /> border-bottom:2px solid #00aaaa;<br /> margin:5px auto;<br /> padding:10px;<br /> }</p> <p>div#header {<br /> background-color:#FFFFfF;<br /> height:280px;<br /> margin-top:0;<br /> border-bottom:2px solid #00aaaa;<br /> padding-top:0;<br /> text-align:left;<br /> width:100%;<br /> background-image:url('http://fatnurse.files.wordpress.com/2010/06/headerresize21.png');<br /> background-position:left;<br /> background-repeat:no-repeat;<br /> }</p> <p>h1#blog-title {<br /> color:#ffffff;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:54px;<br /> font-weight:700;<br /> padding-left:340px;<br /> padding-top:100px;<br /> margin:10px 0 0;<br /> }</p> <p>#blog-description {<br /> padding-left:175px;<br /> padding-top:0;<br /> margin-left:240px;<br /> background-image:url('mini_swatch_lt.png');<br /> background-position:left;<br /> background-repeat:no-repeat;<br /> color:#336699;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:22px;<br /> font-weight:400;<br /> }</p> <p>#access .skip-link {<br /> position:absolute;<br /> display:none;<br /> right:1em;<br /> top:1em;<br /> }</p> <p>.entry-content {<br /> background-color:#ffffff;<br /> border:2px solid #00aaaa;<br /> color:#000000;<br /> font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;<br /> font-size:14px;<br /> letter-spacing:.02em;<br /> line-height:19px;<br /> text-decoration:none;<br /> margin-left:100px;<br /> width:800px;<br /> padding:10px;<br /> }</p> <p>.page-title {<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:36px;<br /> font-weight:400;<br /> letter-spacing:-.08em;<br /> text-decoration:none;<br /> margin:0 0 0 25px;<br /> }</p> <p>.entry-title {<br /> background-image:url('title_swatches.png');<br /> background-position:left;<br /> background-repeat:no-repeat;<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:28px;<br /> font-weight:400;<br /> letter-spacing:-.08em;<br /> text-decoration:none;<br /> padding-left:100px;<br /> padding-bottom:10px;<br /> margin:0 0 0 25px;<br /> }</p> <p>.entry-title:hover {<br /> background-image:url('title_swatches_hover.png');<br /> background-position:left;<br /> background-repeat:no-repeat;<br /> color:#336666;<br /> }</p> <p>.entry-date {<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:16px;<br /> letter-spacing:-.02em;<br /> text-decoration:none;<br /> padding-left:100px;<br /> }</p> <p>.published {<br /> border:none;<br /> }</p> <p>.entry-meta {<br /> color:#ffffff;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:12px;<br /> margin-bottom:25px;<br /> margin-left:0;<br /> padding-left:130px;<br /> text-decoration:none;<br /> }</p> <p>.entry-content img {<br /> border:2px solid ##00aaaa;<br /> background-color:#ffffff;<br /> margin:0 auto;<br /> padding:10px;<br /> }</p> <p>.entry-content img:hover {<br /> border:2px solid ##00aaaa;<br /> background-color:#336666;<br /> margin:0 auto;<br /> padding:10px;<br /> }</p> <p>div.sidebar div,div.sidebar h3,div.sidebar ul,div.sidebar li {<br /> margin:0;<br /> padding:0;<br /> }</p> <p>.sidebar h3 {<br /> background-image:url('mini_swatch.png');<br /> background-position:right;<br /> background-repeat:no-repeat;<br /> border:none;<br /> text-decoration:underline;<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:24px;<br /> font-weight:400;<br /> letter-spacing:-.08em;<br /> width:230px;<br /> margin:15px 0 0;<br /> padding:0;<br /> }</p> <p>.sidebar input#s {<br /> width:7em;<br /> }</p> <p>.sidebar li {<br /> list-style:none;<br /> color:#ffffff;<br /> margin:0;<br /> }</p> <p>.sidebar li form {<br /> margin:.2em 0 0;<br /> padding:0;<br /> }</p> <p>.sidebar ul ul {<br /> margin:0;<br /> }</p> <p>.sidebar ul ul li {<br /> display:block;<br /> list-style:none;<br /> padding:0;<br /> }</p> <p>.sidebar ul ul li a {<br /> border-bottom:1px solid ##00aaaa;<br /> color:#ffffff;<br /> display:block;<br /> text-decoration:none;<br /> padding:2px;<br /> }</p> <p>.sidebar ul ul li a:hover {<br /> background:#ffffff;<br /> border-bottom:1px solid #08558E;<br /> color:#336666;<br /> display:block;<br /> text-decoration:none;<br /> }</p> <p>.sidebar ul ul ul {<br /> margin:0 0 0 .5em;<br /> }</p> <p>.sidebar ul ul ul li {<br /> list-style:circle;<br /> }</p> <p>#comments {<br /> font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;<br /> font-size:14px;<br /> color:#008b8b;<br /> width:75%;<br /> margin:0 auto;<br /> }</p> <p>.nopassword {<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:36px;<br /> font-weight:700;<br /> }</p> <p>#comments-list ol {<br /> background-color:#ffffff;<br /> font-family:verdana, Arial, Helvetica, sans-serif;<br /> text-align:right;<br /> margin:0;<br /> padding:0;<br /> }</p> <p>#comments-list ol li {<br /> list-style:none;<br /> padding:10px;<br /> }</p> <p>#comments .alt {<br /> background-color:#ffffff;<br /> border-top:2px solid ##00aaaa;<br /> border-bottom:2px solid ##00aaaa;<br /> text-align:left;<br /> padding:10px;<br /> }</p> <p>#commentform {<br /> background-color:#ffffff;<br /> border:2px solid ##00aaaa;<br /> color:#ffffff;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:14px;<br /> padding:10px;<br /> }</p> <p>form#commentform .form-label {<br /> margin:1em 0 0;<br /> }</p> <p>input#author,input#email,input#url {<br /> font-family:verdana, Arial, Helvetica, sans-serif;<br /> font-size:16px;<br /> background-color:#ffffff;<br /> border-bottom:1px solid #00aaaa;<br /> border-left:0;<br /> border-right:0;<br /> border-top:0;<br /> color:#ffffff;<br /> width:95%;<br /> margin:5px;<br /> }</p> <p>input#author,input#email,input#url,textarea#comment {<br /> padding:.2em;<br /> }</p> <p>textarea#comment {<br /> font-family:verdana, Arial, Helvetica, sans-serif;<br /> font-size:14px;<br /> background-color:#ffffff;<br /> border:1px solid #00aaaa;<br /> color:#336666;<br /> height:13em;<br /> overflow:auto;<br /> width:95%;<br /> margin:5px;<br /> }</p> <p>.form-label {<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:24px;<br /> font-weight:400;<br /> letter-spacing:-.08em;<br /> }</p> <p>p#comment-notes {<br /> font-family:verdana, Arial, Helvetica, sans-serif;<br /> font-size:10px;<br /> }</p> <p>.comment-author {<br /> color:#336666;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:24px;<br /> font-weight:400;<br /> letter-spacing:-.08em;<br /> text-decoration:none;<br /> padding:2px;<br /> }</p> <p>.comment-meta {<br /> color:#336666;<br /> font-family:verdana, Arial, Helvetica, sans-serif;<br /> font-size:11px;<br /> text-decoration:none;<br /> padding:2px;<br /> }</p> <p>#comments .alt .comment-author {<br /> background-image:url('cs_comments_darkbg_pink20.png');<br /> background-position:left;<br /> height:26px;<br /> padding:0 0 4px 25px;<br /> }</p> <p>#comments .comment-author {<br /> background-image:url('cs_comments_lightbg_lblue20.png');<br /> background-position:right;<br /> background-repeat:no-repeat;<br /> height:26px;<br /> padding:0 25px 0 0;<br /> }</p> <p>.comment meta {<br /> padding-right:75px;<br /> }</p> <p>#footer {<br /> background:#00aaaa;<br /> border-top:5px solid #00aaaa;<br /> clear:both;<br /> color:#ffffff;<br /> font-family:"century gothic", Arial, Helvetica, sans-serif;<br /> font-size:14px;<br /> height:35px;<br /> letter-spacing:-.08em;<br /> padding-top:.3em;<br /> position:relative;<br /> right:0;<br /> text-align:center;<br /> text-transform:lowercase;<br /> width:100%;<br /> }</p> <p>#nav-above a,#nav-below a,.entry-meta a,#commentform a {<br /> color:#336666;<br /> }</p> <p>h1,#footer a,#blog-title a,.entry-title a:hover {<br /> color:#336666;<br /> }</p> <p>h2,#footer a:hover,.entry-title a,.entry-meta a:hover,.comment-author a,.comment-meta a {<br /> color:#336666;<br /> }</p> <p>#content .entry-content {<br /> width:100%;<br /> min-width:400px;<br /> }

    The blog I need help with is eightforawish.com.

  2. timethief
    Member

    I did a Google search for you and located these threads http://tinyurl.com/7pfax9w by searching for "sandbox header image link to the home page site:en.forums.wordpress.com" I hope this helps. Please be patient while waiting for Staff to assist you.

  3. pyratus
    Member

    You know what? I feel like a right prat. I'd looked on Google and I'd looked on the forums and couldn't find a solution.
    But until you linked that search I didn't see the last post of this thread; http://en.forums.wordpress.com/topic/making-header-image-click-able?replies=9

    Which helped me and works now. Thanks very much my friend. I used the exact text from the last post in that thread and changed the dimensions to fit my own header.

  4. timethief
    Member

    That's great news. I'm glad I was able to help you.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags