Combining Isotope Masonry & fitRows in WP Theme WordPress
- SOLVED
Hi, we use a theme that uses the isotope masonry effect on our posts, however we're building an 'event calendar' and when we do this the posts go in the wrong order, so we want to use the "FitRows" type for the event posts, but not the main posts.
This is the current set-up with Masonry: http://www.pacha.com/pacha-events/?month=02
But we want "FitRows" for just this page, without effecting the rest of the site, this is the code I believe is controlling it, we can change the container ID on the div no problem,
How can I do this? :)
$tt_single_sidebar=(jQuery('body').hasClass('single-post') || jQuery('body').hasClass('page-template-default') || jQuery('body').hasClass('error404') || jQuery('body').hasClass('search-no-results'))?true:false;
/* jQuery Isotope */
if($tt_single_sidebar){
$container = jQuery('.masonry-widgets');
$container_item = '.widget';
}else{
$container = jQuery('.mansonry-container');
$container_item = '.item-article';
}
$container.isotope({
itemSelector: $container_item,
masonry: {
columnWidth: 1
}
});
Answers (1)
Hariprasad Vijayan answers:
Hello,
I think you can do it like this
$tt_single_sidebar=(jQuery('body').hasClass('single-post') || jQuery('body').hasClass('page-template-default') || jQuery('body').hasClass('error404') || jQuery('body').hasClass('search-no-results'))?true:false;
/* jQuery Isotope */
if($tt_single_sidebar){
$container = jQuery('.masonry-widgets');
$container_item = '.widget';
}else{
$container = jQuery('.mansonry-container');
$container_item = '.item-article';
}
if(jQuery('body').hasClass('page-template-page-template-events-php'))
{
$container.isotope({
itemSelector: $container_item,
masonry: {
columnWidth: 1,
layoutMode : 'fitRows'
}
});
}
else
{
$container.isotope({
itemSelector: $container_item,
masonry: {
columnWidth: 1
}
});
}
Hariprasad Vijayan comments:
Is it works for you?
Meakin comments:
Hi Hariprasad,
It didn't work, but I just edited the code slightly (took out the masonry on the events bit) and it works perfectly, so thanks!
$tt_single_sidebar=(jQuery('body').hasClass('single-post') || jQuery('body').hasClass('page-template-default') || jQuery('body').hasClass('error404') || jQuery('body').hasClass('search-no-results'))?true:false;
/* jQuery Isotope */
if($tt_single_sidebar){
$container = jQuery('.masonry-widgets');
$container_item = '.widget';
}else{
$container = jQuery('.mansonry-container');
$container_item = '.item-article';
}
if(jQuery('body').hasClass('page-template-page-template-events-php'))
{
$container.isotope({
itemSelector: $container_item,
layoutMode : 'fitRows'
});
}
else
{
$container.isotope({
itemSelector: $container_item,
masonry: {
columnWidth: 1
}
});
}