Archived topic
2 Things I need to do it with GP theme after bought it
7 replies · Started by Willya on March 28, 2019
Hi,
I just change my theme to GeneratePress and Im glad I do it. Its fast and clean code, but as I am a newbie and not a WordPress specialist, I cant find a way to do these things.
There are 2 specific things I need to do it with GP theme, I hope you can help me.
Please see this screenshoot first: http://prntscr.com/n4442r
1. How to add subtitles below Site-Title?
2. How to add entry meta with gravatar, author name, last update date and social sharing button in one row
Thanks
Hi there,
1. You would need this plugin:
https://wordpress.org/support/plugin/wp-subtitle/
Then:
1.1 Create a new Hook Element:
https://docs.generatepress.com/article/hooks-element-overview/
1.2 Add this code to the Hook:
<?php the_subtitle( '<h3>', '</h3>' ); ?>
1.3 Select the after_entry_title hook, check execute PHP and set the priority to 5.
1.4 On Display Rules set Location to Posts > All Posts
2. You will need to add this PHP Snippet:
add_filter( 'generate_post_author', '__return_false' );
add_filter( 'generate_show_comments', '__return_false' );
add_filter( 'generate_post_date_output', 'tu_fancy_byline' );
function tu_fancy_byline( $date ) {
printf( ' <span class="byline">%1$s</span>',
sprintf( '<span class="author vcard" itemtype="http://schema.org/Person" itemscope="itemscope" itemprop="author">%4$s<a href="%1$s" title="%2$s" rel="author"><span class="author-name" itemprop="name">%3$s</span></a></span>',
esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
esc_attr( sprintf( __( 'View all posts by %s', 'generatepress' ), get_the_author() ) ),
esc_html( get_the_author() ),
get_avatar( get_the_author_meta( 'ID' ) )
)
);
echo $date;
if ( ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
echo '<span class="comments-link">';
comments_popup_link( __( 'Leave a comment', 'generatepress' ), __( '1 Comment', 'generatepress' ), __( '% Comments', 'generatepress' ) );
echo '</span>';
}
}
And this CSS:
.byline img {
width: 25px;
height: 25px;
border-radius: 50%;
position: relative;
vertical-align: middle;
margin: 0 10px 0 0;
}
.byline,
.comments-link,
.posted-on {
display: inline-block;
}
.comments-link,
.posted-on {
border-left: 1px solid #ddd;
padding-left: 10px;
margin-left: 10px;
}
.comments-link:before {
display: none;
}
h2.entry-title {
margin-bottom: 20px;
}
.posted-on .published {
display: none;
}
.posted-on .updated {
display: block;
}
For the social icons. Create another Hook Element.
The content will be the shortcode from your social sharing icons plugin.
The hook will also be the after_entry_title
Check the execute shortcodes and leave the priority as default.
Display rules same as above.
Once there in i can check the site and provide some CSS for floating them to the right.
Hi David,
Clear instructions even I, a newbie, can follow it. Thank you so much! The subtitle is appear on finish web page. I Love it!
And for social icons, I have follow your instruction and have add the shortcode to the hook on after_entry_title.
You could check on my site url.
Awesome!
So try this CSS, it may be a little tight with the share count as well:
.entry-meta, .entry-meta + .essb_links {
display: inline-block;
}
Thank you once again David. The CSS code works perfectly!
Glad to be of help - Looks great as well :)
Hi. How to add sub-title under the article title of a single post?
Hi there,
just follows steps 1. to 1.4 here: