logo
Ask your WordPress questions! Pay money and get answers fast! (more info)

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.

$10
Changing the blog title to an image/logo in Oulipo Theme

Here is my URL:

http://melissa-mcmahon.com.

I managed a few days ago to replace the blog name header "swapmeat" with my logo using this code

<h1 class="masthead"><img src="<?php bloginfo('template_url'); ?>/images/piggy.jpg" alt="melissa-mcmahon Dot Com" />

piggy.jpg is the name of the logo file which is stored in the images folder in the Oulipo theme folder.

This is the ONLY change that I made to this theme.

Everything looked great on my Mac using firefox. I tested it on a PC using Internet Explorer and it looked fine yesterday. Today I looked a the site in internet explorer and the main text was spilling out into the side bars, causing the logo to cover text as you scroll down.

I have not changed anything since yesterday. I have no idea why it is all of a sudden not compatible with internet explorer.

Can someone tell me a better way to imput my logo as I assume this is what has caused the issue with markup?

Suggestions?

Thanks so much,
m

This question has been answered.

melissamcmahon | 11/04/10 at 3:02pm Edit

Previous versions of this question: 11/04/10 at 3:36pm | 11/04/10 at 3:36pm | 11/05/10 at 3:38pm

(2) Possible Answers Submitted...

See a chronological view of answers?

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

  • avatar
    Last edited:
    11/08/10
    12:46pm
    Jermaine Oppong says:

    Try this code. I've changed the bloginfo parameter.



    <h1 class="masthead">
    <img src="<?php bloginfo('template_directory'); ?>/images/piggy.jpg" alt="melissa-mcmahon Dot Com" />
    </h1>



    You can also use CSS sprites. Check this video out:

    http://css-tricks.com/video-screencasts/43-how-to-use-css-sprites/

    Previous versions of this answer: 11/04/10 at 3:52pm

    • 11/04/10 3:58pm

      melissamcmahon says:

      sweet. I'll check this out when I get back to my desk.

  • avatar
    Last edited:
    11/08/10
    12:46pm
    idt says:

    piggy.jpg is not in your theme/images directory. Did you remove it?

    If the image specified in img tag can't be found, the browser will display the text specified in the alt attribute, in your case "melissa-mcmahon Dot Com". So that could be the reason you're having that issue.

    And you're missing the closing <h1> tag in your code above if you did not omit it on purpose. It should have been


    <h1 class="masthead"><img src="<?php bloginfo('template_url'); ?>/images/piggy.jpg" alt="melissa-mcmahon Dot Com" /></h1>

    Previous versions of this answer: 11/04/10 at 3:55pm

    • 11/04/10 3:57pm

      melissamcmahon says:

      this is not why I am having the issue.
      In order to have the page start viewing properly again, I deleted and re-loaded the theme. I had too many followers telling me it was all screwed up and it got a little annoying and I can't access my ftp from where I am right now. I won't be back at my desk until tonight. I will put the file back in images when I get back to my desk.
      I've attached a picture of how screwed up the view of this is explorer - as you can see my logo is totally floating in the middle of nowhere....

    • 11/04/10 4:05pm

      idt says:

      Sorry, but I could not find the attached image of your site's screwed up view. Can you please attached it again?

    • 11/04/10 4:15pm

      idt says:

      Your theme actually has an area for a logo image(160pxX120px), just above your site's title text "SWAPMEAT".

      To have your logo display in the area I mentioned, you could add this to you CSS:


      span.header_image {
      background-image: url("images/piggy.jpg")
      }

      Just make sure that the dimension of your logo is 160X120 pixels.

    • 11/05/10 2:47pm

      idt says:

      Also, your sidebar is just 160px wide. So it's either you make your logo 160px wide or you have to specify a width for your logo in your CSS with this:


      h1.masthead a img{
      width: 160px;
      }

    • 11/05/10 3:38pm

      melissamcmahon says:

      I'm not sure this is the issue however since the text is also aout of whack! (sorry, I need to verify my permissions and I'm not able to get access to FTP right now, otherwise I would test the code...I will do so tonight). I think it's a greater issue than the picture size. It works fine on all browsers other than IE. The main body of text is spilling into my side bars. Trying to attach an screenshot:

    • 11/05/10 3:40pm

      melissamcmahon says:

      for some reason, screenshot will not upload.

    • 11/05/10 3:42pm

      melissamcmahon says:

    • 11/06/10 9:30am

      idt says:

      I went to check your site and it seems you have adjusted your logo to 160px wide and that's good because when a content is wider that it's container, it can cause an issue on the layout. It may look good in some browsers but a big chance it will break on other browsers.

    • 11/06/10 11:18am

      melissamcmahon says:

      Yes, I changed it to 160px, but it's super small and hard to read. I've just adjusted it to be larger. On my screen it works (I'm on a mac using firefox). Unfortunately I don't have access to a PC again until monday in order to test explorer. At that time I'll know if the actual size of the image is what is causing the problem, however I'm not sure it is (or it would be messed up in any browser).

      I'll get back to you monday with the result.

This question has expired.





Current status of this question: Completed



Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.