I’d like to use a FontAwesome icon or a personalized SVG icon as a label for the search button. I use the widget for elementor and while I can change the text, it seems that I can’t add html (not surprised actually). Would there be a way to do this?

By the way, thank you for your work! It really helped improving my website.

Lucie.

I’m just getting to grips with your excellent theme but wonder if you can help me change the ‘search’ button text in the searchform.php to be the fontawesome magnifying glass (fa fa-search)
I can change it to the unicode magnifying glass by pasting this ‘🔍’ in place of ‘search’ but it’s an awful icon.
I tried the unicode for the fa icon ‘’ but that doesn’t work as I guess it has no reference to the font awesome font.

Any help gratefully received.

Thanks very much in advance : )

I’m trying to get the URL filtering like below. The URL outputs fine from the search form, but not the filtering itself.

I can get it to work for one at a time, but not both at the same time. For instance, the code below works to filter the price. If I replace all of the “price” fields to “year” it will also work. However, if I duplicate the codes (one for price, the other for year) only year seems to work.

https://domain.com/?s=test&price_low=0&price_high=59&year_low=1900&year_high=2020

//Price Filtering

function wpa_filter_home_query( $query ){
    if( $query->is_search()
    && $query->is_main_query()
    && isset( $_GET['price_low'] )
    && isset( $_GET['price_high'] ) ) {
        $meta_query = array(
            array(
                'key' => 'price',
                'value' => array( $_GET['price_low'], $_GET['price_high'] ),
                'type' => 'numeric',
                'compare' => 'BETWEEN'
            )
        );
        $query->set( 'meta_query', $meta_query );
    }
}
add_action( 'pre_get_posts', 'wpa_filter_home_query' );

Right now the styling for the 1st search form is done with the ‘DIV ID #s’, which can be only givin once, but need a 2nd search with different background and size.

Can I accomplish this without changing everything?

1. Searchform.php is adjusted without ‘submit button’.
2. CSS is adjusted so the background image, border and size is the same as the other images.

Problems:

1. If I try to put the searchform.php link into the image, it breaks.
The button itself is correct, without the searchform attached.
2. If I try to use value=”<?php the_search_query(); ?>” in the webpage the button doesn’t break the page layout, but “<?php the_search_query(); ?>” becomes the search text and if you click the button it will do the query???

It is giving me headaches for the last past week and takes too much time. Don’t know what I’m doing wrong but maybe someone can push me in the right direction?

Here is the code:

<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
	<button type="submit" class="search-submit"><i class="icon-search"></i></button>
	<label>
		<span class="screen-reader-text"><?php _ex( 'Search for:', 'label', 'marketify' ); ?></span>
		<input type="search" class="search-field" placeholder="search for referral codes!" value="<?php echo esc_attr( get_search_query() ); ?>" name="s" title="<?php echo esc_attr__( 'Search for:', 'marketify' ); ?>">
	</label>

	<input type="hidden" name="post_type" value="<?php echo esc_attr( $type ); ?>" />
</form>

The blog I need help with is www.honestcanadian.com.

<form method="get" id="searchform" action="<?php echo home_url(); ?>/">
	<input type="text" value="<?php _e('Search','revoke'); ?>" onclick="value=''" name="s" id="s" />
	<input type="subtmit" id="searchsubmit" value="<?php _e('Search','revoke'); ?>" />
</form>

I know that I should be inserting the image in the third line, but replacing it with an SVG with an ID linked to the CSS (maybe still retaining #searchsubmit) while still allowing it’s search form functionality is beyond my slightly better than basic understanding of PHP. Anyone know a good solution?