Simple Recent Posts Wordpress Widget Untuk Blogger

Simple Recent Posts Wordpress Widget Untuk Blogger

Bola Hero Gawai

Simple Recent Posts Wordpress Widget Untuk Blogger

Simple Recent Posts Wordpress Widget Untuk Blogger
Postingan hari ini masih berlanjut tentang simple recent posts, namun kali ini kita akan membuat recent posts Wordpress untuk kita tampilkan di Blogspot. Hal ini bisa berguna jika Anda memiliki blog Wordpress dan feed-nya ingin ditampilkan di blog Blogspot Anda.

Baca juga:

Secara default, Wordpress memiliki feed seperti berikut: http://domainAnda.com/feed/

Nah untuk membuat recent posts Wordpress untuk ditampilkan di Blogspot, silahkan ikuti langkah-langkahnya di bawah ini.

1. Silahkan simpan kode di bawah ini di gadget HTML/Javascript sidebar blog Anda.


<script>
//<![CDATA[
function feedWordp(){document.write("<scr" + "ipt type=\"text/javascript\" src=\"http://feed2js.org//feed2js.php?src=http%3A%2F%2FdomainAnda.com%2Ffeed%2F&amp;num=6&amp;utf=y\"></scr" + "ipt>");}
feedWordp()
//]]>
</script>

Perhatikan kode domainAnda.com silahkan dengan domain blog Wordpress Anda. kode angka 6 untuk menentukan banyaknya feed yang ditampilkan.

2. Simpan kode CSS di bawah ini di atas kode </head>


<style type='text/css'>
.rss-box{
    width:auto;
    padding:0 10px;
    margin:0 auto;
    border:1px solid #ddd;
}
.rss-box ul,.rss-box li {
    list-style:none;
    margin:0;
    padding:0;
}
.rss-box a{
    text-decoration:none;
}
.rss-box li{
    border-top:1px solid #ddd;
    padding:6px 0
}
.rss-box li:first-child{
    border-top:none;
}
</style>

Result: JsFiddle

Namun jika ternyata blog Anda memiliki url feed yang berbeda dengan di atas atau feed blog Wordpress Anda menggunakan FeedBurner, silahkan ikuti langkahnya di bawah ini.

1. Silahkan masuk ke Feed2JS

2. Silahkan ikuti sesuai petunjuk gambar di bawah ini, yang lainnya biarkan default.

Feed2JS

3. Setelah klik Generate Javascript maka akan muncul kode seperti di bawah ini sebagai contoh:


<script language="JavaScript" src="http://feed2js.org//feed2js.php?src=http%3A%2F%2Fayointer.net%2Ffeed%2F&num=6&utf=y"  charset="UTF-8" type="text/javascript"></script>

<noscript>
<a href="http://feed2js.org//feed2js.php?src=http%3A%2F%2Fayointer.net%2Ffeed%2F&chan=title&num=6&utf=y&html=y">View RSS feed</a>
</noscript>

4. Silahkan ganti kode & menjadi &amp; (ada 2 buah) pada url javascript agar tidak eror HTML5. Kemudian silahkan gunakan cara pertama di atas dengan mengganti url javascriptnya agar tidak terjadi render blocking js, sehingga menjadi seperti di bawah ini


<script>
//<![CDATA[
function feedWordp(){document.write("<scr" + "ipt type=\"text/javascript\" src=\"http://feed2js.org//feed2js.php?src=http%3A%2F%2Fayointer.net%2Ffeed%2F&amp;num=6&amp;utf=y\"></scr" + "ipt>");}
feedWordp()
//]]>
</script>

5. Untuk CSS silahkan gunakan juga CSS pada cara pertama di atas.

Selamat mencoba...

Share this:

Share this with short URL: Get Short URL loading short url

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

0 Comment

Add Comment

Komentar dengan link promo akan masuk spam.

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - http://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Kompi Ajaib? Keep us running by whitelisting Kompi Ajaib in your ad blocker.

This is how to whitelisting Kompi Ajaib in your ad blocker.

Thank you!

×
×
×