Widget Info Gempa Terkini #2

Posted in Labels: Widget | Sunday, April 22, 2012 [ 12:04 PM ]

Home » Widget » Widget Info Gempa Terkini #2

Melanjutkan widget Info Gempa Terkini seri #1 sekarang saya lanjutkan dengan widget Info Gempa Terkini seri #2. Widget ini menggunakan data yang di ambil langsung dari situs resmi BMKG Indonesia kemudian diolah menggunakan feed reader untuk menampilkan informasi gempa yang terjadi. Info gempa yang ditampilkan meliputi besarnya gempa, lokasi gempa, tanggal dan waktu kejadian serta koordinat letak gempa. Tampilan widget seperti pada contoh di bawah ini. Oke... sob buat yang tertarik untuk memasang widget ini langsung aja ke TKP...

Info Gempa Dirasakan

Cara Pemasangan :

Klik "Design" kemudian klik "Add a Gadget" setelah itu pilih "HTML/JavaScript", seperti gambar dibawah ini.

Copy-paste kode berikut ini di kotak postingan gadget.

<div align="center"> <div style="width: 300px;"> <iframe frameborder="0" id="newsblock" src="http://www.poweringnews.com/newsframe.aspx?feedurl=http%3A//pipes.yahoo.com/pipes/pipe.run%3F_id%3D18e468afdb8848c68171340223d17e8e%26_render%3Drss&maxitems=-1&showfeedtitle=0&showtitle=1&showdate=0&showsummary=1&showauthor=0&showactionsbox=0&showrsslink=0&showcopyright=0&opennewwindow=1&inheritstyles=0&bgcolor=%23FFFFFF&titlefontsize=10&summaryfontsize=10&fontfamily=Arial%2CHelvetica&titlecolor=%23466BFF&summarycolor=%23000000&sepstyle=dotted&sepcolor=%23A0A0A0&objectid=newsblock58762745" style="background-color: white; border-color: #373737; border-style: outset; border-width: 1; height: 300px; width: 100%;"></iframe><br /><div style="padding-right: 17px;"> <div style="background-color: #1f5e7c; border-top: #F3FA0C 1px solid; display: block; height: 48px; margin-top: -49px; position: relative; width: 100%;"> <div style="color: white; font-family: Arial; font-size: 18px; padding-top: 10px; position: relative; text-align: center;"> Info Gempa Terkini</div> </div> </div> </div> </div>

<div align="center"><div style="width: 300px;"><iframe frameborder="0" id="newsblock" src="http://www.poweringnews.com/newsframe.aspx?feedurl=http%3A//pipes.yahoo.com/pipes/pipe.run%3F_id%3D18e468afdb8848c68171340223d17e8e%26_render%3Drss&maxitems=-1&showfeedtitle=0&showtitle=1&showdate=0&showsummary=1&showauthor=0&showactionsbox=0&showrsslink=0&showcopyright=0&opennewwindow=1&inheritstyles=0&bgcolor=%23FFFFFF&titlefontsize=10&summaryfontsize=10&fontfamily=Arial%2CHelvetica&titlecolor=%23466BFF&summarycolor=%23000000&sepstyle=dotted&sepcolor=%23A0A0A0&objectid=newsblock58762745" style="background-color: white; border-color: #373737; border-style: outset; border-width: 1; height: 300px; width: 100%;"></iframe><br /><div style="padding-right: 17px;"><div style="background-color: #1f5e7c; border-top: #F3FA0C 1px solid; display: block; height: 48px; margin-top: -49px; position: relative; width: 100%;"><div style="color: white; font-family: Arial; font-size: 18px; padding-top: 10px; position: relative; text-align: center;">Info Gempa Dirasakan</div></div></div></div></div>

| Blog Tools

- Keterangan :
- width: 300px adalah lebar ukuran widget, silakan sesuaikan lebar tersebut supaya cocok dengan template blog sobat.