CAREER ACHIEVEMENT: Javascript Widget

Widget HTML Javascript Blogger

Javascript di bawah ini berisi Kode HTML untuk Widget Blogger. Penggunaannya Anda tinggal Copy paste Widget yang dikehendaki lalu pasangkan di Blogger Anda. Selamat Mencoba, Semoga Berhasil.

1. SLIDER HEADER

</div>

2. TOP MENU

<ul>

<li><a href="http://dewi-biru-album.blogspot.com/">My Albums</a></li>

<li><a href="http://teaterproses.blogspot.com/">Teater Proses</a></li>

<li><a href="http://dewi-biru-album.blogspot.com/">My Albums</a></li>

<li><a href="http://teaterproses.blogspot.com/">Teater Proses</a></li>

<li><a href="http://dewi-biru-album.blogspot.com/">My Albums</a></li>

<li><a href="http://teaterproses.blogspot.com/">Teater Proses</a></li>

</ul>

3. JAM DAN TANGGAL
<!-local time clock widget - html code - localtimes.info --><div align="center" style="margin:15px 0px 0px 0px"><div align="center" style="width:140px;border:1px solid #ccc;background:#010 ;color: #010 ;font-weight:bold"><a style="padding:2px 1px;margin:2px 1px;font-size:13px;line-height:16px;font-family:arial;text-decoration:none;color:#11ff11" href="http://localtimes.info/Asia/Indonesia/Jakarta/"><img src="http://localtimes.info/images/countries/id.png" border="0" style="border:0;margin:0;padding:0" />  Jakarta Time</a></div><script type="text/javascript" src="http://localtimes.info/clock.php?continent=Asia&country=Indonesia&city=Jakarta&color=green&widget_number=1000&fwdt=150&mon=1"></script></div><!-end of code--></!-end></!-local>

4. CALENDER

<!-my calendar widget - html code - mycalendar.org --><div align="center" style="margin:15px 0px 0px 0px"><noscript><div align="center" style="width:160px;border:1px solid #ccc;background:#fff ;color: #fff ;font-weight:bold;"><a style="font-size:12px;text-decoration:none;color:#000 ;" href="http://mycalendar.org/Holiday/Indonesia/">Indonesia Calendar</a></div></noscript><script type="text/javascript" src="http://mycalendar.org/calendar.php?group=Holiday&calendar=Indonesia&widget_number=2&cp3_Hex=8F228f&cp2_Hex=FFFFF3&cp1_Hex=090909&fwdt=200&lab=1"></script></div><!-end of code--></!-end></!-my>

5. ROOL UP INFORMATION

<tr>

<td>

</marquee>

</td>

</tr>

</table>

6. PENGUMUMAN DROP DOWN

<div><form name="copy"><div align="center"><span><input value="Renungan Minggu Ini" type="button" onclick="javascript:this.form.txt.focus();this.form.txt.select();" /></span></div><p align="center"><textarea style="width: 300px; height: 210px;background-color:#C1F3B1" name="txt" rows="5" wrap="VIRTUAL" cols="20"> UJIAN NASIONAL/UN TAHUN 2013 :

Pengumuman Penting bagi para Siswa-siswi SD sampai SMA, mengenai Rencana Soal UN Tahun 2013. Mohon dipelajari dan diantisipasi baik-baik demi suksesnya pembelajaran Anda semua.

Untuk rencana soal pada UN nanti diperkirakan akan lebih ketat dari sebelumnya. Ketika UN tahun 2012 dengan 5 kode soal yang berbeda, namun soal UN tetap sama walaupun di acak.

Untuk UN 2013 ini, pemerintah akan membuat 20 tipe soal yang sama sekali berbeda dari tiap kode dari A - T. Rencana ini dibuat pemerintah agar siswa mampu menyerap semua kompetensi dasar yang di ujikan nanti sehingga siswa tidak ada kesempatan untuk membuka kunci jawaban apalagi menyontek. Sungguh tantangan berat untuk UN 2013 ini.

Sumber : PelitaHidup
</textarea></p></form></div>

7. WIDGET KODE WARNA :

