How to create related posts with images for Genesis theme without Plugin

[WordPress tips] Create related articles with images for Genesis theme without Plugin – It can be said that related posts (Related Post) is a very important function for the Web, it helps the website retain readers from there. This helps to increase the number of pageviews on the website significantly. This is one of the deciding factors for website rankings, in addition, it also increases the aesthetics of the website, so this is a very important feature if you If you are using WordPress, the Related Post integration is very simple, you can use Plugin or Code.

In the previous article about WordPress tricks, I showed you how to  display related posts to your liking using Plugins that help you easily integrate related posts in WordPress continue in this article. I will guide you how to create the simplest article with images for Genesis theme without Plugin.

Create related posts with images for Genesis theme

Usually, some interfaces now have the  Related Post feature built-in , but for some interfaces that are not typical, the Genesis theme, if you feel that using the Plugin is not good, you can use Code To add related posts feature in Genesis theme, let’s learn how to create related posts with images for Genesis theme without Plugin.

First, go to the Functions.php file of the interface you are using (if you use the Genesis theme, you will definitely have a child theme). Please access the Functions.php file of the interface. con) by accessing the WordPress management page > Go to Themes > Click Edit (you can refer to the article on editing themes, WordPress plugins without FTP to better understand how to edit theme files) .

Customize Code

After accessing the Functions.php file , copy the 2 codes below

The first code

add_image_size('sidebar-featured', 100, 100, TRUE);

Second code

//for XHTML themes
add_action( 'genesis_after_post_content', 'child_related_posts' );
//for HTML5 themes
add_action( 'genesis_after_entry_content', 'child_related_posts' );
/**
* Outputs related posts with thumbnail
*
* @author
* @url http://mygenesisthemes.com/related-posts-genesis
* @global object $post
*/
function child_related_posts() {
if ( is_single ( ) ) {
global $post;
$count = 0;
$postIDs = array( $post->ID );
$related = '';
$tags = wp_get_post_tags( $post->ID );
$cats = wp_get_post_categories( $post->ID );
if ( $tags ) {
foreach ( $tags as $tag ) {
$tagID[] = $tag->term_id;
}
$args = array(
'tag__in' => $tagID,
'post__not_in' => $postIDs,
'showposts' => 6,
'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();
$img = genesis_get_image() ? genesis_get_image( array( 'size' => 'related' ) ) : '<img src="' . get_bloginfo( 'stylesheet_directory' ) . '/images/related.png" alt="' . get_the_title() . '" />';
$related .= '<li><a href="' . get_permalink() . '" rel="bookmark" title="Permanent Link to' . get_the_title() . '">' . $img . get_the_title() . '</a></li>';
$postIDs[] = $post->ID;
$count++;
}}}
if ( $count <= 4 ) {
$catIDs = array( );
foreach ( $cats as $cat ) {
if ( 3 == $cat )
continue;
$catIDs&#91;&#93; = $cat;
}
$showposts = 5 - $count;
$args = array(
'category__in' => $catIDs,
'post__not_in' => $postIDs,
'showposts' => $showposts,
'ignore_sticky_posts' => 1,
'orderby' => 'rand',
'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'
)));
$cat_query = new WP_Query( $args );
if ( $cat_query->have_posts() ) {
while ( $cat_query->have_posts() ) {
$cat_query->the_post();
$img = genesis_get_image() ? genesis_get_image( array( 'size' => 'related' ) ) : '<img src="' . get_bloginfo( 'stylesheet_directory' ) . '/images/related.png" alt="' . get_the_title() . '" />';
$related .= '<li><a href="' . get_permalink() . '" rel="bookmark" title="Permanent Link to' . get_the_title() . '">' . $img . get_the_title() . '</a></li>';
}}}
if ( $related ) {
printf( '<div class="related-posts"><h3 class="related-title">Related Posts</h3><ul class="related-list">%s</ul></div>', $related );
}
wp_reset_query();
}}

and paste it inside the closing <?php tag (you should paste it at the end) and that’s it!

Customization of Code

To change the number of posts displayed, change the command

'showposts' => 6,

Change the number 6 to the number of posts you want to display accordingly, then save and enjoy the result but it will not display very well so you need to customize it further by copying the paragraph Code below and paste it at the end of the theme’s Style.css file .

/************ Related Posts *************/
.related-posts {
    overflow: hidden;
    margin: 0 0 10px;
}
.related-list li {
  float: left;
  list-style-type: none;
  margin: 0 10px 0 0;
  text-align: center;
  width: 105px;
}
.related-list img {
 display: block;
  margin: 0 auto;
  padding: 5px;
}

After you’re done, save it and go to the homepage, click on an article to see the results (after you’re done, you’ll see results like this) .

Is it too simple for you to create related posts with images for Genesis theme without using Plugins?

Finally, if you find the article useful, please subscribe to my blog regularly to update the latest articles via Email – Thank you!