Using Columns & Masonry in the Blog

Note: These options require the Blog add-on in GP Premium.

Starting in GP Premium 1.5, the columns and masonry options are combined in the same panel.

  • Display posts in columns – Enable columns for posts to see the rest of the options.
  • Columns – Set the number of columns.
  • Make first post featured – Enable the latest post to be featured.
  • Display posts in masonry grid – Enable masonry grid with columns.

Using full width for featured post

The CSS snippet below enable full width for the featured post:

.generate-columns-container .featured-column {
    float: none;
    width: 100%;
}

Learn how to add CSS here.

Adding columns to your custom post type

By default, columns only apply to the post post type. However, you can add columns to your custom post type using the filter:

add_filter( 'generate_blog_columns', function( $columns ) {
    if ( 'CPT_SLUG' === get_post_type() && ! is_singular() ) {
        return true;
    }

    return $columns;
} );

You can use this filter to enable or disable columns under any conditions you need by using the WordPress conditional tags.

Learn how to add PHP here.

Changing the number of columns

In some cases, you might want a different number of columns on certain custom post types, categories etc.. We can use a filter for this as well.

For example, if we want to change our column count on the search page:

add_filter( 'generate_blog_get_column_count','tu_search_column_count' );
function tu_search_column_count( $count ) {
    if ( is_search() ) {
        return 33;
    }

    return $count;
}

33 means 33%, which is 3 columns.

50 would be 50%, 2 columns.

20 would be 20%, 5 columns.

And so on..

You can use this filter under any conditions you need by using the WordPress conditional tags.

Adding masonry to your custom post type

By default, masonry only applies to the post post type. However, you can add masonry to your custom post type using the filter:

add_filter( 'generate_blog_masonry','tu_portfolio_masonry' );
function tu_portfolio_masonry( $masonry ) {
    if ( is_post_type_archive( 'portfolio' ) ) {
        return 'true';
    }

    return $masonry;
}

You can use this filter to enable or disable masonry under any conditions you need by using the WordPress conditional tags.

Learn how to add PHP here.