Search Results for 'filter style'

[Anonymous]

Hi Trevor,
Love the plugin. I have created a page (using the new Thrive Architect) that simply has 2 columns and the relevant short code for the search form in the left column and the results in the right column. I have also created a custom results.php file

Everything works fine re results and filtering however the check boxes have a “styled” class on them when the page first loads and as soon as you select any of the filters in the form and the results reload. The check boxes in the form then loose the “styled” tag.

On Page Load:

<li class="sf-level-0 sf-item-36" data-sf-count="4" data-sf-depth="0">
	<input value="masterclass" name="_sft_category[]" id="sf-input-c9d6c3225e54e2a88ba6865be80c549f" class="sf-input-checkbox styled" type="checkbox">
	<label class="sf-label-checkbox" for="sf-input-c9d6c3225e54e2a88ba6865be80c549f">Masterclass<span class="sf-count">(4)</span></label>
</li>

After page results are filtered:

<li class="sf-level-0 sf-item-36" data-sf-count="4" data-sf-depth="0">
	<input value="masterclass" name="_sft_category[]" id="sf-input-c9d6c3225e54e2a88ba6865be80c549f" class="sf-input-checkbox" type="checkbox">
	<label class="sf-label-checkbox" for="sf-input-c9d6c3225e54e2a88ba6865be80c549f">Masterclass<span class="sf-count">(4)</span></label>
</li>

Please advise on a fix for this.

FYI. As yet I have not added our License key to the plugin on the settings page as it is on our staging server.

Kind Regards
Rick

[Anonymous]

Hello,

We’ve used this plugin on a few sites and it has worked great! So thanks for the awesome plugin.

On both of those sites we’ve done the pagination with the WP-PageNavi plugin which is suggested in the default results.php template you provide. My question is, how can I use Search And Filter with native WP pagination?

Right now I have a site that uses the Search And Filter and uses AJAX refresh. When I click the numbers in the pagination, the results refresh properly, but the pagination styles don’t change to reflect that. The current page number doesn’t change, and the previous page link does not show up. Additionally, clicking the next page link works the first time, but the second time it’s clicked it goes back to the original results (page 1).

Here’s the code I’m using for the pagination inside the results.php file (theme/search-filer/results.php):

<?php // Pagination
	$total = $query->max_num_pages;
	// only bother with pagination if we have more than 1 page
	if ( $total > 1 ) : ?>
		<nav class="pagination text-center">
			<?php
			// Set up pagination to use later on
			$big = 999999999; // need an unlikely integer
			$pagination = paginate_links( array(
				'base'      => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
				'format'    => '?paged=%#%',
				'current'   => max( 1, get_query_var('sf_paged') ),
				'total'     => $total,
				'type'      => 'plain',
				'prev_next' => true,
				'prev_text' => __('', 'visceral'),
				'next_text' => __('', 'visceral')
			) );

			echo $pagination; ?>
		</nav>
	<?php endif; ?>

Any directions for getting this to work without WP-PageNavi?

Thanks!
Travis

[Anonymous]

Hello,

I want the checkboxes code structure to look like this:

<label class="custom-control custom-checkbox">
  <input type="checkbox" class="custom-control-input">
  <span class="custom-control-indicator"></span>
  <span class="custom-control-description">Check this custom checkbox</span>
</label>

See: https://getbootstrap.com/docs/4.0/components/forms/#checkboxes-and-radios-1

Is there any way to achieve this? I didn’t find a matching filter.

[Anonymous]

Hello,

I have set a class for the individual post container, as specified in the documentation here.

https://www.designsandcode.com/documentation/search-filter-pro/search-results/infinite-scroll/

However, I don’t see the any CSS classes showing up on the page. I’d like to style the search results to be in columns.For reference, this is the page I’m working on.
https://smartclickiq.wpengine.com/client-area/

Also, is there a way to remove the “Found X Results” and “Page 1 of 1” text in the search results?

Thanks!

[Anonymous]

Hi!

<?php
	if ( $query->have_posts() )
	{
?>

		<div style="width: 100%;">Найдено <?php echo $query->found_posts; ?> Результатов<br />
			<div class="pagination">
				<div class="nav-previous"><?php next_posts_link( 'Еще результаты', $query->max_num_pages ); ?></div>
				<div class="nav-next"><?php previous_posts_link( 'Прошлые результаты' ); ?></div>
			</div>
		</div>
	
		<?php
		$column_count = 0;
			while ($query->have_posts())
			{
				$query->the_post();
			?>

				<div class="one_third" style="margin-right: 0px;">									
					<?php if ( has_post_thumbnail()) { ?>
					<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
					<?php the_post_thumbnail(); ?></a><?php } ?>
				<h4><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h4>
				</div>

		<?php
			$column_count ++; 			
		 ?>
		}
	}	

	<?php 
		else {echo "Ничего не найдено";} 
	?>

Parse error: syntax error, unexpected ‘else’ (T_ELSE) in /home/sobaka-pav/dk-moskvor.ru/docs/wp-content/themes/Divi/search-filter/results.php on line 33

[Anonymous]

You aswell =)

You might not believe this but i found something!!

After our call i checked the debug log again and found this entry each time a search with ajax is was attemted:

sfvc_style in /customers/f/4/6/apologia.se/httpd.www/test/wp-content/plugins/search-filter-pro-vc/search-filter-pro-vc.php on line 374,

that lines says:

$data[“style”]= $atts[‘sfvc_style’];

So just for kicks I commented that out and suddenly AJAX search works again :O

Now I’m curious about what stopped to work and what that line actually does =)

