Support » Plugin: Advanced Woo Search » Replacing default search in SiteOrigin Vantage Theme

  • Resolved elessar_x

    (@elessar_x)


    Hello,

    can anyone help me with replacing the default search in SiteOrigin Vantage Theme?
    Thanks!

    The page I need help with: [log in to see the link]

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author ILLID

    (@mihail-barinov)

    Hello,

    Tru to add this code to your theme functions.php file:

    add_filter('get_search_form', 'aws_search_form');
    
    function aws_search_form( $form ) {
        return do_shortcode( '[aws_search_form]' );
    }

    But be careful. Probably you will be need to update some css rules.

    Thanks for the response.

    I’ve tried those filters earlier but it doesn’t work fully.

    I can see a AWS search bar displayed under the menu, the old default search has disappeared, although the search icon still slides after clicking like it would want to show the search form 😛

    So those filters provided don’t fully replace the search form functionality.

    Can you propose something else? Thanks!

    Plugin Author ILLID

    (@mihail-barinov)

    Search icon must slides and display new search icon in the bottom of header?
    Or you just want to replace search icon with search form so you see foem right in the header?
    Thanks.

    Hello ILLID

    As you can see in the theme demo (link in the first post), there is a search icon in the navbar that, after clicking, displays a search bar under the navbar.

    When I use the code you provided in the functions file i can see a search bar under the icon displayed on page load, on the start, without any clicking. So that is a problem.

    I just want the search replaced, without much visual changes.

    Plugin Author ILLID

    (@mihail-barinov)

    I found solution for you.

    Please add this styles to your theme style.css file

    #search-icon .aws-container {
        position: absolute;
        top: 100%;
        right: 0;
        width: 1080px;
        z-index: 10;
        overflow-x: hidden;
    }
    
    #search-icon .aws-search-form {
        display: none;
    }

    Yes it worked, thank you! 😉

    Hi,

    This solution worked great for me, but there is one problem.

    The fixed width of 1080px for the search bar means that the search bar flows off of the screen on mobile devices.

    How can I have this width change with the size of the screen so it will look proper on mobile devices? Setting the width to Auto or 100% does not work.

    Thank you in advance!

    Best,
    Tyler.

    • This reply was modified 1 year, 5 months ago by thademorrow.
    Plugin Author ILLID

    (@mihail-barinov)

    Hello,

    The problem here is that search form are inside #search-icon block that is very small.
    It is the structure of the theme.

    But you can fix this – just add this js code to your theme

    $( window ).resize( function() {
            $( '#search-icon .aws-container' ).each( function() {
                $( this ).width( $( this ).closest( '.full-container' ).width() );
            } );
        } ).resize();

    Hello again.

    Thank you for your response. Unfortunately I cant seem to get this code to work. I put it in the header.php file (wrapped in a script tag) and removed the fixed width CSS. Beyond this, I am not sure where to put this code.

    Thank you in advance for your help!

    Best,
    Tyler

    Plugin Author ILLID

    (@mihail-barinov)

    I don’t need to remove css that I write above. Please return theme.

    This code

    $( window ).resize( function() {
            $( '#search-icon .aws-container' ).each( function() {
                $( this ).width( $( this ).closest( '.full-container' ).width() );
            } );
        } ).resize();

    you need to add to your theme js/jquery.theme-main.js file ( and maybe js/jquery.theme-main.min.js )

    Put just after lines

    $( window ).resize( function() {
            $( '#search-icon .searchform' ).each( function() {
                $( this ).width( $( this ).closest( '.full-container' ).width() );
            } );
        } ).resize();
Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Replacing default search in SiteOrigin Vantage Theme’ is closed to new replies.