<object border="0" classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="280" id="obj1" width="280"> <param value="http://www.2createawebsite.com/build/color.swf" name="movie" />
<param value="High" name="quality" />
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="High" src="http://www.2createawebsite.com/build/color.swf" name="obj1" type="application/x-shockwave-flash" width="280" height="280"> </embed></object>

8. WIDGET KODE WARNA BERPUTAR :
<object align="middle" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" height="290" id="col" width="290"> <param value="sameDomain" name="allowScriptAccess" />
<param value="http://www.2createawebsite.com/build/col.swf" name="movie" />
<param value="high" name="quality" />
<param value="#ffffff" name="bgcolor" />
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" src="http://www.2createawebsite.com/build/col.swf" bgcolor="#ffffff" name="col" width="290" align="middle" height="290"> </embed></object>

9. GLITTER

<a href="http://www.glitter-graphics.com"><img src="http://dl7.glitter-graphics.net/pub/2647/2647047cdbxxm7flj.gif" width=134 height=99 border=0></a><br><a href="http://www.glitter-works.org" target=_blank>glitter-graphics.com</a>   Merpati

<a href="http://www.glitter-graphics.com"><img src="http://dl7.glitter-graphics.net/pub/1594/1594447bbaybzoemv.gif" width=250 height=222 border=0></a><br><a href="http://www.glitter-works.org" target=_blank>glitter-graphics.com</a>   Rajawali

<a href="http://www.glitter-graphics.com"><img src="http://dl.glitter-graphics.net/pub/382/382561ai7h9zeppn.gif" width=100 height=99 border=0></a>   Mr. Bean

10. Memasang Text Berjalan

<div align="left"><font face="georgia" color="White"><strong><marquee bgcolor="red" width="70%" scrollamount="3" behavior="alternate"> </marquee></strong></font></div>

11. Link Widget

http://www.komputerseo.com/2010/12/cara-memasang-gambar-animasi-lucu-di.html

http://www.widgetbox.com/widgets/

http://bloggergadgets.net/

12. Memasang Icon YM

1. Copy-paste kode dibawah ini jika anda ingin menampilkan icon YM seperti ini :

<center><a href="ymsgr:sendIM?kode_ym_anda"><img src="http://opi.yahoo.com/online?u=kode_ym_anda&m=g&t=1" border="0" width="64" height="16"></a></center>

2. Kalau ingin menampilkan icon YM seperti disamping ini masukkan kode HTML dibawah ini:

<center><a href="ymsgr:sendIM?kode_ym_anda"><img src="http://opi.yahoo.com/online?
u=kode_ym_anda&m=g&t=14" border="0"></a></center>

yang bercetak merah kode_ym_anda diganti dengan ID YM anda sendiri
Misalnya email anda namaku@yahoo.com maka IDnya cukup namaku (tanpa @yahoo.com)

13. Pembuatan Breadchumb ( Posisi Browser Anda )

• Seperti biasa anda harus login ke Blogger.
• Langsung tuju Edit HTML.
• Klik Expand Template Widget.
• Letakkan kode berikut ini tepat sebelum kode ]]></b:skin>

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef}

• Setelah itu, cari kode seperti ini :
<div class='post hentry'>

• Letakkan kode berikut ini tepat setelah kode <div class='post hentry'>

<b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == "item"'> <div class='breadcrumbs'> Browse » <a expr:href='data:blog.homepageUrl'>Home</a> » <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != "true"'> , </b:if> </b:loop> </b:if> » <data:post.title/> </div> </b:if> </b:if>

Terakhir, Simpan Template Anda.

14. Membuat Gambar / Objek ke tengah-tengah ( center )
<div align = "center" > …Text HTML / Javascript Anda… </div >

15. SEO BLOG

1. Pakai Meta tags
<meta name="robots" content="INDEX, FOLLOW"/>
<meta name="description" content="Deskripsi dari blog Anda di sini "/>
<meta name="keywords" content="kata kunci atau keyword simpan disini, buatlah beberapa keyword yang sobat anggap sangat berhubungan dengan blog Anda "/>

2. Pakai dofollow
Cari Kode berikut : <a expr:href='data:comment.authorUrl' rel='nofollow'>
Hapus rel=’nofollow’ sehingga menjadi :

