Query string to pre-filter

Here you will need to implement the filter algorithm yourself. When going to the archive page, you need to build the correct algorithm of steps, after which the filter will load those posts that will be transferred in the URL request line.
One of the options, you can apply the following steps:

• transfer a certain parameter in the URL (term ID, for example)
• then stop loading the post grid using the API plugin hooks (https://github.com/YMC-22/smart-filter#hooks-js)
• then form a request using JavaScript and only then run the main YMCTools function (for example:
  YMCTools({
  target: ‘.data-target-ymc545-1’,
  terms: ‘7’
  }).apiTermUpdate();

To do this, you should study the basics of the API plugin to manage all the filter processes.

Thanks again for a quick reply! I think this one is beyond my skillset unfortunately.

How can I reference YMCTools? I am getting reference error: not defined, when trying to call apiTermUpdate().

Hi!
YMCTools is a global function that allows you to manage filtering of posts in the grid for the plugin. You should call it inside JavaScript.
Note: calling the YMCTools() object when the page is fully loaded should be placed in the block jQuery(document).on(“ready”, function () { }); In some cases, this object is used in handler function callbacks.
See documentation https://github.com/YMC-22/smart-filter#js-api-filter–grids

• This reply was modified 1 month, 3 weeks ago by YMC.

Thanks for the help! I made a few small changes and got it working.
I was using $( document ).ready(function() {}; and was passing my terms as a string.

Good Luck!

Hi @stephenk96 did you manage to pass a query string to filter the page on load? Would you be willing to provide me some code samples so I can try and learn to do this also?

Thanks!

Hi, @Brendan Shanahan

For example, use this function call notation in your javascript file. Set only your taxonomy term IDs.

And also don’t forget to change the filter class on the page (data-target-ymc545-1′)

jQuery(document).on(“ready”, function () {

YMCTools({ target: ‘.data-target-ymc545-1’, terms: ‘3,7,11,25,33’ }).apiTermUpdate();

}); 

• This reply was modified 1 month, 3 weeks ago by YMC.
• This reply was modified 1 month, 3 weeks ago by YMC.

Thank you again! I am not sure how, but with the help of ChatGPT and some trial and error I have managed to get my first JS script working ??

A simple ?terms=162,176,etc on my URL is working perfectly.

document.addEventListener('DOMContentLoaded', function() {

    // Function to get query parameters
    function getQueryParams() {
        const params = new URLSearchParams(window.location.search);
        return params.get('terms'); // Get the value of 'terms'
    }

    // Get terms from query string
    const terms = getQueryParams();

	// Update the term using YMCTools if terms exist
    if (terms) {

		// Stop the filter loading posts
		wp.hooks.addAction('ymc_stop_loading_data', 'smartfilter', function(elem) {
			if( elem.classList.contains('data-target-ymc1122-1') ) {
				elem.dataset.loading = 'false';
				console.log('Loading stopped for:', elem);
			}
		});

		jQuery(document).on("ready", function () {

			// Update the term using YMCTools
			try {
				//YMCTools({ target: '.data-target-ymc1122-1', terms: '162,176' }).apiTermUpdate();
				YMCTools({ target: '.data-target-ymc1122-1', terms: terms }).apiTermUpdate();
			} catch (error) {
				console.error('Error updating term:', error);
			}	
			
		});
		
	} else {
        console.warn('No terms provided in the query string.');
    }
	
});

Is there a way to show the selected items below the filter, the same way that they are shown when manually filtering?

• This reply was modified 1 month, 2 weeks ago by Brendan Shanahan.

You should manually customize this functionality, as the plugin works with default templates and their functionality.

Thank you, I built a custom filter and this works great!