- This topic has 14 replies, 2 voices, and was last updated 6 years, 1 month ago by Tom.
-
AuthorPosts
-
January 6, 2018 at 12:09 pm #464678Tara
Hi Tom
I’m trying to update to the latest version, but it removes the masonry from my custom page templates. I’m using a static front page and parent pages with custom ‘new WP_Query’ loops (in a child theme), with the ‘generate_blog_masonry’ filter.
My live site is still on GeneratePress 1.4 and GP Premium 1.4.3, while on my local development copy I’m testing GeneratePress 2.0.1 and GP Premium 1.5.6.
I hope you can help, as I haven’t found a way to fix it myself.
Thanks
Tara
January 6, 2018 at 8:25 pm #464847TomLead DeveloperLead DeveloperHi Tara,
Can you show me the function you’re filtering in?
Let me know ๐
January 7, 2018 at 8:18 am #465149TaraHi Tom
Here’s my function:
add_filter('generate_blog_masonry','generate_blog_page_template_masonry'); function generate_blog_page_template_masonry($masonry) { if ( is_front_page() || is_page_template('child-pages.php') ) { return 'true'; } return $masonry; }
January 7, 2018 at 9:40 am #465196TomLead DeveloperLead DeveloperAh, since you’re adding it to a static page, you need to manually tell columns to kick in as well:
add_filter( 'generate_blog_masonry', 'tu_blog_page_template_masonry' ); function tu_blog_page_template_masonry($masonry) { if ( is_front_page() || is_page_template('child-pages.php') ) { return 'true'; } return $masonry; } add_filter( 'generate_blog_columns', 'tu_blog_page_columns' ); function tu_blog_page_columns( $columns ) { if ( is_front_page() || is_page_template('child-pages.php') ) { return true; } return $columns; }
Let me know if that fixes it ๐
January 7, 2018 at 10:11 am #465229TaraThanks – that’s getting closer as I’ve now got some masonry classes, but it’s not actually displaying as columns or masonry, so something’s still missing.
The posts are still underneath each other, but instead of each post container being full-width, they’re all different widths depending on how long their excerpt is.
Here’s a temporary copy of my front page source code: https://pastebin.com/uNYdcWsH
January 7, 2018 at 8:46 pm #465491TomLead DeveloperLead DeveloperI see the issue. The blog columns and masonry are built to work on index pages (blog, archives etc..), not single pages.
Since WordPress is seeing your page as a “page”, GP isn’t adding the column classes.
I’ll see if I can get this fixed in the next version of GPP.
For now, you can try this:
add_filter( 'post_class', 'tu_add_singular_post_classes' ); function tu_add_singular_post_classes( $classes ) { if ( ! function_exists( 'generate_blog_get_columns' ) ) { return $classes; } if ( generate_blog_get_columns() && ( is_front_page() || is_page_template('child-pages.php') ) ) { global $wp_query; $paged = get_query_var( 'paged' ); $paged = $paged ? $paged : 1; $classes[] = 'generate-columns'; $classes[] = 'tablet-grid-50'; $classes[] = 'mobile-grid-100'; $classes[] = 'grid-parent'; // Set our featured column class if ( $wp_query->current_post == 0 && $paged == 1 && $settings['featured_column'] ) { if ( 50 == generate_blog_get_column_count() ) { $classes[] = 'grid-100'; } if ( 33 == generate_blog_get_column_count() ) { $classes[] = 'grid-66'; } if ( 25 == generate_blog_get_column_count() ) { $classes[] = 'grid-50'; } if ( 20 == generate_blog_get_column_count() ) { $classes[] = 'grid-60'; } $classes[] = 'featured-column'; } else { $classes[] = 'grid-' . generate_blog_get_column_count(); } } return $classes; }
January 8, 2018 at 12:51 pm #466136TaraThat’s it, thank you! I fixed some missing brackets in line 7 though:
if ( generate_blog_get_columns() && ( is_front_page() || is_page_template('child-pages.php') ) ) {
I’d tried something similar yesterday, once I figured out that those classes were missing, but less successfully.
Now I just need to do some final testing and then I should be ready to update my live site.
Thanks again for your help.
Tara
January 8, 2018 at 8:10 pm #466308TomLead DeveloperLead DeveloperNo problem! Did a missing bracket cause a PHP error? All looks good in my original code?
January 10, 2018 at 9:36 am #467740TaraHi Tom
generate_blog_get_columns without brackets just gave me the header and footer, but no content in between (on my custom templates and on the standard blog page). I compared it with your generate_blog_post_classes function in generate-blog.php and saw the brackets there, so I copied that and then it worked.
Thanks
Tara
January 10, 2018 at 1:02 pm #467894TaraOne more question… I have two columns between 600px and 767px, that should act roughly the same as between 768px and 1024px. I know you’ve changed the grid classes but I can’t work out how to update my CSS to make the masonry work properly now. My old version was:
@media (min-width: 600px) and (max-width: 767px) { .masonry-post, .masonry .grid-sizer, .masonry .masonry-post, .masonry .masonry-post.width4, .masonry .grid-sizer.width4, .masonry .masonry-post.width6, .masonry .grid-sizer.width6, .masonry .masonry-post.medium, .masonry .grid-sizer.medium { width: 48% !important; padding-left: 1%; padding-right: 1%; } }
I’ve looked at your theme CSS and tried various combinations of things like:
@media (min-width: 600px) and (max-width: 767px) { .masonry .mobile-grid-100 { clear: none !important; float: left !important; width: 50% !important; } }
Hope you can help.
Tara
January 10, 2018 at 8:14 pm #468084TomLead DeveloperLead DeveloperAh I see what you mean! Adjusted in the code above.
Just took a look at your site – it looks like you got the above working? I’m seeing two columns between 600 and 767.
January 13, 2018 at 11:14 am #470175TaraHi Tom
It was sort of working with the old CSS for two columns between 600 and 767, as it still matched .masonry-post, but there was a gap on the right-hand side of the page.
I’ve been trying to update it to use the Unsemantic grid CSS similar to .tablet-grid-50, but the masonry blocks are all down the left half of the page and I couldn’t work out what I’d missed.
Now I’ve realised that the same thing actually happens between 768 and 1024, even when I switch to the parent theme, so I don’t think it’s caused by my own CSS or functions. And it’s the same on http://sbsginteriordesign.barkingdogweb.com/testimonials/ (which was linked from another recent masonry thread).
When you first load the page in a window between 768 and 1024 the posts are only in the left column, but if you slightly resize the window then the masonry reshuffles into the proper two-column layout.
Hope you can help!
Tara
January 13, 2018 at 8:34 pm #470372TomLead DeveloperLead DeveloperHmm, I couldn’t get that to happen. What browser are you using?
January 14, 2018 at 8:52 am #470694TaraThat’s strange. I mainly use Chrome but I’m also seeing it in Firefox, Edge and Internet Explorer, on Windows 10.
I’ve tried a few free browser testing and screenshot tools, and most of them show the proper two columns, though netrenderer.com does show one column with empty space in the right half. So I’m still puzzled…
February 28, 2018 at 12:04 pm #508245TomLead DeveloperLead DeveloperI believe I have this fixed in GPP 1.6.
You can check out the beta if you’d like: https://generatepress.com/gp-premium-1-6/
-
AuthorPosts
- You must be logged in to reply to this topic.