.gif instead of Search Form

  • Resolved becomebecome

    (@becomebecome)


    12 years, 10 months ago

    Hello,

    Just got rid of the standard Search form top of the header image on the right side of the TwentyEleven template (opposite the title text).

    Using this code mentioned at another thread:

    #branding #searchform {
    display: none;
    }

    Now I woud like for a .gif to be displayed there instead…

    Any suggestions how do I go about coding for this in CSS?

    Tried googling but the only close thread offered code linked to the Title field of the blog…

    #site-title span a {
    padding-right: 70px;
    background: url(https://millgrovewoodproductsltd.files.wordpress.com/2012/03/millgrove-logo-saw-blade-and-log-100.png?w=60) no-repeat right;
    }

    …and that ends up messing up the blog title itself.
    Is there another way to do this without mixing fields up?

    Thanks for Feedback on this!

Viewing 3 replies - 1 through 3 (of 3 total)

  • You cannot add an image using CSS — you have to modify the header.php file to add an image.

    The above code you found is for using an image as a background — which is a totally different thing.

    Thread Starter becomebecome

    (@becomebecome)

    Thanks WPyogi, do you have a suggestion where do I go to learn how to code for an image to be displayed at a specific position in the header?

    Found this code:

    <div id=”gif”></div>

    #gif {
    height: 100px; /* use the actual height of the gif */
    width: 400px; /* use the actual width of the gif */
    background: url(images/mygif.gif) no-repeat; /* use your filename */
    position: absolute;
    top: 0px;
    left: 0px;
    }

    From here:
    https://www.ads-software.com/support/topic/possible-to-layer-animated-gif-over-jpg-header?replies=6

    …topic is closed to replies and when I try the code I get a warning message from WP:

    ARE YOU SURE YOU WANT TO DO THIS?

    If I go ahead and confirm I am redirected to the EditCSS page with no changes applied…

    I am thinking the <div id=”gif”></div> portion of the code is not to be inserted in the Edit CSS field.
    But it goes with changes to be applied in the CSS…
    Is it another format (language) I have to post somewhere else?

    I am using WordPress Custom CSS from:

    https://automattic.com/

    To avoid messing up my stylesheet.
    Is this the same as having a ‘child’ theme?

    As you suggested, maybe there is no other way than modifying the heder.php.
    Would this hold up to future updates of WP or change would get amended in the process?

    This is a new level of complexity for me.
    I am trying to learn, but I do not want to mess up…

    Thank You for your feedback!

    The code you found is NOT what you want to do. You need to add an image not a background image — they are very different animals!

    Yes, you should definitely be using a child theme if you are modifying any php files — and yes, that avoids the updating issues.

    I’m not good enough with php to tell you how to add an image — but someone else may well come along here and advise you on that.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘.gif instead of Search Form’ is closed to new replies.