Archived topic
How to display CPT as masonry columns in archives.
3 replies · Started by Whelan on March 21, 2021
I'm using the GP Premium plugin to control blog layout via the customiser. I want archive pages, blog etc. to display as a two-column masonry grid. I've created a few custom post types and I want them to follow the same archive layout as standard posts.
I'm using the code from this page in your documentation: https://docs.generatepress.com/article/using-columns-in-the-blog/#adding-columns-to-your-custom-post-type
It would be helpful if you added something to the tutorial to make it easier for non-developers to identify which bit is the CPT name, which is the slug etc.
It would also be helpful to specify if both functions are required, i.e. if I want masonry columns, do I need to add $columns and $masonry functions in that order? or just $masonry?
I've tried, but I can't get it to work.
In my case, I created the custom post types using Toolset. This writes the CPT code for me, and works pretty well, but the CPTs are not displaying properly in archives, despite trying several variations of the following snippet:
add_filter( 'generate_blog_columns','qa_faqs_columns' );
function qa_faqs_columns( $columns ) {
if ( is_post_type_archive( 'FAQ' ) ) {
return true;
}
return $columns;
}
add_filter( 'generate_blog_masonry','qa_faqs_masonry' );
function qa_faqs_masonry( $masonry ) {
if ( is_post_type_archive( 'FAQ' ) ) {
return true;
}
return $masonry;
}My CPT Name: FAQ
My CPT slug: qa_faqs
This is the archive for my FAQ cpt:
https://www.hovestationforum.co.uk/category/faq/
Any time a custom post type appears in the archive list, it messes up the layout, see example.
What am I doing wrong?
Hi there,
Hmm the code looks good to me.
However, looks like both pages you've linked are just category archives?
I'm not seeing any tags indicating that they are CPT.
Please also disable WP Rocket when we are trying to help.
Thanks!
Yes, my question is...
how to display CPT as masonry columns in archives? The first example is the standard archive for all custom post types named "FAQ" (slug name: "qa_faqs"):
https://www.hovestationforum.co.uk/category/faq/
Also when a custom post appears in the archive list alongside default posts, it messes up the layout, see example screenshot here.
In the screenshot, I've highlighted the CPT, added explanatory labels and included the web inspector to show the class names.
I have now disabled GP css cache, plus WP Optimise cache cleared and Jetpack site accelerator also disabled. I'm not using WP Rocket. How to display CPT as masonry columns in archives alongside other posts and also in a category archive consisting purely of that FAQ Custom Post Type?
Try using the CPT's slug and add the filter parameters.
Example:
add_filter( 'generate_blog_columns','qa_faqs_columns', 15, 1 );
function qa_faqs_columns( $columns ) {
if ( is_post_type_archive( 'qa_faqs' ) ) {
return true;
}
return $columns;
}
add_filter( 'generate_blog_masonry','qa_faqs_masonry', 15, 1 );
function qa_faqs_masonry( $masonry ) {
if ( is_post_type_archive( 'qa_faqs' ) ) {
return true;
}
return $masonry;
}