-
Posts
-
I am using the masonry content element to display my portfolio. I “display the sort options and currently active taxonomy”. The sorting works great and I prefer this element over the other options I tried.
I am introducing the 6 portfolio categories on the homepage and would love to link each directly to a filtered list using just the one main masonry element. So if someone clicks the button “branding” on the homepage I would like to link to portfolio page and have the “Branding” sort option already selected – the the other options are available if they want to dig around further. Is that possible?
If needed I can work around it by creating 6 landing pages with a masonry element and just that category selected and a link back to the main portfolio page.
Hey frankkremer,
Thank you for the inquiry.
This is possible with a small script. The masonry sort buttons have a class pattern like .branding_sort_button, and we can trigger a click on the right one based on a url query parameter.
Add this to your child theme’s functions.php:
function ava_activate_sort_button() { if( empty( $_GET['psort'] ) ) return; $sort = sanitize_key( $_GET['psort'] ); ?> <script> (function($){ $(document).ready(function() { $('.' + '<?php echo $sort; ?>' + '_sort_button').trigger('click'); }); })(jQuery); </script> <?php } add_action( 'wp_footer', 'ava_activate_sort_button' );Then on your homepage, link to your portfolio page with the category slug as the query parameter, for example:
— https://yoursite.com/portfolio/?psort=branding
When the page loads, the js will trigger a click on the matching sort button, filtering the masonry to that category automatically. The other sort options remain available so visitors can still browse freely.
Let us know if you have more questions.
Best regards,
Ismael
- You must be logged in to reply to this topic.