Twenty Eleven
Replace site title with image (4 posts)

  1. LFC1280
    Posted 2 years ago #

    Hi there,

    I've been following instructions all around internet to replace title and description of Twentyeleven theme for an image instead. This is 1.7 version, but it should be the same, I guess...

    Anyway, I have created a child theme, activated it, selected Show header text with your image checkbox and typed the following code into my new style.css file:

    h1#site-title span, h2#site-description {
    h1#site-title {
        	text-indent: -9999px;
        	background: url(./images/Header01.png) no-repeat;
        	width: 1000px;
        	height: 150px;
        	display: block;

    However, the image I want to place istead text (1000x150 width x height) appears misslifted from the position it should be, with blank spaces behind. You can check at http://www.boarding-gates.com

    How could I solve this? How could I place the header to take the mentioned space?

    Thanks in advance.

  2. MtpIntros
    Posted 2 years ago #

    Hey LFC1280,

    Go to your .css file and go to line: 523

    There add the following code:
    margin-left: -76px;

    After adding that it will look like this:

    #site-title {
    margin-right: 270px;
    padding: 3.65625em 0 0;
    margin-left: -76px;


  3. LFC1280
    Posted 2 years ago #

    Hi buddy,

    Yeah, thanks to firebug I found out that the #hgroup block was the key. I don't remember exactly what line of the original style.css was "padding" the h1 block, but I solved including margin: -55px 0 0 0; instruction in the style.css file of my child theme, and the banner went to the good position.

    Is this instruction correct, from the developer's point of view? I mean, maybe this could be done by another way, (let me say) less tricky. It could be possible?



  4. LFC1280
    Posted 2 years ago #

    Yeah, that's what I meant: I've made a test by making the firefox window smaller, and I've realized the banner I attached doesn't get resized along with the header image.

    As far as I know, Twenty Eleven theme is responsive, but maybe I should add some code into the style.css to activate it, or to any other file. ┬┐Does anybody know how to do this?


Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic