Remove "Search" function at top of page?

  • Unknown's avatar
    barrygcooper · Member ·

    Hey all,

    Does anyone know how what CSS I would need to remove the search icon from the top of the page? It doesn’t appear when viewing the blog on my Mac, but only on iPad / iPhone. You can see the icon top right here:

    image

    Grateful thanks for your help.

    And while I’m here, can I just say how much I’ve appreciated all the help you’ve given – and it’s been a LOT! Thank you for your kindness and patience in helping get me up to speed.

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    elzrjose · Member ·

    Hi barrygcooper,

    You actually have a Search Widget at the bottom of your page on Mac view and it appears on the top as a magnifying glass when the page responses to an iPad/iPhone view.

    To remove this go to Appearance -> Widgets and this could be in your Sidebar or Footer. Once you found it’s location, click the arrow down beside it, click the Delete link and lastly click Save.

    Hope this helps. :)

  • Unknown's avatar
    barrygcooper · Member ·

    Hey elzrjose – thanks for replying!

    The problem is that if I do that, won’t it remove the search function entirely? I would like it to appear in the footer – just not at the top.

  • eurello · Staff ·

    Hi there,

    Try the following: 

    @media screen and (max-width: 800px) {
#header-search, #header-search-toggle {
	display: none;
}
}

    This removes the magnifying glass search toggle that appears on mobile devices. You can read more about Media Queries in CSS here:
    http://en.support.wordpress.com/custom-design/custom-css-media-queries/

  • Unknown's avatar
    barrygcooper · Member ·

    Works perfectly. Much appreciated, eurello, thank you.

  • The topic ‘Remove "Search" function at top of page?’ is closed to new replies.