Member Avatar for sangeeta_ratha

Hi, can anyone provide me with an easy code that would display my blogger posts in my website. ?
Tried googling about blogger widgets. Any site that would be helpful will also do.

  • 3 Contributors
  • 3 Replies
  • 234 Views
  • 17 Hours Discussion Span
  • Latest Post Latest Post by almostbob

Dani AI

Generated

Three practical ways to show Blogger posts on a site (short pros/cons) — quick client widget (no server deploy, but watch CORS/keys), server-side fetch + render (most reliable, cacheable), or a ready-made script/widget (fast but less control). As pointed out, feeds are the common route; Google also exposes a JSON-in-script feed and a REST API (Blogger API v3) that are easier to parse than raw HTML. Blogger JSON sample — Blogger API v3 docs. (developers.google.com)

Client-side (JSONP) — minimal, no server code. Example using the Blogger v3 JSONP callback (requires an API key):

<div id="blog-list"></div>

<script>
function handleFeed(res){
  var out = '<ul>';
  (res.items || []).forEach(function(p){
    out += '<li><a href="'+(p.url || '#')+'">'+(p.title || 'untitled')+'</a></li>';
  });
  out += '</ul>';
  document.getElementById('blog-list').innerHTML = out;
}
var s = document.createElement('script');
s.src = 'https://www.googleapis.com/blogger/v3/blogs/BLOG_ID/posts?key=YOUR_API_KEY&maxResults=5&callback=handleFeed';
document.body.appendChild(s);
</script>

This avoids XHR/CORS because the browser loads a script. If you prefer no-API-key, the older JSON-in-script feed is also available. (developers.google.com)

Server-side (recommended for production) — fetch and render on the server, cache the output, and sanitize before inserting into pages. Minimal PHP example:

<?php
$url = "https://www.googleapis.com/blogger/v3/blogs/YOUR_BLOG_ID/posts?key=YOUR_API_KEY&maxResults=5";
$json = file_get_contents($url);
$data = json_decode($json, true);
foreach (($data['items'] ?? []) as $post) {
  echo '<li><a href="'.htmlspecialchars($post['url']).'">'.htmlspecialchars($post['title']).'</a></li>';
}
?>

Server-side gives control (caching, templating, sanitization) and avoids client CORS issues. Check API docs and quotas if you expect many requests. (developers.google.com)

Notes and cautions: client-side fetches can run into CORS or browser limitations — use JSONP or server fetch for reliability. Always sanitize any returned HTML or attributes to avoid XSS (see OWASP XSS guidance) and set sensible caching to reduce API calls. For a quick drop-in widget, script repositories are an option (as suggested), but for control and stability prefer the server-side pattern above. CORS guide (MDN) — OWASP XSS prevention. (developer.mozilla.org)

Recommended Answers

All 3 Replies

Member Avatar for sangeeta_ratha

Couldn't find anything useful :(

Member Avatar for almostbob

http://www.ehow.com/how_2050575_add-rss-feed-blogger.html

your blgger outputs an rss feed, use feed2html, feed2js feed2php, or any other plugin feed reader script to read the external feed and put it on your web page
google has plugins that you can put your rss source in

the blogger helpscreens say this is the url http://blogname.blogspot.com/feeds/posts/default?alt=rss
to plug into a feed reader script

its only hard if you havent done it once already, after the first time you know what to google for
pretty much any rss feed reader can take the rss feed off any site and display it on any other site, in your choice of window/popup/widget rollover

long winded answer,
I get like that when I have only done it once, makes me nervous

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.