<a expr:href='data:comment.authorUrl' >

Kemudian, cari kode : <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
Hapus rel=’nofollow’ sehingga menjadi menjadi :

<a expr:href='data:backlink.url'><data:backlink.title/></a>

3. Mendaftarkan Blog Anda ke Google :
https://www.google.com/webmasters/tools/submit-url

16. Script Pemasangan Iklan - Banner Floating

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'>
</script><br />
<script type='text/javascript'>
$(document).ready(function() {
$('img#closed').click(function(){
$('#btm_banner').hide(90);
});
});
</script>
<style type='text/css'>
div#btm_banner {
bottom: 0;
position: fixed;
width: 100%;
opacity: 0.9;
left: 0;
}
div#btm_banner img{
border:0;
cursor:pointer;
}
</style>
<div style='height: 0px;'></div>
<div align='center' id='btm_banner' style='height: 110px; z-index: 9999;'>
<div style='text-align: right; width: 735px; height: 3px;'>
<img id='closed' src='http://www.voa-islam.com/images/close-icon.png'/></div>
<div style='clear: both;'></div>
<p>
<p><center>

<a href="http://studyonline21.blogspot.com/ " target="_blank"title="Pasang Iklan"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE_UxoiHm11frAe6-sYcdQXYG6u75EL0lRjX8TzORtBGYhjs1WP0wwXjZFHryiyw47SRa4BR47BXQNbwfI9r_5tgkWIiAQrPzO_w26l1DeMADh0woK_kZN7d33tgiD4D0CLstUtp5GfgUv/s640/banner+floating.jpg" border="0"/></a>

atau pakai banner flash :

<a href="http://studyonline21.blogspot.com/ " target="_blank"title="Pasang Iklan"><script src="http://h2.flashvortex.com/display.php?id=2_1352261186_11833_442_0_728_90_9_2_100" type="text/javascript" ></script></a>

( Karena Flash, Membukanya harus klik 2X bersamaan / Double Click )

</center></p>
</p>
</div>

Yang berwarna BIRU dan MERAH, mohon diganti sendiri, OK

17. Si Jempol

<img alt="" height="70" id="Image1_img" src="http://geniushomeschooling.files.wordpress.com/2010/11/penunjuk-arah1.gif?w=81&h=60" width="125" style="visibility: visible;">

18. Membuat Gambar ber-Link

<center>
<table cellpadding="10" cellspacing="10"><tbody>
<tr> <td align="justify" valign="top" width="300"><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://studyonline21.blogspot.com/" style="margin-left: auto; margin-right: auto;"><img height="200" src="http://i1201.photobucket.com/albums/bb348/ayahafkar1/marketingdynamit.png" width="160" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Rp 150.000,-</td></tr>
</tbody></table>
</td><td align="justify" valign="top" width="300"><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://studyonline21.blogspot.com/" style="margin-left: auto; margin-right: auto;"><img height="200" src="http://i1201.photobucket.com/albums/bb348/ayahafkar1/marketingdynamit.png" width="160" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Rp 150.000,-</td></tr>
</tbody></table>
</td><td align="justify" valign="top" width="300"><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="http://studyonline21.blogspot.com/" style="margin-left: auto; margin-right: auto;"><img height="200" src="http://i1201.photobucket.com/albums/bb348/ayahafkar1/bestofstrategy.png" width="158" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Rp 120.000,-</td></tr>
</tbody></table>
</td> </tr>
</tbody></table>
</center>

19. METRO TV

<embed allowfullscreen="true" allowscriptaccess="always" flashvars="file=video_source.flv&type=video&streamer=rtmp://202.158.49.58/mobile/&image=http://onlinetvamienk.com/streaming/loading.gif&autostart=true&stretching=exactfit&volume=50" frameborder="0" height="230" quality="high" scrolling="no" src="http://onlinetvamienk.com/streaming/player.swf" style="padding-top: 3px;" type="application/x-shockwave-flash" width="100%" wmode="transparent"></embed>

20. TV ONE

