This tutorial shows you how to remove the comment bubble with the comment count from the Smart Passive Income Pro child theme by StudioPress. This post answers this question from a member of the StudioPress community:
I would like to know how to Remove the Comment Bubble in SPI theme and simply add the comment count to the post meta section. I am using the latest version of the SPI (Smart Passive Income) theme
The Solution
There’s 2 simple steps:
Step 1 : Comment out or remove the following PHP code from between lines 124 -131 in the Smart Passive Income Pro themes functions.php file:
/* Modify the entry info
add_filter( 'genesis_post_info', 'spi_post_info' );
function spi_post_info( $post_info ) {
$post_info = __( 'By [post_author_posts_link] on [post_date] [post_comments zero="0" one="1" more="%"][post_edit]', 'smart-passive-income-pro' );
return $post_info;
} */Step 2 : Comment out or remove the following CSS rules between lines 1680 – 1768 in the Smart Passive Income Pro themes style.css file:
/*
.archive .content .entry-comments-link,
.single .content .entry-comments-link,
.page-template-page_blog .content .entry-comments-link {
background-color: #31ac61;
border-radius: 4px;
font-family: "Roboto", sans-serif;
font-weight: 900;
line-height: 1;
padding: 10px 20px;
position: absolute;
right: -5px;
top: -3px;
transform: rotate(5deg);
}
.archive .content .entry-comments-link:after,
.archive .content .entry-comments-link:before,
.single .content .entry-comments-link:after,
.single .content .entry-comments-link:before,
.page-template-page_blog .content .entry-comments-link:after,
.page-template-page_blog .content .entry-comments-link:before {
border: solid transparent;
content: " ";
height: 0;
left: 50%;
pointer-events: none;
position: absolute;
top: 100%;
width: 0;
}
.archive .content .entry-comments-link:after,
.single .content .entry-comments-link:after,
.page-template-page_blog .content .entry-comments-link:after {
border-color: rgba(49, 172, 97, 0);
border-left-color: #31ac61;
border-width: 10px;
margin-left: -5px;
margin-top: -10px;
}
.archive .content p.entry-meta .entry-comments-link > a,
.single .content p.entry-meta .entry-comments-link > a,
.page-template-page_blog .content p.entry-meta .entry-comments-link > a {
color: #fff;
font-size: 24px;
font-size: 2.4rem;
}
.featured-content .entry-comments-link,
.sidebar .featured-content .entry-comments-link,
.single .after-entry .featured-content p.entry-meta .entry-comments-link {
background: transparent;
line-height: 1.625;
padding: 0;
position: static;
transform: none;
}
.featured-content .entry-comments-link:after,
.featured-content .entry-comments-link:before,
.sidebar .featured-content .entry-comments-link:after,
.sidebar .featured-content .entry-comments-link:before,
.single .after-entry .featured-content p.entry-meta .entry-comments-link:after,
.single .after-entry .featured-content p.entry-meta .entry-comments-link:before {
display: none;
}
.featured-content .entry-comments-link > a,
.sidebar .featured-content .entry-comments-link > a,
.single .content .after-entry .featured-content p.entry-meta .entry-comments-link > a {
color: #6d6d6d;
font-size: 12px;
font-size: 1.2rem;
font-weight: 400;
letter-spacing: .6px;
}
.featured-content a.alignleft ~ .entry-header .entry-comments-link,
.featured-content a.alignright ~ .entry-header .entry-comments-link,
.sidebar .featured-content a.alignleft ~ .entry-header .entry-comments-link,
.sidebar .featured-content a.alignright ~ .entry-header .entry-comments-link,
.single .after-entry .featured-content a.alignleft ~ .entry-header .entry-comments-link,
.single .after-entry .featured-content a.alignright ~ .entry-header .entry-comments-link {
float: none;
}
*/
Leave a Reply
You must be logged in to post a comment.