Search Results for 'filter style'

[Anonymous]

Hi guys,

First of all, great plugin :). Really looking forward to explore all the features!

However, i have a question about the shortcode-implementation. I currently have multiple CPT’s and I’m using the shortcode functionality because the standard archive gives back the same title for every page, and the CPT archive option aint working out for me…

I currently set up a whole bunch of archive pages, but on one page i have two search fields. Both the fields should update the same list of results. Is there any option how i can achieve this?

<div id="employees-overview">

    <?php if ( function_exists('yoast_breadcrumb') ) {yoast_breadcrumb('<div id="breadcrumbs"><div class="container">','</div></div>');} ?>
    
	<div class="container">
	    <div class="intro">
	        <h2><?php echo $title; ?><?php //echo get_the_title( $id+1 ); ?></h2>
	        <?php //echo get_the_content( $id ); ?>
	        <?php echo $text; ?>
	    </div>
	</div>  
    <div class="container">
    	<div id="list-overview">
    
		    <?php if ( wp_is_mobile() ) { ?>
			    <div class="showFilter">Toon filter</div>
			<?php }?>
		
	        <div class="filter <?php if ( wp_is_mobile() ) { ?>mobile<?php }?>">
	            <div class="content">
	            <h3>Filter op functie</h3>
	            <?php echo do_shortcode('[searchandfilter id="1188"]'); ?>
	            </div>
	        </div>
		
	       <svg width='188px' style="display:none;" class="loader" height='188px' xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="uil-ripple"><rect x="0" y="0" width="100" height="100" fill="none" class="bk"></rect><g> <animate attributeName="opacity" dur="2s" repeatCount="indefinite" begin="0s" keyTimes="0;0.33;1" values="1;1;0"></animate><circle cx="50" cy="50" r="40" stroke="#066cb5" fill="none" stroke-width="2" stroke-linecap="round"><animate attributeName="r" dur="2s" repeatCount="indefinite" begin="0s" keyTimes="0;0.33;1" values="0;22;44"></animate></circle></g><g><animate attributeName="opacity" dur="2s" repeatCount="indefinite" begin="1s" keyTimes="0;0.33;1" values="1;1;0"></animate><circle cx="50" cy="50" r="40" stroke="#066cb5" fill="none" stroke-width="4" stroke-linecap="round"><animate attributeName="r" dur="2s" repeatCount="indefinite" begin="1s" keyTimes="0;0.33;1" values="0;22;44"></animate></circle></g></svg>
		       
	       <div class="search-module">
	           <?php echo do_shortcode('[searchandfilter id="1190"]'); ?>
	       </div>
	       <?php echo do_shortcode('[searchandfilter id="1188" show="results"]'); ?>
	       <?php echo do_shortcode('[searchandfilter id="1190" show="results"]'); ?>
	         
	    </div>
	</div>
</div>

Would love te get some feedback. Thanks!

[Anonymous]

When I run the PHP Compatibility Checker plugin for PHP7, Search & Filter Pro 2.1.2. Gives the following error. Does this plugin work with PHP7? This version of PHP offers a huge performance boost from previous version so support is critical.

Thank you,
Brian

FILE: /var/www/acropedia.org/wp-content/plugins/search-filter-pro/includes/class-search-filter-register-widget.php
——————————————————————————————————————
FOUND 1 ERROR AFFECTING 1 LINE
——————————————————————————————————————
75 | ERROR | Deprecated PHP4 style constructor are not supported since PHP7
——————————————————————————————————————

[Trevor]

.searchandfilter label {
  width: 250px;
}
.searchandfilter select.sf-input-select {
  width: 100%;
}
.searchandfilter select option {
  padding: 3px 5px;
}

As to the button, you appear to have made this style:

#search-filter-form-23 input[type="submit"] {
    margin: 0;
    border-width: 10px;
    border-style: solid;
    cursor: pointer;
    border-radius: 4px;
    padding: 3px 11px;
    box-sizing: border-box;
}

To which you would need to add a background, such as:

background: #d33528;

[Anonymous]

Hi Trevor, I got it to work.
Using this code:

function refresh() {
		$('.things').load(document.URL +  ' .things');
	}
	//detects the start of an ajax request being made
		$(document).on("sf:ajaxstart", ".searchandfilter", function(){
		  console.log("ajax start");

		});

		//detects when the ajax request has finished and the content has been updated
		// - add scripts that apply to your results here

		$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
			console.log("ajax complete");
			//so load your lightbox or JS scripts here again
			refresh();
		});

		//an event fired when S&F is initialised and S&F scripts have been loaded
		$(document).on("sf:init", ".searchandfilter", function(){
			console.log("S&F JS initialised");
		});