<div align="center" style="margin-left: -30px;">
<div id="player_wrapper" style="height: 230px; position: relative; width: 280px;">
<object bgcolor="#000000" data="http://www.tvonenews.tv/embed/mediaplayer-5.8-viral/player.swf" height="100%" id="player" name="player" tabindex="0" type="application/x-shockwave-flash" width="115%"><param value="true" name="allowfullscreen" /><param value="always" name="allowscriptaccess" /><param value="true" name="seamlesstabbing" /><param value="opaque" name="wmode" /><param value="netstreambasepath=http%3A%2F%2Fwww.tvonenews.tv%2Fstreaming&id=player&file=http%3A%2F%2Fwww.tvonenews.tv%2Ftvone1.php&stretching=exactfit&controlbar.position=over" name="flashvars" /></object>
</div>
</div>

21. WIDGET TOKO ONLINE

PERIKSA ONGKOS KIRIM

<div align ="center">
<a href="http://ongkir.info/" title="Ongkir.Info - Pencarian Ongkos Kirim & Tracking Terpadu"><img alt="Ongkir.Info - Pencarian Ongkos Kirim & Tracking Terpadu" src="http://ongkir.info/assets/images/banners/ongkir-info-190x100.jpg" /></a>
</div>

KURIR JNE

<img style="width: 126px; height: 67px;" src="http://i.imgur.com/JzyLE.png" alt="" title="" />
<form action="http://www.jne.co.id/index.php" method="get" name="input" target="_new2">
<input type="hidden" name="mib" value="tracking.detail" />
JNE: <input name="awb" type="text" />
<input type="submit" value="Submit" /></form>

T I K I

<img style="width: 126px; height: 67px;" src="http://i.imgur.com/Wlfnn.jpg" alt="" title="" />
<form method="post" action="http://www.tiki-online.com/tracking/track_single" name="input" target="_blank">TIKI:<input id="TxtCon" name="TxtCon" type="text" />
<input id="button" name="button" value="Submit" type="submit" /></form>

POS INDONESIA

<img style="width: 126px; height: 67px;" src="http://i.imgur.com/K0oO2.jpg" alt="" title="" />
<form method="get" action="http://www.posindonesia.co.id/home/modules/mod_search/tmpl/libs/lacakk1121m4np05.php" name="input" target="_blank">POS:<input name="barcode" type="text" />
<input value="Submit" type="submit" /></form>

NOMOR REKENING BCA

<span style="font-family: Verdana,Arial,Helvetica,sans-serif; font-size: x-small;"> </span><br />

<div align="center">

<span style="font-family: Verdana,Arial,Helvetica,sans-serif; font-size: x-small;"><img height="48" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEju2AFNdgo8puPUhe0wZERmQgisVifcnJexYooLEEtViktQPknFZb6mTbI5lvkgHL32iTD_YcuSKNVr9ttCFjN1Cz4WQxC-aOL-mxbljIp8PQkTWrxUwwE8X8KUYawpochDA5Zgfc906E8/s1600/logo-bca.png" width="100" /></span></div>

<div style="text-align: center;">

<b><span style="font-size: x-small;"><span style="font-family: Verdana,Arial,Helvetica,sans-serif;">No Rek : 0657053215</span></span></b></div>

<div align="center" class="style69">

<b><span style="font-family: Verdana,Arial,Helvetica,sans-serif; font-size: x-small;"><span style="font-family: Verdana,Arial,Helvetica,sans-serif;">A/N </span>: Denny Pasaribu</span></b></div>
<div align="center" class="style69">
<span style="font-family: Verdana,Arial,Helvetica,sans-serif; font-size: x-small;"><br /></span><br /></div>

22. PHOTO CUBE GENERATOR

<center><embed src="http://www.satisfaction.com/photo-cube-generator/show.swf?baseURL=http://www.satisfaction.com/photo-cube-generator/&clickURL=http://www.satisfaction.com/photo-cube-generator/&flashLABEL=Satisfaction.com&clickLABEL=Photo Cube Generator&file=" quality="high" bgcolor="#ffffff" width="300" height="250" name="show" align="middle" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /><br><small><a href="http://www.satisfaction.com/photo-cube-generator/">Photo Cube Generator</a><small></center>

Jumat, 12 Oktober 2012

Javascript Widget

Widget HTML Javascript Blogger

Street Map

Feedjit

Entri Populer