Search Results for 'filter style'

[Trevor]

It depends. Do you think you need more than one field to filter on (what do you envisage the form might look like)? If you need more than one field, you would need more than one taxonomy.

It is a question of thinking what use is going to be made of the data you have, and organizing it accordingly.

For me, when designing a website, data structure is the first thing to think of. Not menus, not style (which theme). In fact, theme is the very last thing I focus on. I like to use a theme (any theme) that has no menu system, no style, no layouts, no page builder, no grid builder.

There are plenty of good free (and ‘premium’, as supporting developers is a good thing) tools to add these to a basic theme. The best theme out there, for me, would be a theme that simply gives you a layout (not page) builder that allows you to place blocks to make the content frame, and drop widgets into those blocks.

Then use data structuring tools like CPT UI and ACF to build the structure, use Search & Filter Pro to provide the access to the data. There are other similar tools, and they may offer more, but I like the simplicity and portability of these. I don’t like to use feature heavy plugins to offer me what these do (as some tools tend to do, become bloated).

Then I think about menus. I use one that lets me drop the menu in as a widget or shortcode (Max Mega Menu). Where I think the developer needs supporting (as I use these tools a lot), I tend to buy developer licences of those free plugins, mainly to support the developer and encourage them to keep it supported.

[Trevor]

Ah, I think I can see. It is the structure of the template, and a few errors in the HTML. Try something like this:

<?php
get_header();

?>
<div class="page-body style-light-bg">
	<div class="post-wrapper">

        <div class="row row-parent col-std-gutter double-top-padding no-bottom-padding limit-width">

<div class="col-lg-8">
<div class="post-content style-light double-bottom-padding">
		

<?php if ( have_posts() ) : ?>
<tbody class='search-filter-results-list'>
<table>	
<tr>
<td>
     <p>File</p>
</td>
<td>
     <p>Name</p>
</td>
<td>
     <p>Language</p>
</td>
<td>
     <p>Publish Date</p>
</td>
<td>
     <p>Download</p>
</td>
    
<?php while ( have_posts() ) : the_post(); ?>
</tr>
<tr class='search-filter-result-item'>

<td>
     <img src="<?php the_field('file_icon'); ?>" />
</td>
<td class="ptitle">
    <a href="<?php the_permalink(); ?>"><?php echo get_the_title(); ?></a>
</td>
<td>
    <img src="<?php the_field('language'); ?>" />
</td>
<td>
    <?php the_field('publish_date'); ?>
</td>
<td>
    <a href="<?php the_field('download'); ?>" target="_blank">Download</a>
</td>

<?php endwhile; else : ?>
</tr>
</table>
</tbody>
<?php endif; ?>

</div>
</div>

		<div class="col-lg-4">
   			<div class="uncol style-light">
      			<div class="uncoltable">
         			 <?php get_sidebar(); ?>
      			</div>
   			</div>
		</div>
	</div>
	</div>
</div>

										
<?php get_footer(); ?>

Then, I have edited the form for you:

https://www.screencast.com/t/uFpF3rDL4MPg

[Anonymous]

Thanks for your reply. The link is http://wherethunext.504mediasolutions.com. The first search box is for Search and Filter plugin. The 2nd one is a module within my theme thats styled like I wish search and filter to look.

Thanks!

[Trevor]

This post might help you:

https://support.searchandfilter.com/forums/topic/large-search-bar-on-top/page/2/#post-192852

I also notice that your theme does not disable to list discs, so you will need this:

#search-filter-form-268 li {
  list-style-type: none;
}

[Anonymous]

Hi Trevor,

My first post maybe wasn’t that clear. I apologize. We’re using a custom WP query for this page to show all the activities (activiteiten). When clicking the ‘bekijk activiteit’ button on the activiteiten page it show an error in console from Google Chrome devtools (error in first post) and we can’t figure out what’s causing it.

The button is working (forwarding to the detail page) when we turn off the ajax setting in the S&F settings.

This is our custom post type:

<?php

$atts = shortcode_atts(
	[
		'number'    => -1,
		'orderby'   => 'menu_order',
		'category' => '',
	],
	$atts,
	'alle_activiteiten'
);

$numberposts = $atts['number'];
$order_by    = $atts['orderby'];
$category    = $atts['category'];

