When I changed my WordPress theme from Thesis to Genesis, I had to make some major changes to my website. This included customising code that performs certain functions so it would work for me in a Genesis 2.0 website that had new hooks and HTML5.
One of the customisations I needed was to manually add in simple related posts at the bottom of each single post. I did not want thumbnail images, just simple text.
I ran into a few problems:
- The code snippets I had were for Thesis or other WordPress themes.
- Any related posts code had a thumbnail image included. I wanted text only.
- Genesis 2 had new hooks so the tutorials they had did not help at all.
- I needed css to match my new theme.
Here is a screenshot of what my related posts looks like now. Of course I sorted out the problems.
So if you have the new Genesis 2 and you have a html5 child theme then this tutorial is for you. If you have the old Genesis then you will need to edit the Genesis hooks I used. (genesis_entry_footer)
/** Display related posts in Genesis */
function related_posts_tags () {
if ( is_single ( ) ) {
global $post;
$count = 0;
$postIDs = array( $post->ID );
$related = '';
$tags = wp_get_post_tags( $post->ID );
foreach ( $tags as $tag ) {
$tagID[] = $tag->term_id;
}
$args = array(
'tag__in' => $tagID,
'post__not_in' => $postIDs,
'showposts' => 5,
'ignore_sticky_posts' => 1,
'tax_query' => array(
array(
'taxonomy' => 'post_format',
'field' => 'slug',
'terms' => array(
'post-format-link',
'post-format-status',
'post-format-aside',
'post-format-quote'
),
'operator' => 'NOT IN'
)
)
);
$tag_query = new WP_Query( $args );
if ( $tag_query->have_posts() ) {
while ( $tag_query->have_posts() ) {
$tag_query->the_post();
$related .= '<li><a href="' . get_permalink() . '" rel="bookmark" title="Permanent Link to' . get_the_title() . '">' . get_the_title() . '</a></li>';
$postIDs[] = $post->ID;
$count++;
}
}
if ( $related ) {
printf( '<div><h3>Related Posts</h3><ul>%s</ul></div>', $related );
}
wp_reset_query();
}
}
add_action( 'genesis_entry_footer', 'related_posts_tags' );
Where is the functions.php file and where do I put the code?
Remember to be careful when editing this file. Please copy your code and paste it into a notepad file for easy recovery.
1. Go to your WordPress dashboard and sign in.
2. Click on appearance, then editor.
3. On the far right, click on Theme functions or functions.php.
4. Go to the bottom of the code, paste my code in.
5. Press update file after editing.
6. Now go to the right and click on the style.css.
7. Now add the CSS to the style.css
.related-posts-tags {
background: #f5f5f5;
border: 1px solid #ddd;
margin-top: 20px;
padding: 20px;
}
.related-posts-tags h3 {
font-size: 20px;
font-weight: normal;
margin-bottom: 10px
padding: 0;
text-transform: none;
}
.related-posts-tags ul {
margin-left: 10px
}
8. Press update file at the bottom.
Yes,
Replace the
with
Otherwise the CSS won’t work.
I think your comment form parses these codes.. I tried posting a link to pastebin but it didn’t allow.
Anoop Sudhakaran recently posted..How to Stop Google from Using Your Profile Info in Android Caller ID
Hey Mitz,
Nice work converting it.
But there is a small mistake in the PHP Code, You forgot to add the Division Class name.
Here is the corrected code:
printf( ‘Related Posts%s’, $related );
Thanks a lot for sharing your work!
Anoop Sudhakaran recently posted..How to Stop Google from Using Your Profile Info in Android Caller ID
Hi Anoop
I am not that great at coding and I just needed something for Genesis..
Should I replace this line
printf( ‘etc
with your code?
Please explain in a bit more detail.
Awesome Post ..
You have given us a very Simple & easy Article about Genesis 2, It is very easy to understand.
These Tips are very useful to being a Successful Blogger. The more we can make our site popular with these tips.
Thank you Mitz for making me understand about your useful Article .. 🙂
Aqib recently posted..Aey Zindagi Tu Kya Ha
hi thanks for this article this was totally new to me so a good one
vishvast recently posted..Free krish 3 hd wallpapers for pc download