[Support request] Search bar and page customization

Home Forums Support [Support request] Search bar and page customization

Home Forums Support Search bar and page customization

Viewing 15 posts - 1 through 15 (of 23 total)
  • Author
    Posts
  • #1617499
    Dev

    Hello,

    Please see the below video link.

    https://share.getcloudapp.com/nOuDxddW?collection_id=3nfnMp

    I want to make my search page like how we can do that?

    More, please see the below image link. Is this shadow, or how can I add that in my header.

    https://prnt.sc/wmoo9i

    And as we are adding lots of CSS code, will it impact the site speed? What’s the solution?

    Please let me know.

    #1617634
    Ying
    Staff
    Customer Support

    Hi Dev,

    You’ll need a Ajax Search plugin to achieve live searching effect.

    For the box shadow, try this CSS, adjust the number depends on your needs:

    .inside-header {
        box-shadow: 5px 7px 6px -2px rgba(0, 0, 0, 0.1);
    }

    The more CSS you added, relatively the slower your site is. That’s basically inevitable.
    I would recommend use site speed testing software/website in order to know what needs to be optimized in your site.

    Let me know 🙂

    #1617887
    Dev

    Hello,

    The below CSS is not working for mobile view. And for the sticky header as well.

    .inside-header {
    box-shadow: 5px 7px 6px -2px rgba(0, 0, 0, 0.1);
    }

    #1617907
    Ying
    Staff
    Customer Support

    Can you link us to the site in question?

    You can use the private information field.

    Let me know 🙂

    #1617910
    Dev

    Hello,

    Please check the details

    #1617931
    Ying
    Staff
    Customer Support

    Try this CSS instead:

    #mobile-header, #sticky-navigation, .site-header {
        box-shadow: 5px 7px 6px -2px rgba(0, 0, 0, 0.1);
        position: relative;
    }
    #1617966
    Dev

    Thanks, it worked for me.

    #1619130
    Ying
    Staff
    Customer Support

    Great!

    You are welcome 🙂

    #1619347
    Dev

    Hello,

    I have installed the ajax search, and I have the shortcode – [wpdreams_ajaxsearchlite]

    How and where I have to put this shortcode to replace the secondary menu search bar with the ajax search bar.

    #1619457
    Elvin
    Staff
    Customer Support

    Hi,

    Try this PHP snippet:

    add_filter( 'generate_navigation_search_output', function() {
        return sprintf(
            '<div class="navigation-search">%s</div>',
            do_shortcode( '[wpdreams_ajaxsearchlite]' )
        );
    } );

    A wise man once said:
    "Have you cleared your cache?"

    #1619463
    Dev

    Hello,

    I added u PHP code, but that is activating the double search bar over clicking. It may not get displayed on the desktop, but it clearly shows double search bars on mobile view.

    One is your wp default search bar, and the other is of the shortcode.

    #1619467
    Elvin
    Staff
    Customer Support

    Try adding this to remove the second search form.

    add_action( 'after_setup_theme', function() {
        remove_action( 'generate_inside_mobile_header', 'generate_navigation_search' , 1 );
    });

    A wise man once said:
    "Have you cleared your cache?"

    #1630020
    Dev

    Hello,

    None of the above PHP code is working. See, I want when someone clicks on the search (that is in the secondary menu) then the HERO section I have designed in the elements section, gets open.

    For a clear idea, please see the below video.

    https://share.getcloudapp.com/5zuAgjjr

    Please let me know.

    #1630507
    Dev

    Any update on this issue?

    #1630567
    David
    Staff
    Customer Support

    Hi there,

    thats not a function of the Theme. It would require Custom Development which is outside of the scope of this forum.

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