Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Support request] Question regarding custom search bar in the Navigation

Home Forums Support Question regarding custom search bar in the Navigation

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #381902
    Dominic

    Hello everybody.I just joined today and I really love the Theme.Its so well written/coded.
    before I tried Avada. It doesnt even come close to GP.

    here is my question:
    I want to have a separate search in my navigation. I have found Ajax Search Lite and it worksbest for my sites purpose.
    I want to have a streched out search bar from my Logo on the Left to the Home Link.
    I implemented the search bar via shortcode.
    search bar

    I can adjust the length via CSS

    div[id*=’ajaxsearchlite’].wpdreams_asl_container {
    width: 500px;

    ,but the problem is,the search bar is not flexible on smaller screens and screws the whole navigation.
    full-width,max-width etc doesnt work.
    the best example how I would like it to look like is amazons search bar.
    streched out,adjusts to smaller screens and stays in one row.

    Its probably a simple solution but I just started to learn CSS 2 weeks ago.

    Thanks in advance.

    GP Premium 1.4.3
    #381941
    Leo
    Staff
    Customer Support

    Hi there,

    Can you link me to the site? Thanks!

    #381998
    Dominic

    yes.
    Here

    #382019
    Leo
    Staff
    Customer Support

    Hmm I think the best way is to wrap your CSS like this:

    @media (min-width:1550px) {
        CSS here
    }

    Otherwise you can try contacting the plugin developer.

    #382186
    Dominic

    hi,I experimented a little bit but the problem still the same.

    I implemented the search bar below the navigation,didnt change anything and the the searchbar behaves as I would like to. it automatically streches to the full width ,depending on the container size.
    I think the problem has something to do with the navigation dimensions/spacing so that the search bar is automatically boxed to a certain size.

    I think the CSS would have to be something like max-width or width:100% or auto.
    I dont even know if implementing the search bar via shortcode is the best way.I just used it because it worked.

    This link here

    #382317
    Leo
    Staff
    Customer Support

    Hmm not sure what you mean?

    The search bars below the navigation are inserted using Elementor.

    Might be best to contact Ajax Search Lite plugin author and see if they can help you change the width.

    #382420
    Dominic

    ok,I’ll try to show it with screenshots.
    I just started to learn about CSS and english is not my first language. its hard to articulate myself.

    I basically want it to look like this (except top padding). 1 row,the search bar is always covering the rest/left side of the navigation.
    it should look like this on a full screen

    and like this when the screen is smaller.

    this happens when I change CSS to a certain pixel size. the search bar doesnt adjust to the smaller screen and the of the navigation creates a second row.

    please keep in mind: maybe your first suggestion was right but I did something wrong.I can only change small things.I cant code myself and I dont know many basics.

    #382453
    Leo
    Staff
    Customer Support

    My way above let you specify a certain width for screen size above 1550px, and then the default style applies for screen width below that.

    The coding structure is a bit complicated for that plugin. Have you tried asking their support on how to use CSS to change the width?

    #382647
    Dominic

    I will ask them in their forum later today or tomorrow. but I still think it has something to do with the Column or Grid (?) Size in the Navigation which limits the search bar in width.
    I probably try to create a mega menu because its to complicated for me.

    thank you anyway

    #382787
    Leo
    Staff
    Customer Support

    Let me know what they say!

    #383503
    Dominic

    I just wanted to say your advice was correct.I applied it wrong.I still know to little about CSS.

    its not flexible as I want it to be,but it does the job for now.
    I will still ask ajax search support and let you know if they help me.

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