The only thing is, it posts the whole category and name: Aantal personen: 20 of meer personen. You’ve already tackelled this problem here: https://support.searchandfilter.com/forums/topic/how-to-style-the-search-data/

global $searchandfilter;
$sf_current_query = $searchandfilter->get(339)->current_query()->get_array();
foreach($sf_current_query as $key) {
  echo '<div>' . $key['active_terms'][0]['name'] . '</div>';
}

Which would display “20 of meer personen” but What I would like is to have it show “Aantal personen:<br />20 of meer personen.

What to do?

[Trevor]

In this thread, the OP wanted to do that:

https://support.searchandfilter.com/forums/topic/how-to-style-the-search-data/

[Anonymous]

Hi,
I need to use iCheck with your great plugin: can you give me any suggestion?
When styleng the selects/checkboxes with iCheck the filter does not work.

http://icheck.fronteed.com/

Thank you in advance

AD

[Anonymous]

I am copying the following to my child theme stylesheet as I want search fields to appear horizontally, however there is no change.

.searchandfilter[data-sf-form-id=”2374″]
{
display: inline !important;
font-size: 100px !important;
}

I’ve also tried

.searchandfilter p
{
display: inline !important;
font-size: 100px !important;
}

Can you please advise?

Thank you.

[Trevor]

Hi

I made a few changes to it all. There seems to be an error in the style.css file that hides the options on the checkboxes??

This is the faulty css:

.searchandfilter li[class^="sf"] ul {
    display: none;
}

I think it should be:

.searchandfilter li[class^="sf"] ul {
    display: block !important;
}

I added a count on so you can see what is going on. I would agree that the OR does not seem to work between form fields. I need to speak with Ross, the developer.

[Anonymous]

Hi again! OK, I understand why !important is bad and have removed it from my CSS… and slapped myself on the wrist for good measure. But I’ve now stumbled onto an entirely different issue that seems to be the real dealbreaker: my .js file is being rejected by the browser with a JQuery error, and I can’t figure out why.

Here’s the full .js as I’m importing it:

jQuery(document).ready(function($) {

$('.searchandfilter').on('sf:ajaxfinish',function(e, x){
   $('#search-filter-results-8513').show();
   console.log(e);
   console.log(x);
});

});

I understand the jQuery(document).ready(function($) {as necessary for the $ references to work – and I am loading two other .js files that are structure the same way, and do NOT throw an error. Yet this one, the third one I’m loading, not only throws the error in the inspector, but that entire enclosing statement is completely removed. Which (seemingly) leads to the error, when the first line now starts with just the “$”.

Here is the entire first section of my functions.php:

<?php 

function e2s_load_scripts() {

    wp_register_script( 
		'hide-checkboxes', 
		get_stylesheet_directory_uri() . '/js/hidecheckbox.js', 
		array ( 'jquery' ),
		'9.9.9'
    ); 
    
    wp_enqueue_script( 'hide-checkboxes' );

    wp_register_script( 
		'rolldown-full-content', 
		get_stylesheet_directory_uri() . '/js/rolldowns.js', 
		array ( 'jquery' ),
		'9.9.9'
    ); 
    
    wp_enqueue_script( 'rolldown-full-content' );

    wp_register_script( 
		'hide-search-results', 
		get_stylesheet_directory_uri() . '/js/hideSearchResults.js', 
		array ( 'jquery' ),
		'9.9.8'
    ); 
    
    wp_enqueue_script( 'hide-search-results' );

    
}

function e2s_load_admin_script() {
 
	wp_enqueue_script(
	   'express-lifts-total',  
		get_stylesheet_directory_uri() . '/js/autosumAdam.js' 
	);	

}

add_action ( 'wp_enqueue_scripts', 'e2s_load_scripts' );

Oh, and just to keep things REALLY interesting (though this may have to break off as a separate thread):

The Search button doesn’t show up in Firefox!

In a word…. arrrghhh!

Thanks for any further clues or advice…

[Trevor]

You would need some good PHP skills to do this, as we would not have the time to do this for you, and you would need to be able to edit whichever results template file you are using.

Some of the discussion in this thread will give you clues:

https://support.searchandfilter.com/forums/topic/how-to-style-the-search-data/