• Resolved bhale7

    (@bhale7)


    Hi, I’m trying to add an image approximately 642×100 above my content and below my menu bar. I have a child theme setup for twentyelven and have already made a bunch of CSS changes, but I can’t figure out how to accomplish putting the image where I want it.

    My site is http://elitegamingcomputers.com

Viewing 9 replies - 1 through 9 (of 9 total)
  • try in header.php;

    in this area:

    </header><!-- #branding -->
    
    	<div id="main">

    before, after, or inbetween those lines – anywhere there is below the menu, but with slightly different effects.

    you might need to wrap the image code in a span or div, or add a css class to the image html tag, for easier formatting.

    Thread Starter bhale7

    (@bhale7)

    Thanks for responding alchymyth. I’m not really familiar with how to work with .php stuff.

    Right now I just have the style.css in my child theme and have imported the twentyeleven theme. I’ve made all my changes through that thus far.

    To do this, do I need to make a .php file in my child theme, or change it in the editor in my wordpress dashboard?

    you need to save a copy of header.php into your child theme folder (for instance using ftp http://codex.wordpress.org/FTP_Clients ); then edit it.

    Thread Starter bhale7

    (@bhale7)

    Alright, I copied the header.php file over, but now I’m having trouble with the right code to put in. I googled putting images in .php files and used this:

    <?php
    
    $image = url ("http://elitegamingcomputers.com/wp-content/uploads/2012/07/1test.png");
    $height = 280;
    echo '<img src="'.$image.'" style=width:"' . $width . 'px;height:' . $height . 'px;">';
    
    ?>

    It turned everything except my header and my menu bar white (probably because the image I’m using is just a test image and it’s all white.)

    I entered the code after <div id=main> and before it and both yielded the same results. I’m assuming that the code I’m using is wrong. Any ideas?

    why don’t you simply use html?

    this would replace all your posted code:

    <img src="http://elitegamingcomputers.com/wp-content/uploads/2012/07/1test.png" style="width:1000px;height:280px;">

    btw:
    in your code, the one ” was at the wrong location, and the width value is missing;

    echo '<img src="'.$image.'" style="width:' . $width . 'px;height:' . $height . 'px;">';
    Thread Starter bhale7

    (@bhale7)

    That worked! I’m really new to all of this and the only way I was able to alter the page as much as I did was by googling the effect I wanted and changing it in the style.css sheet in my child theme.

    The .php files are a whole new beast for me to tackle.

    Now that I have the image on there, what kind of code do I use to center it and change the padding? I tried adding:

    align="middle"

    And

    align="center"

    But nothing happened.

    http://elitegamingcomputers.com

    If you look at my page now, the image is there, but it is sitting on the right side of the page, and the padding is uneven on the top and bottom. I’m assuming I need to enter some kind of “align” and “padding” code, but I’m not sure how to arrange it.

    Thread Starter bhale7

    (@bhale7)

    By the way, thank you for your help!

    Thread Starter bhale7

    (@bhale7)

    Okay, I got it to center, but I can’t get it to move up. It’s almost like it’s as high as it can go, because when I change the padding it only effects the bottom of the image.

    Thread Starter bhale7

    (@bhale7)

    Nevermind! I figured that out, too. I added:

    margin-top:-8px

    That did it, now I just have to create the image. Thanks again for all your help.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Adding an image above content and below menu bard’ is closed to new replies.