Home Forums Weaver Xtreme Theme Search Bar placement and icon

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #17505
    DianeClancy
    Participant

    Hi .. I am helping a friend and she has a double header.  So I used a text widget to get the header above the other header (thank you, Weaver!!!)  (she doesn’t want the site to be active yet so I can’t show you it)

    So there is a header above, then the menu above the regular header.  The search bar shows up on the same line as the menu.

    She wants the search bar to be at the top right of the top header (that is in the text widget).  She also wants the word “Search” rather than the spy glass.

    I have looked but don’t see how to do this.  Is it possible?  And if so, please I would love to know how to do it 🙂

    Thank you so much!!  ~ Diane Clancy

    #20770
    Weaver
    Keymaster

    Try the [search] X-Plus shortcode in a text widget and hide the default header search spy glass version.

    #20771
    scrambler
    Moderator

    Ultimatley, if you need that kind of help, we have to be able to look at the site so we can see exactly what is there and test solutions.

    If she does not want the site accessed, you need to create a test site online where you can recreate the same environment for us to look at. You can do that in a subfolder of an existing site.

    #20772
    DianeClancy
    Participant

    Thank you, Weaver – so that is with the X-Plus, only, right?

    Scrambler, maybe I will do this tomorrow – thank you so much!! 

    ~ Diane Clancy

    #20773
    scrambler
    Moderator

    The shortcode to be able to insert the search anywhere is indeed a plus option.

    We can try to see if we could move the default header search where you want with custom CSS, but for that we need a link to a page showing the exact configuration.

    #20774
    DianeClancy
    Participant

    Thank you, Scrambler – I will see what I can do tomorrow to be able to show you – so I could do that in my sandbox 🙂

    #20775
    DianeClancy
    Participant

    I made the site in here again  http://dianeclancy.com/sandbox/

    So here is the exact page, Scrambler – thank you so very much!!  ~ Diane Clancy

    #20776
    scrambler
    Moderator

    You can try using the rules below in the theme Custom CSS rule box.

    DO test to make sure it does not have side effects

    #branding {position:inherit;}
    #header-search {position:absolute;top:0px;right:0px;}

    Adjusting the top and right values

    #20777
    DianeClancy
    Participant

    Thank you again, Scrambler!!  I will test this in the morning!!  You are the best  🙂  🙂 🙂  ~ Diane Clancy

    #20778
    DianeClancy
    Participant

    hmmmm, Scrambler – it didn’t move the search spy glass  🙂

    http://dianeclancy.com/sandbox/

    Any other thoughts or did I do something wrong?

    I put it in the CSS here

    Search Boxes   Search box related options

    Thank you so very much again!!  ~ Diane Clancy

    #20779
    scrambler
    Moderator

    You inserted the rules at the wrong place I suppose as your CSS shows

    .search-field,#header-search .search-field:focus #branding {position:inherit;}
    #header-search {position:absolute;top:0px;right:0px;}

    instead of

    #branding {position:inherit;}
    #header-search {position:absolute;top:0px;right:0px;}

    The rules I gave you were to insert in Main Options > Fonts & custom > Custom CSS rule box

    #20780
    DianeClancy
    Participant

    Oh my goodness – it works 🙂  🙂

    You are the best!!  Thank you so very much, Scrambler for your patience and help!!

    ~ Diane Clancy

Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.