Activate grid mode. Adjust the condition in this code to suit your purpose:
0 1 2 3 4 5 6 7 8 9 10 |
function jma_theme_mode( $mode, $q ) { if ( $q->is_page(91) || $q->is_archive()) { $mode = 'grid'; } return $mode; } add_filter( 'themeblvd_theme_mode_override', 'jma_theme_mode', 10, 2 ); |
direct theme part to your custom template in this case the template is named content-main_blog.php:
0 1 2 3 4 5 6 7 8 9 10 11 |
function jma_template_parts( $parts ) {//content-location.php if(is_page(91) || is_archive()){ $parts['blog'] = 'main_blog'; $parts['blog_paginated'] = 'main_blog'; $parts['grid'] = 'main_blog'; $parts['grid_paginated'] = 'main_blog'; } return $parts; } add_filter( 'themeblvd_template_parts', 'jma_template_parts' ); |
Use this code for content-main_blog.php:
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<?php /** * The template used for displaying posts in a grid. */ global $post; ?> <div class="grid-item <?php echo themeblvd_get_att('class'); ?>"> <article <?php post_class(); ?>> <?php if ( has_post_thumbnail() ) : ?> <div class="featured-item"> <?php echo '<a href="' . get_permalink( get_the_ID()) . '"><!--featured-->'; ?> <?php echo get_the_post_thumbnail( $post->ID , 'jma-blog-grid' ); ?> <?php echo '</a>'; ?> </div><!-- .featured-item (end) --> <?php else: ?> <div class="featured-item"> <?php echo '<a href="' . get_permalink( get_the_ID()) . '">'; ?> <img src="<?php echo get_stylesheet_directory_uri() ?>/images/default-blog.jpg" /> <?php echo '</a>'; ?> </div><!-- .featured-item (end) --> <?php endif; ?> <h2 class="entry-title"> <?php echo '<a href="' . get_permalink( get_the_ID()) . '">'; ?> <?php themeblvd_the_title(); ?> <?php echo '</a>'; ?> </h2> </article><!-- #post-<?php the_ID(); ?> --> </div><!-- .grid-item (end) --> |
Style the output:
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
/* grid tablets */ .post_grid .entry-title { max-width: 90%; margin: 0 auto !important; padding-bottom: 10px } .post_grid .featured-item { margin-bottom: 5px; } .post_grid article { -webkit-box-shadow: 1px 1px 5px 0px rgba(66, 89, 57, 0.75); -moz-box-shadow: 1px 1px 5px 0px rgba(66, 89, 57, 0.75); box-shadow: 1px 1px 5px 0px rgba(66, 89, 57, 0.75); } |