Archived topic
How to Show Icons before Date and Comments Post Meta
55 replies · Started by Ravi Dixit on July 2, 2019
Hmm that one might need to be in the code.
Can you give this a go?
add_filter( 'generate_post_date_output', function( $output ) {
echo $output;
if ( ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
echo '<i class="fa fa-calendar-check-o" aria-hidden="true"></i> <span class="comments-link">';
comments_popup_link( __( 'Leave a comment', 'generatepress' ), __( '1 Comment', 'generatepress' ), __( '% Comments', 'generatepress' ) );
echo '</span>';
}
} );
Here is the result: https://prnt.sc/ojp2jb
No space and It should be added after the line as like last updated. the same CSS is added already for the comments link.
Modify this CSS:
.comments-link, .posted-on {
border-left: 2px solid #ddd;
padding-left: 10px;
margin-left: 10px;
}
to this:
.fa-comments, .posted-on {
border-left: 2px solid #ddd;
padding-left: 10px;
margin-left: 10px;
}
Hey, It is working fine.
But here are two border showing for comments and only one for the date, see this https://prnt.sc/ojzkci
How can I remove all borders from this? But the space between them should be the same.
If you want to remove all borders, simply remove the border-left style in your CSS.
I have removed the border and now it is good.
But I want to remove the Leave a Comment line, It should show the only no. of comments a page has. If there is no comment then it should show 0 only not even "0 comments".
I only want to show the number of comments not even comments word after the icon.
And all the icons are not working for WP Show Post.
Can you try this instead of the function Leo provided?:
add_filter( 'generate_post_date_output', function( $output ) {
echo $output;
if ( ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
echo '<i class="fa fa-calendar-check-o" aria-hidden="true"></i> <span class="comments-link">';
comments_popup_link( __( '0', 'generatepress' ), __( '1', 'generatepress' ), __( '%', 'generatepress' ) );
echo '</span>';
}
} );
Let me know :)
It is working as expected.
But icons are not working for WP Show Post.
WP Show Posts uses a completely different system (not the same filters). Feel free to open a WPSP topic and we'll take a look :)
Okay thanks, But when I search for anything on my website using the search bar. here what I get: https://prnt.sc/okyuin
It is showing both Leave a comment and also comment icon with 0.
How can I remove Leave a comment?
Can you share the full set of functions you're using related to the post meta?
/*Last Updated Date and text*/
.posted-on .updated {
display: inline-block;
}
.posted-on .updated + .entry-date {
display: none;
}
/* Blog post title and meta center alignment in mobile view */
@media (max-width: 768px) {
.single-post .entry-title, .single-post .entry-meta {
text-align: center;
border-bottom: 2px solid #000;
}
}
/* Entry Meta Title(Author, Date, Comments) Customization */
.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: 0px solid #ddd;
padding-left: 10px;
margin-left: 0px;
}
.comments-link:before {
display: none;
}
h2.entry-title {
margin-bottom: 20px;
}
/*Icons before menues, comments and date*/
.posted-on:before {
font-family: 'Font Awesome\ 5 Free';
content: "\f274";
color: #2B60DE;
padding-right: 10px;
}
.fa-comments, .posted-on {
color: #2B60DE;
border-left: 0px solid #ddd;
padding-left: 10px;
margin-left: 10px;
}`
These are the codes I am using for post metadata
That's your CSS - can you share your PHP as well?
I am using this PHP:
add_filter( 'generate_post_date_output', function( $output ) {
echo $output;
if ( ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
echo '<i class="fas fa-comments"></i> <span class="comments-link">';
comments_popup_link( __( '0', 'generatepress' ), __( '1', 'generatepress' ), __( '%', 'generatepress' ) );
echo '</span>';
}
} );
That's it? Something must be inserting that "Leave a comment" text, as it won't appear there by default.