Head over to RaviSagar.com & and you will see a site, my site :) yet another site but this one is different. This site has a dot com domain which I wanted to get for a long time. Believe it or not this domain was on sale for $2500 something dollars for years. I guess nobody bought it all these years and it was released in the market. I bought it immediately. Now since I already have this Drupal site and one more www.ravi.pro which I publish using only Emacs Org Mode, I wanted to do something different with RaviSagar.com. This site is 100% HTML, CSS and a bit of Javascript to pull in my latest posts from this site.
I searched online and found some script to convert RSS XML into HTML. I modified them little bit and wrote this one.
-
$(document).ready(function() {
-
//feed to parse
-
var feed = "<a href="https://www.d10.ravisagar.in/%3C/span%3Ehttps%3Cspan%20style%3D"color: #339933;">://www.ravisagar.in/rss.xml">https://www.ravisagar.in/rss.xml</a>";
-
-
let html = '';
-
-
$.ajax(feed, {
-
accepts:{
-
xml:"application/rss+xml"
-
},
-
dataType:"xml",
-
success:function(data) {
-
//Credit: <a href="http://stackoverflow.com/questions/10943544/how-to-parse-an-rss-feed-using-javascript">http://stackoverflow.com/questions/10943544/how-to-parse-an-rss-feed-us…</a>
-
-
$(data).find("item").slice(0,2).each(function () { // or "item" or whatever suits your feed
-
-
let html = ``;
-
var el = $(this);
-
html += `
-
<article>
-
<h3><a href="${el.find("link").text()}">${el.find("title").text()}</a></h3>
-
-
${el.find("description").text()}
-
-
</article>
-
-
`;
-
-
document.getElementById("rss-viewer").insertAdjacentHTML("beforeend", html);
-
-
-
});
-
-
}
-
});
-
-
});
I also had to enable CORS on my Drupal site to make the request in the Javascript code.
- Copy sites/default/default.services.yml to sites/default/services.yml
- Change cors.config: enabled: false to true
- Clear cache
HTML and CSS I used on the site are bare minimum need to create a very simple responsive site. Although I love working on this site and sharing content in a very organised way but I was looking for something simpler and because I make lot of notes locally using Org Mode, I launched www.ravipro.com which was a great step in the right direction but with RaviSagar.com I am quite satisfied because it is pure HTML site and there is a immense satisfaction (a bit nostalgic) in creating simple HTML site. The Javascript I added to just make this site little bit dynamic so it show latest update from this site. I am quite happy with my setup so far. RaviSagar.com will act as my business card with links to my content.
Enjoy :)
