Skip to content

Instantly share code, notes, and snippets.

@SanjeevMohindra
Last active January 31, 2018 12:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save SanjeevMohindra/570119e78292bd9cc1a9d70de7a85ca2 to your computer and use it in GitHub Desktop.
Save SanjeevMohindra/570119e78292bd9cc1a9d70de7a85ca2 to your computer and use it in GitHub Desktop.
A basic customisation to add social icons in Genesis Author Box
/**
* Author Box With Social Icons
*
* This function will add social icons to author box in genesis. Add this to your function.php
*
* @author MetaBlogue
* @license GPL-2.0+
* @link https://metablogue.com/genesis-add-social-media-icons-author-box/
*/
add_filter( 'genesis_author_box','custom_author_box', 10, 6);
function custom_author_box($output, $context, $pattern, $gravatar, $title, $description) {
//Create Social Buttons
$google_plus = get_the_author_meta( 'googleplus' );
$twitter = "https://twitter.com/" . get_the_author_meta( 'twitter' );
$facebook = get_the_author_meta( 'facebook' );
$youtube = get_the_author_meta( 'youtube' );
$social_buttons = '';
if ($google_plus) {
$social_buttons .= '<a class="social-buttons" title="My Google +" rel="nofollow noopener" href="' . esc_url($google_plus) . '" target="_blank">Google+</a>'; }
if ($twitter) {
$social_buttons .= '<a class="social-buttons" title="Twitter" rel="nofollow noopener" href="' . esc_url($twitter) . '" target="_blank">Twitter</a>'; }
if ($facebook) {
$social_buttons .= '<a class="social-buttons" title="Facebook" rel="nofollow noopener" href="' . esc_url($facebook) . '" target="_blank">Facebook</a>'; }
if ($youtube) {
$social_buttons .= '<a class="social-buttons" title="YouTube" rel="nofollow noopener" href="' . esc_url($youtube) . '" target="_blank">YouTube</a>'; }
//Title formatting is moved to $pattern and we need to recreate it now
$heading_element = 'h1';
if ( 'single' === $context && ! genesis_get_seo_option( 'semantic_headings' ) ) {
$heading_element = 'h4';
} elseif ( genesis_a11y( 'headings' ) || get_the_author_meta( 'headline', (int) get_query_var( 'author' ) ) ) {
$heading_element = 'h4';
}
//Change the gravtar size to 120 px
$gravatar_size = apply_filters( 'genesis_author_box_gravatar_size', 120, $context );
$gravatar = get_avatar( get_the_author_meta( 'email' ), $gravatar_size );
/* The author box markup, contextual - recreate with Social Icons */
$pattern = sprintf( '<section %s>', genesis_attr( 'author-box' ) );
$pattern .= '%s<' . $heading_element . ' class="author-box-title">%s</' . $heading_element . '>';
$pattern .= '<div class="author-box-content" itemprop="description">%s';
if ($social_buttons)
$pattern .= '<hr />%s';
$pattern .= '</div></section>';
if ($social_buttons) {
return sprintf( $pattern, $gravatar, $title, $description, $social_buttons );
} else {
return sprintf( $pattern, $gravatar, $title, $description);
}
}
.author-box {
box-shadow: 0 0 10px rgba(0,0,0,.1);
border: 1px solid #b3b3b3;
}
.author-box .avatar {
border-radius: 50% 50% 50% 50%;
}
a.social-buttons {
background-color: #333;
border-right: 1px solid #fff;
color: #fff;
float: left;
font-size: 10px;
font-size: 1rem;
overflow: hidden;
padding: 8px 0;
padding: 0.8rem 0;
text-align: center;
text-decoration: none;
text-transform: uppercase;
width: 25%;
}
a.social-buttons.last {
border: none;
}
a.social-buttons:hover {
background-color: #f96e5b;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment