Skip to main content Jump to list of all articles

Display WordPress Posts on another WordPress Blog

Following on from the post Display Your WordPress Recent Posts on a Static Page which was used to display your WordPress posts on a non-WP website on the same server. I have had several people contacting me on how to display WordPress posts on another WordPress blog. This tutorial will show you how to display your posts, associated post thumbnail images and a snippet of the content from one blog to another by fetching the data from your RSS feed using the SimplePie RSS parser which is included in the WordPress installation.


Display WordPress Posts

Enable Post Thumbnails in WordPress & RSS Feeds

To be able to display the post thumbnails you need to enable or check that your theme supports thumbnails and also enable post thumbnails to show up in your RSS feeds.

To display your post thumbnails in your feeds you need to add the following to your theme’s functions.php

<?php
//add post thumbnails to RSS images
function cwc_rss_post_thumbnail($content) {
    global $post;
    if(has_post_thumbnail($post->ID)) {
        $content = '<p>' . get_the_post_thumbnail($post->ID) .
        '</p>' . get_the_excerpt();
    }

    return $content;
}
add_filter('the_excerpt_rss', 'cwc_rss_post_thumbnail');
add_filter('the_content_feed', 'cwc_rss_post_thumbnail');
?>

Whilst functions.php is open check for or add the following

add_theme_support( 'post-thumbnails' );

Don’t forget to add the thumbnails to your posts!

Code to Display WordPress Posts

Open up your theme template and add the following snippet of code

<?php 
$rss = fetch_feed('https://www.worldoweb.co.uk/feed');


if (!is_wp_error( $rss ) ) : 
	
    $maxitems = $rss->get_item_quantity(5); 
    $rss_items = $rss->get_items(0, $maxitems); 
endif;
?>
<?php function get_first_image_url($html)
		{
			if (preg_match('/<img.+?src="(.+?)"/', $html, $matches)) {
			return $matches[1];
			}
		}
?>	
 <?php
function shorten($string, $length)
{
    $suffix = '&hellip;';

$short_desc = trim(str_replace(array("/r", "/n", "/t"), ' ', strip_tags($string)));
    $desc = trim(substr($short_desc, 0, $length));
    $lastchar = substr($desc, -1, 1);
    	if ($lastchar == '.' || $lastchar == '!' || $lastchar == '?') $suffix='';
					$desc .= $suffix;
 		return $desc;
}
?>
<ul class="rss-items" id="wow-feed">
    <?php 
    	if ($maxitems == 0) echo '<li>No items.</li>';
    	else 
    	foreach ( $rss_items as $item ) : ?>
    <li class="item">
    	<span class="rss-image">
    		<?php echo '<img src="' .get_first_image_url($item->get_content()). '"/>'; ?>
    	</span>
        <span class="data">
        	<h5><a href='<?php echo esc_url( $item->get_permalink() ); ?>' title='<?php echo esc_html( $item->get_title() ); ?>'> <?php echo esc_html( $item->get_title() ); ?></a></h5> 
			<span class="date-image">&nbsp;</span><small><?php echo $item->get_date('F Y'); ?> </small>
			<span class="comment-image">&nbsp;</span><small><?php $comments = $item->get_item_tags('https://purl.org/rss/1.0/modules/slash/', 'comments');?><?php $number = $comments[0]['data']; ?>
				<?php if ($number == '1'){ echo $number."&nbsp;". "Comment"; } else {echo $number. "&nbsp;"."Comments";}?></small>
			<p><?php echo shorten($item-> get_description(),'150');?></p>
        </span>
    </li>
    <?php endforeach; ?>
</ul>

Now we need to edit the above snippet to suit your needs. I have highlighted the lines that need to be changed. I recommend that you get the script running before making any other changes and always test it in a development environment and not in a production environment.

Line 2 Change this to the URL of the feed you want to fetch.

Line 7 Gets the latest 5 posts. This can be changed to suit your needs.

Line 11-17 This function grabs the first image that is contained in the feed.

Line 18-29 This function is used to shorten the description and not display the full blog post.

Line 30 This is the start of our output which is in the form of an unordered list.

Line 36-38 This is where our image from the post thumbnails feature should display. Please note that linking to an external blog which is not your own may result in no images being displayed.

Line 41 get_date(‘F Y’); This will display the date of the published content. This can be changed to suit your requirements. Read Formatting Date and Time to learn more.

Line 42-43 grabs the amount of comment(s) the post has received. This may not show up as it depends on your RSS feed structure.

Line 44 shorten($item-> get_description(),’150′) uses the function shorten (Line 19-29) to display the blog post to a maximum of 150 characters. This can be changed to suit your requirements.

Add the CSS

Now it’s time to spice up the content with a little CSS. Open up your stylesheet, normally style.css in WordPress. Feel free to change any of the CSS to suit your requirements.

#wow-feed {
    background: #FFFFFF;
    border: 1px solid #AFAFB0;
    width: 600px;
    margin: 10px 0;
    font-size: 0.8em;
}
#wow-feed  li { list-style: none; }
#wow-feed .rss-image img {
    width: 100px;
    height: 100px;
    padding: 8px;
    border: solid 1px #eee;
}
#wow-feed .rss-image { width: 30%; }
#wow-feed .item {
    border-bottom: 1px solid #AFAFB0;
    padding: 10px;
}
#wow-feed .data {
    display: inline-block;
    margin-left: 2%;
    vertical-align: top;
    width: 70%;
}
#wow-feed .data h5 { font-weight: bold; }
#wow-feed .data small {
    color: #8F90CB;
    font-size: 0.9em;
    margin-right: 10%;
}
#wow-feed .comment-image {
    background: url("images/comments.png");
    height: 16px;
    width: 16px;
    vertical-align: middle;
    display: inline-block;
    margin-right: 2%;
}
#wow-feed .date-image {
    background: url("images/date.png");
    height: 16px;
    width: 16px;
    vertical-align: middle;
    display: inline-block;
    margin-right: 2%;
}

All you need to do now is to add the images to your theme images folder. I have packed the tutorial and image files into a handy zip file, available below. If the comments and time images do not display you will need to change the image paths in the CSS to be relative to your theme image directory.

Download

Conclusion

This method of displaying your posts in another blog is fairly limited as there is only so much information contained in a RSS feed. If you have any questions or maybe have a better solution feel free to comment.

Sources

Use SimplePie to grab first image from a RSS feed

173 replies on “Display WordPress Posts on another WordPress Blog”

Thanks so much for this awesome tutorial – it works beautifully …

I’m wondering if there’s a way to grab random posts, rather than the latest posts?

I am currently testing this method to see if I can come up with something. It is possible to shuffle the selection around but this wouldn’t really select random posts it would just put them in a different order.

Hello,

I have set up my RSS feed to display featured image

But when I use the above code it doesn’t display the featured images. I only get empty field. I tried passing $item-> get_content() and $item-> get_description() and both doesn’t work.

When I used “echo $item-> get_content();” or “echo $item-> get_description();” to check what value I am passing through I get the content / description without the image value. But as you can see on my rss feed link, there is img tag under description.

What am i doing wrong ?

Thanks in advance,

Sushil

thanks Tracy,

Now it works 🙂

This is a great post, keep it up.

BTW i did few changes which are as follows.

On functions.php code, I replaced

line 6 and 7 with following code to get the desired image size (medium in my case)

$content = get_the_post_thumbnail($post->ID, ‘medium’) . get_the_excerpt();

On the snippet of code for theme template, I replaced

line 11- 17 with following code to get the image tag with width and height

 <?php 
function get_first_image_url($html)
{
if (preg_match('/]+>/i',$html,$matches)) {
return $matches[0];
}
}
?>

On the same snippet of code I also replaced line 37 with following code to display images

get_content()); ?>

Finally, if you are not getting smaller images from your feed by following above steps and relying on CSS to change you image dimension which will make the page load time smaller depending upon number of your feed displayed.

you can replace following from line 2

$rss = fetch_feed('http://www.yourwebsite/feed');

TO

 $rss = fetch_feed('http://www.yourwebsite/feed/rss');

and this should work.

Cheers!
Sushil

This is great! But I can’t get it to import the featured image – only pulls in the first image that appears in the body of the post? Any thoughts?!

Thanks in advance

Unfortunately SimplePie cannot fetch featured images as yet so the only way I could do it was to retrieve the first image from the feed which should be the featured image. Check your RSS feed to see if the image exists.

yep – that’s fixed it – didn’t have featured images set to appear on the source website’s RSS feed. DOH!

Many thanks!

Thank you very much for you prompt reply. One more question, is it possible to get only one specific post using rss feed?

Please, can you tell me, how can I fix this code so that we can show posts in a row, not in the list?

Can you tell me, do you post change ourselves, every time you add another blog to the new post. Since they are on my blog always appear the same postl, where I used this code

Simon Podcaster
Simon Podcaster On

Hi, i have to say, this was FANTASTIC!!! But I have a doubt:

I need to show the content from other 5 feeds in the same line. Is there a way to display the posts from these blogs, each item with their respective thumbnail, showing the newest firstly? I’ve tried to figure out, but no success. Help?

Simon Podcaster
Simon Podcaster On

Yup! I read, but first of all we need to put two or more feeds together, and then I think they will be showed sorted by date automaticaly, and if won’t, I’ll figure out the way to fix this. :

Sorry about the delay. You can add your websites to an array like so.


$rsslist = array( 'http://www.mywebsite.co.uk/feed',                          'http://www.myotherwebsite.co.uk/news/feed'
  );
        
$rss = fetch_feed($rsslist);

So far I haven’t got the shorten function to work but will test later.

Simon Podcaster
Simon Podcaster On

IT WORKS!!! And the best of all, it’s sorted by date automatically!

That’s amazing, YOU ARE AMAZING!!!
I’m deeply grateful for your help!!!

Cheers! o/

and if somebody wants to know how to display feed from specific post type just add this in the url: …/feed/?post_type=your_post_type

hi preety much trick
i want to show my all post into other domain (wordpress blog). As you can say i want to provide and script to my reader to use my all news into their blog. i am confused how to do this thing.

Dubai web design, development
Dubai web design, development On

This example is fine, but little bit confused. I want to show posts on my website from my blog, not from rss. Please let me know how can i do that?

You should consider doing a version that shows images. The function you included does not work.

I found a function almost identical that worked when I plugged it in, but I can’t find it how. This is ridiculous how convoluted and wasteful you WordPress people are. Spending 24 hours to move a stupid article to another page is pathetic and does not bode well for the survival of the human race in general.

This post displays your post thumbnails, as stated. Unfortunately there is only so much you can do with a RSS feed otherwise I would have added more. There are probably many other ways. You could always ask Google or post a question on one of the various forums then someone might be able to help although it does require some patience and probably some good manners! I apologise in advance if I have offended you but sometimes you just need to perservere.

Cool. Too bad you didn’t mention where to put that ‘snippet’ of code in the theme template. I put it on top, at the bottom, in the middle, integrated, replaced, no matter what. Nothing happens at all. Cheers.

Comments are closed.

Discover more from WorldOWeb

Subscribe now to keep reading and get access to the full archive.

Continue reading