Search Results for 'Masonry'

[Anonymous]

It’s a custom theme I am building. The archive page for recipes does use isotope to get the masonry type feel to it.

I just need help understanding how to integrate the plugin on this page and get it to affect the results.

[Trevor]

It probably can be done. What theme is it? It seems to be using masonry?

[Anonymous]

Finally got this working!

console.log(“ajax complete”);

$(‘#ms-container’).imagesLoaded( function() {
var container = document.querySelector(‘#ms-container’);
var msnry = new Masonry( container, {
itemSelector: ‘.ms-item’,
columnWidth: ‘.ms-item’,
isAnimated: true,
});
});

});

Thank you for all your help!!

[Anonymous]

I got masonry working with Ajax..
After the log of ajax complete, I put the following code:

$(‘#ms-container’).imagesLoaded( function() {
var container = document.querySelector(‘#ms-container’);
var msnry = new Masonry( container, {
itemSelector: ‘.ms-item’,
columnWidth: ‘.ms-item’,
isAnimated: true,
});
});

#ms-container would be the container that you have your grid
.ms-item would be your item selector

I was having a problem with the results overlapping, and I figured out that everything was firing before the images were loaded.

This script makes sure that the images are loaded and then start the masonry.

[Trevor]

To answer that last question first, it would depend on the theme you use. I know that for the theme framework I use, the theme author re-wrote their code to specifically detect the presence of S&F Pro and to get it to work. I have not seen that from any of the other page builder authors.

As long as you have a ‘normal’ sample page that you want the results to look like, and that code doesn’t use special javascript (such as masonry), it isn’t so hard to modify the results.php file to make them look much the same. I can help you do that.

[Trevor]

If your theme is using something like masonry to arrange the posts, you need to manually trigger that again when the results load. Have a look through these search results:

https://support.searchandfilter.com/forums/search/masonry/

[Trevor]

If your theme is using something like masonry to arrange the posts, you need to manually trigger that again when the results load. Have a look through these search results:

https://support.searchandfilter.com/forums/search/masonry/

[Anonymous]

Yes, well, it’s using what avada call a grid layout, but it’s masonry by any other name.
How would I do that?

[Trevor]

Is the theme using a masonry grid? If so, it looks like the masonry script isn’t be re-run.

[Trevor]

OK

I can see the issue, but finding the solution will not be so easy. It is possible to use As an Archive or the Shortcode method. For you the best is as you have it (As an archive).

So, what goes wrong? The theme you have (I find so many pre-made themes with similar issues) has a template you use, in this case blog-masonry.php

In that, there is this code:

<?php get_header(); ?>
<?php get_template_part( 'title' ); ?>
<?php get_template_part('slider'); ?>
	<div class="qodef-container">
		<?php do_action('kloe_qodef_after_container_open'); ?>
		<div class="qodef-container-inner">
			<?php kloe_qodef_get_blog('masonry'); ?>
		</div>
		<?php do_action('kloe_qodef_before_container_close'); ?>
	</div>
<?php get_footer(); ?>

The key line is this:

<?php kloe_qodef_get_blog('masonry'); ?>

This calls a function, which I can only find if I have a copy of the theme, which is hijacking the wp_query.

It will be necessary to find the function (hopefully it does not then further call another function), copy the function with a new name into the child theme functions.php file, make a new template by copying the one in use, but change the function call to the newly made function, and eduit that function so that the arguments for the wp_query include the S&F form results id.