-
-
Save srikat/272de125074e30ec8ac5 to your computer and use it in GitHub Desktop.
Checkered Posts Layout in Genesis. https://sridharkatakam.com/checkered-posts-layout-in-genesis/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Register a custom image size for Home Checkered images | |
add_image_size( 'home-checkered', 1024, 614, true ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
add_action( 'pre_get_posts', 'sk_change_blog_posts_per_page' ); | |
/** | |
* Change Posts Per Page for Posts page | |
* | |
* @author Sridhar Katakam | |
* @author Bill Erickson <- Boss | |
* @link http://www.billerickson.net/customize-the-wordpress-query/ | |
* @param object $query data | |
* | |
*/ | |
function sk_change_blog_posts_per_page( $query ) { | |
if( $query->is_main_query() && !is_admin() && is_home() ) { | |
$query->set( 'posts_per_page', '6' ); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Template Redirect | |
* Use home.php for category archives. | |
*/ | |
add_filter( 'template_include', 'sk_category_template', 99 ); | |
function sk_category_template( $template ) { | |
if ( is_category() ) { | |
$new_template = locate_template( array( 'home.php' ) ); | |
if ( '' != $new_template ) { | |
return $new_template ; | |
} | |
} | |
return $template; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
add_filter( 'body_class', 'sk_body_class' ); | |
/** | |
* Adds a css class to the body element | |
* | |
* @param array $classes the current body classes | |
* @return array $classes modified classes | |
*/ | |
function sk_body_class( $classes ) { | |
$classes[] = 'checkerboard'; | |
return $classes; | |
} | |
// Add odd and even classes to Posts | |
function sk_add_odd_even_class( $classes ) { | |
if ( is_main_query() ) { // conditional to ensure that column classes do not apply to Featured widgets | |
global $wp_query; | |
if( 0 == $wp_query->current_post || 0 == $wp_query->current_post % 2 ) { | |
$classes[] = 'odd'; | |
} else { | |
$classes[] = 'even'; | |
} | |
} | |
return $classes; | |
} | |
add_filter( 'post_class', 'sk_add_odd_even_class' ); | |
// Force full width content | |
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' ); | |
// Remove post info | |
remove_action( 'genesis_entry_header', 'genesis_post_info', 12 ); | |
// Remove the post image | |
remove_action( 'genesis_entry_content', 'genesis_do_post_image', 8 ); | |
// Remove post-specific navigation | |
remove_action( 'genesis_entry_content', 'genesis_do_post_content_nav', 12 ); | |
// Function to display Featured image if present. If not, show a default image | |
function sk_display_featured_image() { | |
$image = genesis_get_image( array( | |
'format' => 'url', | |
'size' => 'home-checkered', | |
)); | |
// if there is no Featured Image, set a default image to appear. | |
if ( ! $image ) { | |
$image = get_stylesheet_directory_uri() . '/images/default.jpg'; | |
} | |
printf( '<div class="home-featured-image"><a href="%s" rel="bookmark"><img src="%s" alt="%s" /></a></div>', get_permalink(), $image, the_title_attribute( 'echo=0' ) ); | |
} | |
// Remove entry meta from entry footer incl. markup | |
remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_open', 5 ); | |
remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_close', 15 ); | |
remove_action( 'genesis_entry_footer', 'genesis_post_meta' ); | |
// Function to add opening markup for Post info and Entry meta | |
function sk_entry_meta_opening() { | |
echo '<div class="post-meta">'; | |
} | |
// Function to add closing markup for Post info and Entry meta | |
function sk_entry_meta_closing() { | |
echo '</div>'; | |
} | |
// Modify the Excerpt read more link | |
add_filter( 'excerpt_more', 'new_excerpt_more' ); | |
function new_excerpt_more( $more ) { | |
return '... <a class="more-link" href="' . get_permalink() . '">Continue Reading</a>'; | |
} | |
// Modify the length of post excerpts | |
add_filter( 'excerpt_length', 'sp_excerpt_length' ); | |
function sp_excerpt_length( $length ) { | |
return 35; // pull first 35 words | |
} | |
// Add Featured image (if present) or a default image in entry header | |
add_action( 'genesis_entry_header', 'sk_display_featured_image' ); | |
// Remove Post title from entry header | |
remove_action( 'genesis_entry_header', 'genesis_do_post_title' ); | |
// Add Post title above content in entry content | |
add_action( 'genesis_entry_content', 'genesis_do_post_title', 7 ); | |
// Add Post info and Entry meta wrapped in a custom div in entry header | |
add_action( 'genesis_entry_header', 'sk_entry_meta_opening' ); | |
add_action( 'genesis_entry_header', 'genesis_post_info' ); | |
add_action( 'genesis_entry_header', 'genesis_post_meta' ); | |
add_action( 'genesis_entry_header', 'sk_entry_meta_closing' ); | |
genesis(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Checkered Posts | |
--------------------------------------------- */ | |
.checkerboard .site-inner { | |
max-width: none; | |
padding-top: 0; | |
} | |
.checkerboard .content .entry { | |
margin-bottom: 0; | |
padding: 0; | |
} | |
.checkerboard .content .entry { | |
display: table; | |
width: 100%; | |
height: 100%; | |
} | |
.checkerboard .entry-header, | |
.checkerboard .entry-content { | |
display: table-cell; | |
width: 50%; | |
} | |
.checkerboard .odd .entry-header { | |
float: left; | |
} | |
.checkerboard .odd .entry-content { | |
float: right; | |
padding: 80px; | |
} | |
.checkerboard .even .entry-header { | |
float: right; | |
} | |
.checkerboard .even .entry-content { | |
float: left; | |
padding: 80px; | |
} | |
.home-featured-image img { | |
vertical-align: top; | |
width: 100%; | |
} | |
/*.home-featured-image:before { | |
content: ''; | |
display: block; | |
position: absolute; | |
top: 0; | |
right: 0; | |
bottom: 0; | |
left: 0; | |
pointer-events: none; | |
background: rgba(0,0,0,0.5); | |
} | |
.home-featured-image:hover:before { | |
background: transparent; | |
}*/ | |
.checkerboard .content .entry-header { | |
position: relative; | |
} | |
.checkerboard .entry-header .post-meta { | |
position: absolute; | |
bottom: 10px; | |
left: 10px; | |
color: #fff; | |
background: rgba(251,69,55,0.6); | |
padding: 10px | |
} | |
.checkerboard .entry-header .post-meta a { | |
color: #fff; | |
text-decoration: underline; | |
} | |
.checkerboard .content .entry-header .entry-meta { | |
margin-bottom: 0; | |
} | |
.checkerboard .archive-pagination { | |
text-align: center; | |
} | |
@media only screen and (max-width: 1280px) { | |
.checkerboard .odd .entry-content, | |
.checkerboard .even .entry-content { | |
padding: 60px; | |
} | |
} | |
@media only screen and (max-width: 1024px) { | |
.checkerboard .odd .entry-content, | |
.checkerboard .even .entry-content { | |
padding: 24px; | |
} | |
.checkerboard .content .entry-content .entry-title { | |
font-size: 30px; | |
} | |
} | |
@media only screen and (max-width: 1012px) { | |
.checkerboard .content .entry { | |
display: block; | |
} | |
.checkerboard .entry-header, | |
.checkerboard .entry-content { | |
display: block; | |
width: 100%; | |
} | |
.checkerboard .odd .entry-header, | |
.checkerboard .odd .entry-content, | |
.checkerboard .even .entry-header, | |
.checkerboard .even .entry-content { | |
float: none; | |
} | |
} | |
@media only screen and (max-width: 800px) { | |
.checkerboard .site-inner { | |
padding-left: 0; | |
padding-right: 0; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment