Tagged: 

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 28, 2017 at 9:06 am #882537
    sherissar

    Hi Enfold Support team,

    I created a custom SEARCH menu item in my main navigation.

    What is the best way to add the ajax search to that menu item when clicked?

    Thank you in advance

    November 28, 2017 at 12:16 pm #882620
    Victoria

    Hey sherissar,

    Is this setting in theme options not working for you?
    Image 2017-11-28 at 12.16.35.png

    Best regards,
    Victoria

    November 28, 2017 at 12:22 pm #882630
    sherissar

    Hi Victoria, the theme options search does work, but in this case, the client wants the search button styled differently as per their design.
    Please have a look at the site, you will see what I mean.

    November 29, 2017 at 3:14 pm #883069
    sherissar

    Hi, is this at all possible? To activate the search from a custom menu item button?

    December 1, 2017 at 7:05 am #883722
    Ismael

    Hi,

    The default ajax search form is added as a tooltip.

    <a href="?s=" data-avia-search-tooltip="

<form action=&quot;http://localhost/kriesi/enfold/&quot; id=&quot;searchform&quot; method=&quot;get&quot; class=&quot;&quot;>
<div>
		<input type=&quot;submit&quot; value=&quot;&quot; id=&quot;searchsubmit&quot; class=&quot;button avia-font-entypo-fontello&quot; />
		<input type=&quot;text&quot; id=&quot;s&quot; name=&quot;s&quot; value=&quot;&quot; placeholder='My Search' /></div>
</form>" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"><span class="avia_hidden_link_text">Search</span></a>

    The form is inside the “data-avia-search-tooltip” attribute and it is rendered inside the search menu item container on click. You can find the script in the js > avia.js file, line 50.

    //creates search tooltip
        new $.AviaTooltip({"class": 'avia-search-tooltip',data: 'avia-search-tooltip', event:'click', position:'bottom', scope: "body", attach:'element', within_screen: true});

    Best regards,
    Ismael

    December 1, 2017 at 7:38 am #883732
    sherissar

    Thanks for the reply Ismael. How data-avia-search-tooltip with the custom menu item?

    December 1, 2017 at 9:42 am #883782
    Ismael

    Hi,

    That’s not possible in the Apperance > Menus panel but you can use the “wp_nav_menu_items” hook which is the same hook that the theme is using to create the search icon and append it in the main menu.

    // https://developer.wordpress.org/reference/hooks/wp_nav_menu_items/

    Best regards,
    Ismael

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