-
-
Save srikat/9a2de612882f382b8717 to your computer and use it in GitHub Desktop.
Speech bubble style Testimonials Archive page in Genesis. https://sridharkatakam.com/speech-bubble-style-testimonials-archive-page-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
<?php | |
// Force full width content | |
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' ); | |
// Remove entry header having title and post info incl. markup | |
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_open', 5 ); | |
remove_action( 'genesis_entry_header', 'genesis_do_post_title' ); | |
remove_action( 'genesis_entry_header', 'genesis_post_info', 12 ); | |
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_close', 15 ); | |
// Remove entry meta from entry footer | |
remove_action( 'genesis_entry_footer', 'genesis_post_meta' ); | |
// Title and byline in entry content - opening markup | |
add_action( 'genesis_entry_content', 'sk_title_byline_markup' ); | |
function sk_title_byline_markup() { | |
echo '<div class="title-byline">'; | |
} | |
// Title | |
add_action( 'genesis_entry_content', 'genesis_do_post_title' ); | |
// Byline and closing markup | |
add_action( 'genesis_entry_content', 'sk_display_byline' ); | |
function sk_display_byline() { | |
echo '<p class="byline">' . get_post_meta( get_the_ID(), '_byline', true ) . '</p>'; | |
echo '</div>'; // end .title-byline | |
} | |
// Display Featured image in entry footer | |
add_action( 'genesis_entry_footer', 'sk_display_featured_image' ); | |
function sk_display_featured_image() { | |
if ( $image = genesis_get_image( 'format=url&size=testifier-thumbnail' ) ) { | |
printf( '<div class="testifier-photo"><a href="%s" rel="bookmark"><img src="%s" alt="%s" /></a></div>', get_permalink(), $image, the_title_attribute( 'echo=0' ) ); | |
} | |
} | |
/** | |
* Display as Columns. Thanks Bill Erickson. | |
* | |
*/ | |
function be_portfolio_post_class( $classes ) { | |
if ( is_main_query() ) { // conditional to ensure that column classes do not apply to Featured widgets | |
$columns = 3; // Set the number of columns here | |
$column_classes = array( '', '', 'one-half', 'one-third', 'one-fourth', 'one-fifth', 'one-sixth' ); | |
$classes[] = $column_classes[$columns]; | |
global $wp_query; | |
if( 0 == $wp_query->current_post || 0 == $wp_query->current_post % $columns ) | |
$classes[] = 'first'; | |
} | |
return $classes; | |
} | |
add_filter( 'post_class', 'be_portfolio_post_class' ); | |
// Force excerpts | |
add_filter( 'genesis_pre_get_option_content_archive', 'sk_show_excerpts' ); | |
function sk_show_excerpts() { | |
return 'excerpts'; | |
} | |
// Modify the length of excerpts | |
add_filter( 'excerpt_length', 'sp_excerpt_length' ); | |
function sp_excerpt_length( $length ) { | |
return 30; // pull first 30 words | |
} | |
// 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() . '">more</a>'; | |
} | |
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 new image size for testifier photos | |
add_image_size( 'testifier-thumbnail', 128, 128, 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
/* Testimonials Archive page | |
--------------------------------------------- */ | |
body.post-type-archive-testimonial { | |
background: #4fc3a0; | |
} | |
.testimonial.entry { | |
padding: 0; | |
background: transparent; | |
} | |
.testimonial.entry .entry-content { | |
background: #fff; | |
padding: 30px; | |
-webkit-box-shadow: 1px 1px 3px rgba(50, 50, 50, 0.23); | |
-moz-box-shadow: 1px 1px 3px rgba(50, 50, 50, 0.23); | |
box-shadow: 1px 1px 3px rgba(50, 50, 50, 0.23); | |
border-radius: 3px; | |
margin-bottom: 30px; | |
position: relative; | |
} | |
.testimonial.entry .entry-content:after { | |
/* If box-shadow for the arrow is not needed */ | |
/*top: 100%; | |
left: 50%; | |
border: solid transparent; | |
content: " "; | |
height: 0; | |
width: 0; | |
position: absolute; | |
pointer-events: none; | |
border-color: rgba(255, 255, 255, 0); | |
border-top-color: #fff; | |
border-width: 10px; | |
margin-left: -10px;*/ | |
/* If box-shadow for the arrow is needed */ | |
/* from http://codepen.io/ryanmcnz/pen/JDLhu */ | |
content: ""; | |
position: absolute; | |
width: 0; | |
height: 0; | |
margin-left: -15px; | |
top: 100%; | |
left: 50%; | |
border: 10px solid transparent; | |
border-color: transparent transparent #fff #fff; | |
-webkit-transform-origin: 0 0; | |
transform-origin: 0 0; | |
-webkit-transform: rotate(-45deg); | |
transform: rotate(-45deg); | |
box-shadow: -3px 3px 3px 0 rgba(50, 50, 50, 0.15); | |
} | |
/* Uncomment the three blocks below if you'd like quotation mark near the beginning of text */ | |
/*.testimonial.entry .entry-content > p { | |
padding-left: 24px; | |
padding-top: 24px; | |
position: relative; | |
} | |
.testimonial.entry .entry-content > p:before { | |
content: "\201C"; | |
font-size: 40px; | |
font-family: Georgia, serif; | |
position: absolute; | |
left: 0; | |
top: 0; | |
color: #aaa; | |
} | |
.title-byline { | |
padding-left: 24px; | |
padding-right: 24px; | |
}*/ | |
.testimonial.entry .entry-title { | |
font-size: 24px; | |
margin-bottom: 5px; | |
} | |
.byline { | |
color: #e37e52; | |
font-size: 16px; | |
line-height: 1.3; | |
} | |
.testifier-photo { | |
text-align: center; | |
} | |
.testifier-photo img { | |
border-radius: 50%; | |
box-shadow: 0 2px 2px 0 rgba(0,0,0,0.25); | |
border: solid 3px #fff; | |
} | |
@media only screen and (max-width: 800px) { | |
.testimonial.entry.one-third { | |
margin-bottom: 40px; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment