generatepress search how to change visual display

Hi there,

So instead of the current navigation search, you want a search bar with a button to always be visible?

Let me know ??

Hi Tom ??

… thank you for your quick reply. Yes, exactly a search bar with a button to always be visible. hm… how easy it could be explained ??

Now there is only the icon always visible.
The text should be right on the leftside of the current icon of the horizontal navigation and always visible.
Within the following div tag
<div class=”inside-navigation grid-container grid-parent”>

Any help is highly appreciated

brainyc

Hmm, you could try this.

1. First, disable the current navigation search.

2. Next, add this function:

add_action('generate_inside_navigation','generate_add_custom_search');
function generate_add_custom_search()
{
      echo '<div class="custom-search">';
            get_search_form();
      echo '</div>';
}

3. Then add this CSS:

.custom-search {
      float: right;
}

It will probably need some CSS tweaking to integrate with the look of your site, but that should be a decent start.

Let me know ??

Dear Tom,

THANK YOU soooooo much for your super fast and great and kind reply. I will try on Monday and let you know whether it worked.

Thank you for your answer highly appreciated.

brainyc

Dear Tom,

Thank you kindly! that’s what I did look for.

How can I include this the best way into the responsive part?
mean if it is a mobile then it should be as the last list item.

originally there is:
<li class=”search-item” title=”Search”><i class=”fa fa-search”></i>

so shall I write instead of your suppose <div class=”custom-search”>
a li tag like <li class=”custom-search”>
or <li class=”search-item”
so that it works?

any help highly appreciated.

Dear Tom,

another question then… quite like your icon used. Would rather like the icon instead of the search button.

But that’s the secondary question. First one is the above one to get the search work also in the responsive menu. As it is not included there the way your supposed.

Thank you in advance for your kind help

brainyc

Dear Tom,

… now found a solution under
https://www.ads-software.com/support/topic/search-bar-in-the-main-menu-or-in-a-container-div-containing-both-in-floats

search for add_filter that’s a working solution.

But how to float: right only when it screen (not mobile not tablet)

thank you
brainyc

hi dear Tom,

today’s my lucky day ?? found out also imagine.
solution:
float: none in mobile.css
and float: right in style.css

Thank you so much for your help

brainyc

Dear Tom,

…now only need your image (<i class=”fa fa-search”></i>) instead of
<input type=”submit” class=”submit” name=”submit” id=”searchsubmit” value=”Search”>

maybe you can help if some time left.

Thank you

brainyc

Hi there,

Can you link me to your site with the search in the nav so I can make sure the CSS I give you with the search icon is correct?

Thanks! ??

Hi dear Tom,

unfortunately cannot link you to the site. But it is the CSS of yours. Do you think you can help me anyway ?-)

Thank you

brainyc

Hmm, try this function instead then:

add_action('generate_inside_navigation','generate_add_custom_search');
function generate_add_custom_search()
{
?>
	<div class="custom-search">
		<form role="search" method="get" id="searchform" class="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
			<input type="text" value="<?php echo get_search_query(); ?>" name="s" id="s" />
			<input type="submit" id="searchsubmit" value="<i class="fa fa-search"></i>" />
		</form>
	</div>
<?php
}

Hi Tom,
please how can I translate the words “Search” (button) and “Search …” (page 404 and anywhere else)? Tried to find them in the search.php file, but did not.
Thanks.

You can either use filters: https://generatepress.com/knowledgebase/filter-list/

Or you can translate the theme using a tool like Poedit: https://poedit.net/

Then add your custom language to your child theme: https://codex.www.ads-software.com/Function_Reference/load_child_theme_textdomain#Example

Thanks for the options.

I must have missed the searchform.php, because that was all I needed to edit. Got it translated.
Thanks.