// args.
$args = array(
	'post_type'      => 'activiteit', // CPT slug.
	'posts_per_page' => $numberposts,
	'post_status'    => 'publish',
	'orderby'        => $order_by,
    'order'          => 'ASC',
	'search_filter_id' => 125,
	'show' => 'results',
	/*'tax_query'      => array(
		array(
			'taxonomy' => 'my_category_slug',
			'field'    => 'slug',
			'terms'    => $category,
			'operator' => 'AND',
		),
	),*/
);

$activiteiten = new WP_Query( $args );

if ( $activiteiten->have_posts() ) :
	while ( $activiteiten->have_posts() ) :
		$activiteiten->the_post(); ?>
	<div class="alleKamersBlok bmargin">
		<div class="alleKamersImage">
			<?php the_post_thumbnail('medium-large'); ?>
		</div>
		<div class="alleKamersText activiteitenText">
			<h2><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
			<h4 class="cat"><?php echo get_field("activiteiten_soort_activiteit"); ?></h4>
			<p><?php echo get_the_content(); ?></p>
            <div class="buttonContainer"><a itemprop="url" href="<?php the_permalink(); ?>" target="_self" class="qbutton  default" style="">Bekijk activiteit</a></div>
			
		</div>
	</div>
	

		<?php
	endwhile;
	wp_reset_postdata();

else :
	_e( 'Woops! Niks gevonden.', 'flux' );
endif;
?>

Hope this clears things up.

[Anonymous]

Hello Again,

I hope I’m not testing your limits with this one. I’m using Events Calendar Pro (ECP) and have SF Pro working perfectly on the ECP generated Events page by adding the SF Pro shortcode to the before HTML box in ECP’s settings. However, due to the limitations of that page, and my need to display a full width featured image at the top, I created a separate page using the ECP shortcode to display all events in list form instead.

By using the ECP shortcode on the new page, it also includes the SF Pro filter included in the ECP settings. Unfortunately it no longer filters the results. I trial’d and error’d many settings but I can’t get it to filter. I’m sure it has something to do with ECP taxonomies but I figured I would ask just in case there is a way to filter specific based on the page itself. The only way I managed to get it to work is by using the SF Pro Shortcode Display method on the new page but I would have to restyle everything from scratch and it doesn’t display everything. Was hoping to avoid that. 🙂

Thank you in advance for any response.

[Anonymous]

Hi Trevor, I asked before about using two different forms, and in the case I described of having one form with less on the home page and a full form elsewhere you suggested I use styles to remove fields in the form, which is fine so I’ll check that out, thank you.

Something else I’m stuck on with this in mind which I thought you might have come across before, is that I’d like to have one (wordpress) page showing results of my form in the woo shop format with tickets of a certain category only, and another page showing tickets of a different category. How would I go about achieving that with s and f pro?

Thank you

Following on from this topic here:
https://support.searchandfilter.com/forums/topic/error-two-forms-using-woocommerce-shop/

[Trevor]

Ah. THAT is set by the browser. And the code to ‘fix’ it varies according to browser and browser version.

It is better to use the Select2 V4 script and then style that. This post explains how:

https://support.searchandfilter.com/forums/topic/how-can-i-customize-the-form-with-css/#post-199584

[Anonymous]

Haaa … that was it!

I used this code to declutter the site:

// unregister some overload
add_action( 'wp_enqueue_scripts', 'wOw_unregister_something' );
function wOw_unregister_something() {
	// search & filter plugin
	wp_deregister_script( 'jquery-ui-datepicker' );
	wp_deregister_script( 'search-filter-plugin-build' );
	wp_deregister_script( 'hoverIntent' );
}
	
// more from search & filter plugin
add_action('wp_print_styles', 'remove_sf_styles', 100);
function remove_sf_styles(){
	wp_dequeue_style( 'search-filter-plugin-styles' );
}

For some reason I thought that the js is in general not needed if Ajax is not activated.
Good to know it always needs to be in there, so what I did not is to comment out this line:
wp_deregister_script( ‘search-filter-plugin-build’ );

Now it works again!
Awesome!

[Trevor]

The form has basic styling, for you to style with custom CSS yourself. Our documentation has the basic code to make it horizontal:

https://searchandfilter.com/documentation/getting-started/display-search-form/