Results width

  • Resolved Benedikt Ledl

    (@benniledl)


    4 months, 2 weeks ago

    Hello,

    when setting the search block’s button position to “button inside,” the search results currently only match the width of the search keyword input field. However, they should ideally span the entire width of the wrapper, including both the input field and the button.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Karan

    (@kjswp)

    Hi @benniledl ,

    I would like to clarify that SearchWP Live settings does not include an option to position the button directly inside the search input field. Could you let me know how this button position has been set? This will help me look into the configuration more closely.

    Also, by default, the live results container width aligns with the search input width. If you’d like the results container to span the entire width of the form wrapper, you can add custom CSS to your theme’s stylesheet to set a specific width for the results container. For example:

    .searchwp-live-search-results-showing{
    	width:500px!important; /* Adjusts to fill the wrapper */
    }
    Thread Starter Benedikt Ledl

    (@benniledl)

    Hey @kjswp

    Sorry, I mean the normal Gutenberg search block. This block button has the option to show the button inside the search form.

    Copy and paste this json to insert the block into your testing site:

    <!-- wp:search {"label":"","placeholder":"Suche","buttonText":"Suchen","buttonPosition":"button-inside","buttonUseIcon":true,"style":{"border":{"radius":"47px"}},"backgroundColor":"contrast-2"} /-->

    The Plugin SearchWP has the Setting “AutoWidth” this automatically aligns the results panel width with the search form width, but it should ideally include the button’s width too.

    Plugin Support Karan

    (@kjswp)

    Thank you for the additional information.

    I would like to clarify that the Auto-width setting simply sets the width of the live results container to match the search input field. It does not include the button.

    I tested the WP search block with the “button inside” option. However, in the final HTML, the button actually appears next to the input field, not inside it; it only adds an extra container around both elements.

    Currently, there isn’t a built-in way to extend the width of live results to match the entire search form wrapper.
    If you need any other information, then please let me know.

    Plugin Support Karan

    (@kjswp)

    Hi Benedikt,

    We haven’t heard back from you in a while, so I’m going to go ahead and close this thread for now. But if you’d like us to assist further, please feel welcome to continue the conversation.

    Thanks!

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