[Anonymous]

Hey again.

We have / found an issue with Search&Filter (shortcode embedded) solution combined with Jupiter5 theme.
This issue hits only on Mobile-Android devices (iOS have no problem with that) and flyout menu.

First of all: the native search from Jupiter5 theme works fine: https://demos.artbees.net/jupiter5

If you open the menu and click in the Search-Field you can see that the flyout and keyboard is visible for a few seconds and then it disappears. We already remove our custom styles and javascripts but this issue still disappear.

Is this related to a filter setting?

[Trevor]

With Avada, the only way I know to get it to reliably work is to use our Shortcode Display Results method. This gives you a basic layout, but you are free to customise this. The guide to customising is here.

At that point you can then edit this to change the HTML structure, add parts, remove parts, use CSS classes from your theme to style, and so on.

[Anonymous]

hi trevor

i tried …

.searchandfilter > ul > li {
display: inline-block;
margin-right: 5px;
float: left;
}
.searchandfilter > ul > li:last-child {
margin-right: 0;
}
.search-filter-results {clear: both;}

… without any result. i copied it into the style-css of my child theme. do i have to declare .searchandfilter?

thank you for your help
best regards
michael

[Trevor]

This is the customised results.php to work in your child theme of the Primrose theme, making it look like the grid you made with SiteOrigin:

<?php
/**
 * Search & Filter Pro 
 *
 * Sample Results Template
 * 
 * @package   Search_Filter
 * @author    Ross Morsali
 * @link      http://www.designsandcode.com/
 * @copyright 2015 Designs & Code
 * 
 * Note: these templates are not full page templates, rather 
 * just an encaspulation of the your results loop which should
 * be inserted in to other pages by using a shortcode - think 
 * of it as a template part
 * 
 * This template is an absolute base example showing you what
 * you can do, for more customisation see the WordPress docs 
 * and using template tags - 
 * 
 * http://codex.wordpress.org/Template_Tags
 *
 */

if ( $query->have_posts() )
{
	?>

	Found <?php echo $query->found_posts; ?> Results<br />
	Page <?php echo $query->query['paged']; ?> of <?php echo $query->max_num_pages; ?><br />
	
	<div class="pagination">
		
		<div class="nav-previous"><?php next_posts_link( 'Older posts', $query->max_num_pages ); ?></div>
		<div class="nav-next"><?php previous_posts_link( 'Newer posts' ); ?></div>
		<?php
			/* example code for using the wp_pagenavi plugin */
			if (function_exists('wp_pagenavi'))
			{
				echo "<br />";
				wp_pagenavi( array( 'query' => $query ) );
			}
		?>
	</div>

	<div id="sf-custom-results" class="panel-layout">
	<?php
	$result_counter=0;
	$data_index=0;
	while ($query->have_posts())
	{
		$query->the_post();
		
		?>
		<div class="sf-results-row panel-grid panel-no-style">

			<div class="sf-results-leftcol panel-grid-cell">
    <div class="so-panel widget widget_sow-image panel-first-child panel-last-child" data-index="<?php echo $data_index++;?>">
					<div class="so-widget-sow-image so-widget-sow-image-default-eef982a7180b">
      <div class="sow-image-container">
						<?php 
							if ( has_post_thumbnail() ) {
								the_post_thumbnail("full");
							}
						?>
						</div>
					</div>
    </div>
			</div>

			<div class="sf-results-rightcol panel-grid-cell">
				<div class="so-panel widget widget_sow-editor panel-first-child panel-last-child" data-index="<?php echo $data_index++;?>">
					<div class="so-widget-sow-editor so-widget-sow-editor-base">
						<h3 class="widget-title"><?php the_title(); ?></h3>
						<div class="siteorigin-widget-tinymce textwidget">
							<header class="w2dc-listing-header"><p>blah</p></header>
							<p><br /><?php the_excerpt(); ?></p>
						</div>
					</div>
				</div>
			</div>

		</div>
		
		<?php
			//$result_counter++;
	}
	?>
  </div>
  <div>Page <?php echo $query->query['paged']; ?> of <?php echo $query->max_num_pages; ?></div>
	
	<div class="pagination">
		
		<div class="nav-previous"><?php next_posts_link( 'Older posts', $query->max_num_pages ); ?></div>
		<div class="nav-next"><?php previous_posts_link( 'Newer posts' ); ?></div>
		<?php
			/* example code for using the wp_pagenavi plugin */
			if (function_exists('wp_pagenavi'))
			{
				echo "<br />";
				wp_pagenavi( array( 'query' => $query ) );
			}
		?>
	</div>
	<?php
}
else
{
	echo "No Results Found";
}
?>

This is the Custom CSS that accompanies it:

.sf-results-leftcol.panel-grid-cell {
    width: 25% !important;
    width: calc(25% - ( 0.750000001875 * 40px)) !important;
}
.sf-results-rightcol.panel-grid-cell {
    width: 75% !important;
    width: calc(75% - ( 0.249999998125 * 40px)) !important;
}
#sf-custom-results .so-panel {
    margin-bottom: 0;
}
#sf-custom-results div.sf-results-row:nth-last-child(2) {
    margin-bottom: 0;
}
#sf-custom-results .sf-results-row {
    -webkit-align-items: flex-start;
    align-items: flex-start;
    margin-bottom: 40px;
}
@media (max-width: 767px) {
    .sf-results-leftcol.panel-grid-cell,
    .sf-results-rightcol.panel-grid-cell {
        width: 100% !important;
    }
    .sf-results-row {
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .sf-results-row .sow-image-container {
        text-align: center;
    }
}