Need help? Check out our Support site, then


Adding a Gif to the right of the Main title

  1. I am using the Twenty Eleven template and I have a picture in the Main Title which is positioned against the left side of the page. I would like to place a small GIF to the right side of the Main Title. Is that possible and if so, once I determine the size of space available, how do I put it up there?

    Thanks,

    Millgrove Wood Products

    The blog I need help with is monaleasaa.wordpress.com.

  2. I don't have a solution but actually have a somewhat similar problem. I have replaced the blog title with a logo, which is on the left and woud like to position the header just to the right of that.

    http://www.blakelandscapes.net

  3. @monaleasaa
    All CSS editing is theme specifci and you posted a link to a private blog. Which theme are you working with?

  4. @blakelandscapes
    Please do not post into more than one thread on the same issue. You have already posted this one http://en.forums.wordpress.com/topic/re-position-header-in-2010?replies=3 and Staff will get to you as soon as they can.

  5. I'm working with 2010. Not sure why that is my member link. The blog is http://www.blakelandscapes.net

  6. My bad

  7. No problem. :) Only one Staff member appears to be helping with CSS editing these days. Please be patient while waiting.

  8. I would like to place a small GIF to the right side of the Main Title. Is that possible and if so, once I determine the size of space available, how do I put it up there?

    #site-title span a {
      padding-right: 40px;
      background: url(http://s.wordpress.org/about/images/logos/wordpress-logo-32-blue.png) no-repeat center right;
    }

    Replace http://s.wordpress.org/about/images/logos/wordpress-logo-32-blue.png with your image link. Adjust the 40px right padding until it fits with the size of your image.

  9. Hi again, I used the code above to place a small Gif file to the right of the main menu on the Twenty Eleven Template, using the following location address for the file:

    C:\Users\user\Millgrove Wood Products Files\Test Millgrove Logo Saw-Blade and Log.gif

    but it's doesn't show up.

    Am I not using the correct address or do I have to move this Gif file onto the web?

    Millgrove wood products

    Thanks,

  10. @monaleasaa
    This is just to make you aware of the notice Staff have posted at the support link http://en.support.wordpress.com/contact/

    Support will be closed this Sunday and Monday. It will re-open on Tuesday, February 28th. The forums are open over the break.

  11. np, thx very much... :)

  12. I thought to might want to know so you could adjust how you organize your time and life.

  13. originalwebdesigner
    Member

    Hello ....
    I am becoming an active member in a short time ... :-)
    the path to your image
    C:\Users\user\Millgrove Wood Products Files\Test Millgrove Logo Saw-Blade and Log.gif
    is the path ON YOUR HARD DRIVE
    Yes you have to upload it somewhere (most probably your media libraryin WP) and then copy/paste its address ..
    Something like :
    http://zeredac.files.wordpress.com/2012/02/troubadour.jpg
    Inbetween background: url( ....)

  14. That's what I thought, but I wasn't sure where to upload it too... Thanks very much for the advice .. cheers

  15. HI. I'm still having problems with the gif that I created.. i can't get it to show up.

    I tested the code, using the WP logo and it appeared and I adjusted the size for the positioning and that worked. However the logo I created won't show up.

    I have adjusted the size of my logo and placed the http address but still nothing.
    (http://millgrovewoodproductsltd.files.wordpress.com/2012/02/millgrove-logo-saw-blade-and-log-100.gif) (Twenty Eleven Template)

    would you mind taking a look to see what I'm missing? Thanks,

  16. Update,,, I copied the code listed above and placed it further down the template. Refreshed the site and the WP logo appeared,. Now the WP logo is a "png" file and the one that I created is a "gif" file. So I created a png file for my logo and reduced the size and it shows up, however it is not a clear, acceptable image.

    When I replace my png file with my gif file, the gif logo does not appear ... Why????

    What am I doing wrong? Thanks,,,,,

  17. I have adjusted the size of my logo and placed the http address but still nothing.
    (http://millgrovewoodproductsltd.files.wordpress.com/2012/02/millgrove-logo-saw-blade-and-log-100.gif) (Twenty Eleven Template)

    The link you listed here is no longer a working image link. It looks lik you uploaded an image but then you deleted it. Can you please try the following?

    1. Go to Media → Add New in your blog

    2. Either drag the millgrove-logo-saw-blade-and-log-100.gif image from your desktop or file manager into the area inside the dashed line to upload it or click the Select Files button and find the millgrove-logo-saw-blade-and-log-100.gif image on your hard drive and select and upload it.

    3. Copy the Image URL that shows up after the image is uploaded.

    4. Use the Image URL from step 3 in the CSS posted above: http://en.forums.wordpress.com/topic/adding-a-gif-to-the-right-of-the-main-title?replies=16#post-825671

    If the image doesn't look good resized, you can try adding a query string to the end of the link such as ?w=32

    It should look something like this except with a different file name and you can choose a different size other than 32 that works best for your image.

    http://millgrovewoodproductsltd.files.wordpress.com/2012/02/millgrove-logo-saw-blade-and-log-100.gif?w=32

    If you're not sure how to add a query string, post your Image URL in a reply here and we'll show you an example for how it works.

  18. HI, I tried the code above and I have re-placed the gif image but still nothing... and I'm getting really confused..

    Here's the code that I have:

    #site-title span a {
    padding-right: 40px;
    background: url http://millgrovewoodproductsltd.files.wordpress.com/2012/02/millgrove-logo-saw-blade-and-log-100.gif?w=32
    }

    If I use just the following code, then it doesn't load.:

    http://millgrovewoodproductsltd.files.wordpress.com/2012/02/millgrove-logo-saw-blade-and-log-100.gif?w=32

    I really need to understand what i'm doing wrong so I can get this site out of here ...thanks

    Twenty Eleven Template

  19. If there is someone who can help me get this right, i would appreciate it.

  20. There are two problems with the code you posted.

    First, you must put parentheses around the link in the background line, like this:

    background: url(YOUR_IMAGE_URL);

    Second, you need a working image link. It appears you may have uploaded an image, but then you deleted it from your media library: http://millgrovewoodproductsltd.files.wordpress.com/2012/02/millgrove-logo-saw-blade-and-log-100.gif?w=32

    Let's start with the image. I looked in your media library and I found this image:
    http://millgrovewoodproductsltd.files.wordpress.com/2012/03/millgrove-logo-saw-blade-and-log-100.png

    Try copying and pasting the following code exactly into your Appearance → Custom Design → CSS page. Make sure the parentheses are still there after you save changes.

    #site-title span a {
    padding-right: 70px;
    background: url(http://millgrovewoodproductsltd.files.wordpress.com/2012/03/millgrove-logo-saw-blade-and-log-100.png?w=60) no-repeat right;
    }
  21. Thanks, that has solved the problem... cheers...

Topic Closed

This topic has been closed to new replies.

About this Topic