Wordpress Style Author Bio Box For Blogger

<div class="separator" style="clear: both; text-align: center;"> <a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" target="_blank"><img border="0" height="245" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFqJF1pYvLXNzZ0NQhL94_Y5x35tIp69_xow8qZOTjCvWLg2CoUc0wcqyqHyXazUjlyGrVCbm7V-4SIfhxlLCxN9g-m4FpVj3okaxiRWI-ZzJVftlJv6V47tUqCUnESh6K0Q386GsnPA/s1600/Author+Bio+Box+For+Blogger.png" width="320" /></a></div> <span class="awal">W</span>elcome to the Website of <a href="http://otowebsite.blogspot.com/" target="_blank">Oto Website</a>, Saya ucapkan bagi seluruh pengunjung yang sedang membaca Artikel Oto Website, atau mungkin sedang tersesat di blog ini melalui Search Engine. Kali ini dalam artikel ini kita akan umembahas tentang tutorial blogger kembali.<br /> <br /> Apakah Anda pernah melihat Author Box atau Kotak Admin di salah satu blog Wordpress? Kalo Anda pernah melihatnya apakah Author Box tersebut cukup membuat Anda terkesan?<br /> <br /> Kenapa Saya bertanya seperti itu? Ya karna kali ini Author Box yang ada pada Wordpress lah yang akan kita bahas tentang bagaimana cara menambahkannya pada blogspot dan tutorial kali ini Saya beri judul: <a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" target="_blank">Wordpress Style Author Bio Box For Blogger</a>. Sebelumnya blog ini juga pernah membahas Kotak Admin untuk blogspot yang berada <b><a href="http://otowebsite.blogspot.com/2012/05/cara-memasang-kotak-admin-di-bawah.html" target="_blank">DISINI</a></b>.<br /> <br /> Untuk lebih jelasnya tentang <a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" target="_blank">Wordpress Style Author Bio Box For Blogger</a> dan bentuknya silahkan Anda lihat demo berikut ini:<br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> SceenShot ▼</div> <br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO7PHBcFqGnrL3PRAfmlZfjpYbTTwbhrpZLB8L8GgQX_tgsa14F7QcIT8ouI8VK-eL55MQUW2kZwsyOvGs1cmVr2s1OG58D0hP6h37jZa_q4M1hRk-RUULhtP7JSU3b9WWP7U8v8RKLg/s1600/wp.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="122" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhO7PHBcFqGnrL3PRAfmlZfjpYbTTwbhrpZLB8L8GgQX_tgsa14F7QcIT8ouI8VK-eL55MQUW2kZwsyOvGs1cmVr2s1OG58D0hP6h37jZa_q4M1hRk-RUULhtP7JSU3b9WWP7U8v8RKLg/s1600/wp.png" width="640" /></a></div> <div style="text-align: center;"> <span style="font-size: x-small;">(gambar oleh <a href="https://plus.google.com/u/0/101942472174789798746" target="_blank">dek_rif</a>)</span></div> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Live Demo</div> <br /> <div style="text-align: center;"> <a class="button" href="https://code-otowebsite.googlecode.com/svn/trunk/Author.WP.html" target="_blank"><b>Lihat Demo</b></a></div> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Tambah Wordpress Style Author Bio Box For Blogger</div> <br /> <a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" target="_blank">Wordpress Style Author Bio Box For Blogger</a> ini peletakkan di bawah postingan blogger, atau di bawah artikel blog Anda, berikut ini adalah kode yang di gunakan untuk membuat <a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" target="_blank">Wordpress Style Author Bio Box For Blogger</a>.<br /> Letakkan tag berikut di bawah tag <b><i><span style="color: red;"><data:post.body/></span></i></b> yang kedua dalam template Anda.<br /> Atau<br /> Letakkan tag berikut sebelum tag <b><i><span style="color: red;"><div class='post-footer-line post-footer-line-1'></span></i></b> dalam template Anda.<br /> <br /> <blockquote class="tr_bq"> /* Code for the author box starts here otowebsite.blogspot.com */<br /> <style type="text/css"><br /> #postauthor { background: #eef7f8; border: 1px solid #c6d9ed; padding:10px; margin: 15px 0; width:650px; height:105px; font-family:Georgia, "Times New Roman", Times, serif; }<br /> #author-info{float:left; width:410px; padding:0 15px 0 0; border-right:1px solid #ccc; }<br /> #author-info img {background:#fff; border: 1px solid #ddd; float: left; margin-right:10px;padding: 5px;<br /> box-shadow: 0 0 3px #CCC; padding:3px;}#author-info h6 { color: #666; font-size: 18px; font-family:Georgia, "Times New Roman", Times, serif; font:Georgia, "Times New Roman", Times, serif }<br /> #author-info h5 {color:#666; text-transform:none; font-size:12px; letter-spacing:0; font-family: Georgia;}<br /> #author-info p { color: #515151; font-size: 12px; line-height:16px; font-family: Georgia;}<br /> * { margin:0; padding:0;}#author-connect{width:21%; float:right; margin-right:8%; }<br /> a.gplus-s{background: url("https://code-otowebsite.googlecode.com/svn/trunk/gp-icon.png") no-repeat 0 0px; color: #666;  font-weight: bold;margin: 5px 0px; padding: 0 20px;text-decoration: none;}<br /> </style><br /> <b:if cond='data:blog.pageType == "item"'><br /> <b:if cond='data:post.author == "Author Name"'><br /> <div id="postauthor"><br /> <div id="author-info"><br />  <img alt='' src='<span style="background-color: #6fa8dc;">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib_118ChHKE4ltjG9-88QU5E_y2TMlW0MNx-fkbuIH1WVeOkETkXkVL958h4xk7_PBpsqVcg9MWSqdp-1Y6p1wcpqouzA7gHFsGSNWWxYfYKgJAhFWbBQ38ZSjIXYw6lzaGj9SOK9oVA4/s1600/author.jpg</span>'  height='80' width='80' /><h6 style="font:Georgia">Article by <a expr:href='data:post.authorProfileUrl' rel='author'><data:post.author/></a></h6><br /> <h5>AuthorName Semoga Artikel ini banyak berguna.</h5><br /> <p>Jika Anda menyukai Artikel ini Anda dapat mengikuti Oto Website di <strong><br /> <a href="http://twitter.com/<span style="background-color: #93c47d;">otowebsite</span>" rel="nofollow" >Twitter  </a> </strong>.Berlangganan <strong> feed  Oto Website via <a href="http://feeds.feedburner.com/<span style="background-color: #ffd966;">otowebsite</span>" rel="nofollow" >RSS</a> atau  <a href="http://feedburner.google.com/fb/a/mailverify?uri=<span style="background-color: #ffd966;">otowebsite</span>&loc=en_US" rel="nofollow" > EMAIL </a>  </strong>untuk mendapatkan Update terbaru.</p></div><br /> <div id="author-connect"><br /> <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2F<span style="background-color: #c27ba0;">dekrif</span>&send=false&layout=button_count&width=120&show_faces=false&action=like&colorscheme=light&font&height=21&appId=230688610312045" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:120px; height:21px;" allowTransparency="true"></iframe>       <br /> <a href="https://twitter.com/<span style="background-color: #93c47d;">otowebsite</span>" class="twitter-follow-button" data-show-count="false" data-size="small">Follow @<span style="background-color: #93c47d;">otowebsite</span></a><br /> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script><br /> <a href="<span style="background-color: #e06666;">https://plus.google.com/115780777398536909642</span>" target="_blank" rel="nofollo" class="gplus-s" >Google</a></div></div><br /> </b:if></b:if></blockquote> <br /> <b><a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" target="_blank">Keterangan:</a></b><br /> <br /> <ul> <li>Ganti kode yang di <span style="background-color: #6fa8dc;">blok biru</span> dengan URL Gambar Anda.</li> <li>Ganti kode yang di <span style="background-color: #ffd966;">blok kuning</span> dengan ID feedburner Anda</li> <li>Ganti kode yang di <span style="background-color: #93c47d;">blok hijau</span> dengan ID twitter Anda</li> <li>Ganti kode yang di <span style="background-color: #c27ba0;">blok ungu</span> dengan URL ID facebook Anda.</li> <li>Ganti kode yang di <span style="background-color: #e06666;">blok merah</span> dengan ID Google Plus Anda.</li> </ul> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Dari Meja Editor</div> <br /> Saya rasa cukup untuk kali ini, yang membahas tutorial blogger berjudul <a href="http://otowebsite.blogspot.com/2013/02/wordpress-style-author-bio-box-for.html" target="_blank">Wordpress Style Author Bio Box For Blogger</a>. Saya harap Anda menyukai tutorial di atas dan tidak mengalami kesulitan dalam pembuatan atau pemasangan, Jika Anda mengalami masalah tentang tutorial di atas silahkan tinggalkan pertanyaan Anda pada form komentar!

• 
• 
• 
• 

1. 1
2. 2
3. 3
4. 4

• Previous
• Next

Wordpress Style Author Bio Box For Blogger

Welcome to the Website of Oto Website, Saya ucapkan bagi seluruh pengunjung yang sedang membaca Artikel Oto Website, atau mungkin sedang tersesat di blog ini melalui Search Engine. Kali ini dalam art…

Baca selengkapnya »

IDM 6.15 Full Patch

<div class="separator" style="clear: both; text-align: center;"> <a href="http://otowebsite.blogspot.com/2013/02/idm-615-full-patch.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKIk9L8saZSgMt0wPpRWI9XsHjs6MigWngxU1txmlNChxBIasXzetOfuh75JO6l3rs40A3j_F-tsJKqrgSYxKGFb5ghKU46f1naRbH9UfRr4GUH2S-vcCFtgr3il1MMXOVbUIKs3opuA/s1600/IDM6.15+Full+++Patch.jpg" /></a></div> <span class="awal">D</span>i artikel kali ini kita akan berbagi sebuah <a href="http://otowebsite.blogspot.com/search/label/Download%20Software" target="_blank">software</a> yang sangat penting untuk mengunduh sebuah file vide, mp3 dan lain sebagainya. Mungkin Anda sudah tau <a href="http://otowebsite.blogspot.com/search/label/Download%20Software" target="_blank">software</a> apa yang akan kita bagikan? di bilang sangat penting untuk mengunduh sebuah file apa lagi kalo bukan IDM atau bisa juga di sebut Internet Download Manager. IDM telah merilis versi terbarunya yang di rilis pada tanggal 29 januari 2013 yaitu <a href="http://otowebsite.blogspot.com/2013/02/idm-615-full-patch.html" target="_blank"><b>IDM 6.15 Full Patch</b></a>, perilisan berbeda dua puluh hari dengan <a href="http://otowebsite.blogspot.com/2013/01/idm-614-build-5-full-patch.html" target="_blank">IDM 6.14 Build 5 Full Patch</a> yang di rilis pada tanggal 9 januari 2013 yang kita bahas kemarin.<br /> <br /> Bagi para pecinta IDM(Internet Download Manager) atau pecinta Download pasti Anda akan sangat membutuhkan <a href="http://otowebsite.blogspot.com/search/label/Download%20Software" target="_blank">softwar</a>e ini, apa lagi <a href="http://otowebsite.blogspot.com/search/label/Download%20Software" target="_blank">software</a> ini berukuran kecil, jika di total IDM 6.15 dan Patch hanya berukuran 4.91 MB.<br /> <br /> <b><a href="http://otowebsite.blogspot.com/" target="_blank">Bagi Anda yang tidak tau kegunaan atau apa itu IDM bisa lihat penjelasannya berikut ini:</a></b><br /> <blockquote class="tr_bq"> Internet Download Manager (IDM) adalah alat untuk meningkatkan kecepatan download sampai 5 kali, melanjutkan dan jadwal mingguan. Comprehensive error recovery dan melanjutkan kemampuan akan restart download rusak atau terputus karena kehilangan koneksi, masalah jaringan, komputer shutdowns, atau listrik padam tak terduga. Antarmuka pengguna grafis sederhana membuat IDM user friendly dan mudah untuk use.Internet Download Manager memiliki logika download accelerator cerdas yang segmentasi file fitur cerdas dinamis dan teknologi download multipart aman untuk mempercepat download Anda. Tidak seperti manajer download lain dan akselerator segmen Internet Download Manager file secara dinamis selama proses download dan menggunakan kembali sambungan tersedia tanpa menghubungkan dan login langkah tambahan untuk mencapai kinerja percepatan terbaik.<br /> Internet Download Manager mendukung proxy server, ftp dan protokol http, firewall, pengalihan, kue, otorisasi, MP3 audio dan pengolahan isi video MPEG. IDM diintegrasikan ke dalam Microsoft Internet Explorer, Netscape, MSN Explorer, AOL, Opera, Mozilla, Mozilla Firefox, Mozilla Firebird, Avant Browser, MyIE2, dan semua browser populer lainnya untuk secara otomatis menangani download Anda. Anda juga dapat drag dan drop file, atau menggunakan Internet Download Manager dari baris perintah. Internet Download Manager dapat dial modem Anda pada waktu yang ditetapkan, download file yang Anda inginkan, kemudian menggantung atau bahkan mematikan komputer Anda ketika selesai. Fitur lainnya termasuk dukungan multibahasa, zip preview, download kategori, scheduler pro, suara di berbagai aktivitas , dukungan HTTPS, prosesor antrian, membantu dan tutorial html, perlindungan virus ditingkatkan di download selesai, download progresif dengan kuota (berguna untuk koneksi yang menggunakan beberapa jenis kebijakan akses yang adil atau FAP seperti Direcway, Direct PC, Hughes, dll), dibangun -in download accelerator, dan banyak lainnya. <a href="http://adf.ly/I03tT" target="_blank">Di kutip oleh IDM</a>.</blockquote> <br /> <b><a href="http://otowebsite.blogspot.com/" target="_blank">Instruksi dari Admin:</a></b><br /> <blockquote class="tr_bq"> Jika Anda berniat mengunduh <a href="http://otowebsite.blogspot.com/search/label/Download%20Software" target="_blank">software</a> atau tool ini <i><a href="https://plus.google.com/u/0/101942472174789798746" target="_blank">saya sarankan</a></i> Anda untuk menghapus intalasi IDM sebelumnya(yang versi lama), karna dari survey IDM akan lambat waktu mendownloadnya jika di Update. Artinya hapus Intasli Sebelumnya secara penuh, lalu Instal IDM yang terbaru tanpa menumpuk IDM yang lama dengan yang baru.</blockquote> <br /> <b>Berikut ini beberapa IDM yang telah atau pernah O.W posting untuk Anda:</b><br /> <a href="http://otowebsite.blogspot.com/2012/12/idm-614-build-3-final-full-patch.html" target="_blank"><b>IDM 6.14 Build 3 Final Full Patch</b></a> <i>(Dirilis 24 Desember 2013)</i><br /> <a href="http://otowebsite.blogspot.com/2013/01/idm-614-build-5-full-patch.html" target="_blank"><b>IDM 6.14 Build 5 Full Patch</b></a> <i>(Dirilis 9 januari 2013)</i><br /> <a href="http://otowebsite.blogspot.com/2013/02/idm-615-full-patch.html" target="_blank"><b>IDM 6.15 Full Patch</b></a> <i>(Dirilis 29 januari 2013)</i><br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> ScreenShot</div> <br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXQ0BD8-dzXQAOqN7JEsDTqPcMl9WsPw4-hoabaHxSVZOs_N5dKRVXoypnmTpAmz3AheqMyOyJDx4X5nmxbLvbWwm60rdcsZg_gXitXa8RTK_Z0IA2PHth8Tze9_E0df7siWWkYO6PAA/s1600/IDM6.15+Full.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXQ0BD8-dzXQAOqN7JEsDTqPcMl9WsPw4-hoabaHxSVZOs_N5dKRVXoypnmTpAmz3AheqMyOyJDx4X5nmxbLvbWwm60rdcsZg_gXitXa8RTK_Z0IA2PHth8Tze9_E0df7siWWkYO6PAA/s1600/IDM6.15+Full.png" /></a></div> <div style="text-align: center;"> <span style="font-size: x-small;">ScreenShot IDM 6.15 Full Patch (gambar oleh <a href="https://plus.google.com/u/0/101942472174789798746" target="_blank">dek_rif</a>)</span></div> <br /> <div class="separator" style="clear: both; text-align: center;"> <a href="http://www.internetdownloadmanager.com/home/idm.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="472" src="http://www.internetdownloadmanager.com/home/idm.png" width="640" /></a></div> <div style="text-align: center;"> <span style="font-size: x-small;">ScreenShot IDM (gambar oleh <a href="http://adf.ly/I03tT" target="_blank">IDM</a>)</span></div> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Apa yang baru di versi 6.15?</div> <br /> <ul> <li>Ditambahkan dukungan untuk script konfigurasi proxy otomatis (digunakan dalam layanan seperti premiumize.me dan lain-lain)</li> <li>Fixed bug kritis dalam modul integrasi IE</li> <li>Terselesaikan masalah dengan men-download situs file sharing beberapa</li> <li>Berubah "Minimalkan ke tray" tombol gaya untuk Windows 8</li> </ul> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> System requirements</div> <br /> Operating systems Windows 7, Windows 2003, Windows Me, Windows 98, Windows 2000, Windows 8, Windows Vista, Windows XP, Windows NT, Windows Server 2008<br /> Additional requirements Not available<br /> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Download IDM 6.14 Build 5 Full Patch</div> <br /> Disini saya telah menyediakan IDM 6.15 Full Patch jadi IDM Anda akan menjadi full, Untuk mengunduh <a href="http://otowebsite.blogspot.com/2013/02/idm-615-full-patch.html">IDM 6.15 Full Patch</a> silahkan Anda tekan tombol di bawah ini. Untuk cara <a href="http://otowebsite.blogspot.com/2013/02/idm-615-full-patch.html">Patch IDM 6.14 Build 5</a> telah saya sediakan caranya di file Path IDM, silahkan baca path yang ada di file tersebut untuk menjadikan <a href="http://otowebsite.blogspot.com/2013/02/idm-615-full-patch.html">IDM 6.15 menjadi Full</a>.<br /> <br /> <br /> <div style="text-align: center;"> <a class="button" href="http://adf.ly/Ik4hH" target="_blank"><b>IDM 6.15 Full Patch</b></a></div>

• 
• 
• 

1. 1
2. 2
3. 3

• Previous
• Next

IDM 6.15 Full Patch

Di artikel kali ini kita akan berbagi sebuah software yang sangat penting untuk mengunduh sebuah file vide, mp3 dan lain sebagainya. Mungkin Anda sudah tau software apa yang akan kita bagikan? di bil…

Baca selengkapnya »

Attractive Css Image Hover Effect Untuk Blogger

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.otowebsite.blogspot.com/" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="237" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-GI6QTXuxW_AIuaxLjDqXDzmiA3Z9UVMkC3Z1PMhcRxcZm1mBrveQy1jD2A3ELbuwxtBlpqXtFkQYvB60e-wbd7OIehoybS06Ui8FI1RB6pavxRrwbPZ_0rh7vOGlZ-kpY5fE92ZGuQ/s320/Attractive+Css+Image+Hover+Effect+Untuk+Blogger.png" width="320" /></a></div> Attractive Css Image Hover Effect Untuk Blogger Adalah salah satu cara terbaik untuk mempercantik tampilan gambar yang ada di blog Anda.Sebelumnya kita juga pernah membahas berbagai effect pada gambar di antaranya <a href="http://otowebsite.blogspot.com/2013/01/membuat-gambar-bergetar-menggunakan.html" target="_blank">Membuat Gambar Bergetar Menggunakan jQuery</a>. Dengan penerapan <a href="http://otowebsite.blogspot.com/2013/02/attractive-css-image-hover-effect-untuk.html">Attractive Css Image Hover Effect Untuk Blogger</a> maka Anda telah membuat gambar Anda menjadi lebih menarik, sehingga Anda dapat menambahkannya di setiap postingan Anda.<br /> <br /> Effect gambar ini sama sekali tidak memberatkan blog atau tidak membuat loading menjadi lama karna kita hanya menggunakan CSS.<br /> Untuk cara menambahkan effect ini pada gambar kita hanya perlu melakukan dua langkah mudah, yaitu menambahkan css pada template dan pada postingan blog kita. Sebelum kita tau cara membuatnya lebih baik kita lihat dulu demo yang telah saya persiapkan untuk Anda di bawah ini agar Anda mengerti effect yang kita maksud. Silahkan arahkan cursor Anda pada gambar, dan lihat effectnya pada gambar tersebut.<br /> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Demo</div> <br /> <style> .OWeffect { -webkit-transition: -webkit-transform .15s linear; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25); -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25); padding: 5px 5px 5px 5px; -webkit-transform: rotate(+2deg); -moz-transform: rotate(+2deg); } .OWeffect:hover { -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5); -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5); -webkit-transform: rotate(-1deg); -moz-transform: rotate(-1deg); } </style><br /> <div class="separator" style="clear: both; text-align: center;"> <a href="http://otowebsite.blogspot.com/2013/02/attractive-css-image-hover-effect-untuk.html"><img class="OWeffect" src="https://code-otowebsite.googlecode.com/svn/trunk/siang-malam.jpg" width="320" /></a></div> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Kode yang di gunakan untuk membuat</div> <br /> Berikut ini adalah kode yang di gunakan untuk membuat effect gambar seperti di atas. Anda dapat merubah kode CSS sesuai keinginan Anda.<br /> <br /> <hr color="#0071bb" /> <a href="http://otowebsite.blogspot.com/2013/02/attractive-css-image-hover-effect-untuk.html"><b><span style="font-size: large;"><span style="color: #0071bb;">CSS</span></span></b><br /> </a><br /> <hr color="#0071bb" /> <br /> <div class="md7"> .OWeffect {<br /> -webkit-transition:  -webkit-transform .15s linear;<br /> -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);<br /> -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);<br /> padding: 5px 5px 5px 5px;<br /> -webkit-transform:  rotate(+2deg);<br /> -moz-transform: rotate(+2deg);<br /> }<br /> .OWeffect:hover {<br /> -webkit-box-shadow:  0 3px 6px rgba(0,0,0,.5);<br /> -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);<br /> -webkit-transform:  rotate(-1deg);<br /> -moz-transform: rotate(-1deg);<br /> }</div> <br /> <hr color="#0071bb" /> <b><span style="font-size: large;"><span style="color: #0071bb;">POST</span></span></b><br /> <hr color="#0071bb" /> <br /> Berikut ini adalah kode untuk memanggil kode CSS di atas. Pada saat membuat atau mengedit postingan letakkan script kode berikut untu memanggail gambar Attractive Css Image Hover Effect.<br /> <br /> <br /> <blockquote class="tr_bq"> <img class="OWeffect"<br /> src="<span style="background-color: #f6b26b;">https://code-otowebsite.googlecode.com/svn/trunk/siang-malam.jpg</span>" /></blockquote> <br /> <hr /> <div style="text-align: center;"> <span style="color: #0071bb;"><a href="http://otowebsite.blogspot.com/2013/02/attractive-css-image-hover-effect-untuk.html"><b>Atau</b></a></span></div> <hr /> <br /> <blockquote class="tr_bq"> <img class="OWeffect"<br /> src="<span style="background-color: #f6b26b;">https://code-otowebsite.googlecode.com/svn/trunk/siang-malam.jpg</span>" width="<span style="background-color: #93c47d;">320</span>" /></blockquote> <br /> <hr /> <div style="text-align: center;"> <span style="color: #0071bb;"><a href="http://otowebsite.blogspot.com/2013/02/attractive-css-image-hover-effect-untuk.html"><b>Atau</b></a></span></div> <hr /> <br /> <blockquote class="tr_bq"> <img class="OWeffect"<br /> src="<span style="background-color: #f6b26b;">https://code-otowebsite.googlecode.com/svn/trunk/siang-malam.jpg</span>" width="<span style="background-color: #93c47d;">320</span>" height="<span style="background-color: #8e7cc3;">230</span>" /></blockquote> <br /> Perhatikan kode yang telah di block di atas, kode tersebut bisa Anda ganti sesuai keinginan Anda.<br /> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Dari Meja Editor!</div> Saya rasa cukup sekian untuk kali ini, jika ada pertanyaan tentang artikel di atas silahkan lemparkan pertanyaan Anda di komentar Saya akan berusaha secepat mungkin untuk membalas dan membantu Anda.

• 
• 
• 

1. 1
2. 2
3. 3

• Previous
• Next

Attractive Css Image Hover Effect Untuk Blogger

Attractive Css Image Hover Effect Untuk Blogger Adalah salah satu cara terbaik untuk mempercantik tampilan gambar yang ada di blog Anda.Sebelumnya kita juga pernah membahas berbagai effect pada gamba…

Baca selengkapnya »

AudioShell Tag Editor File Music

<div class="separator" style="clear: both; text-align: center;"> <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp0mNLe4Q3WJ5_x17Tj5M8l2jKpUDMkciAkEwRq90wLQ6GAZ9bDXdX0KAfqcuy5L8zlO68MM3R2OGoJP-biZho8X4tTiSwcOxbMiXlRthMaDUkfmeP8jA1prmMwBdSODzSbYRzAYiNbw/s1600/audioshel-otowebsite.png" /></a></div> <span class="awal">A</span>udioShell adalah MS freeware Windows Explorer shell extension plugin yang memungkinkan Anda untuk melihat dan mengedit tag file musik secara langsung pada Windows Explorer.<br /> <br /> <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html">AudioShell</a> mendukung semua file dan standar tag didukung oleh Tag & Rename. AudioShell menambahkan tag editor dan tab penampil ke menu file musik properti (Anda dapat mengedit file tag dengan file atau oleh kelompok), file musik petunjuk dengan tag dan informasi file rinci, dan kolom tambahan dalam daftar file Explorer. Ini juga memiliki dukungan Unicode penuh.<br /> <br /> <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html">Inti dari AudioShell</a>: Anda dapatmerubah ataupun mengedit isi dalam file mp3 dan sebagainya, seperti menembahkan Cover album, Title, Album, Comment, Artist dan lain sebagainya.<br /> <br /> <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html"><b>Mendukung file dan format tag:</b></a><br /> <ul> <li><b>mp3</b> (semua versi tag <b>ID3</b>)</li> <li><b>wma</b>, <b>asf </b>dan <b>wmv</b> (termasuk file DRM)</li> <li><b>Apple iTunes</b> dan <b>iPod aac</b> (<b>m4a</b>, <b>M4B</b>, <b>m4v </b>dan <b>m4p</b>) dan file <b>mp4</b></li> <li><b>ogg</b>, <b>flac</b> (<b>vorbis</b> tag komentar)</li> <li><b>mpc</b>, <b>mp</b> + (<b>APE/APEv2</b> tag)</li> <li><b>monkey's audio</b> (<b>APE/APEv2 </b>tags)</li> <li><b>wav pack</b> (<b>APE/APEv2</b> tags)</li> <li><b>optim frog</b> (<b>APE/APEv2</b> tags)</li> <li><b>wav</b> (ID3v2 tag dalam potongan 'tag' RIFF)</li> </ul> <br /> <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html"><b>Bahasa yang terdapat pada AudioShell:</b></a><br /> <ul> <li><b>Cina Sederhana</b></li> <li><b>Ceko</b></li> <li><b>Inggris</b></li> <li><b>Perancis</b></li> <li><b>Jerman</b></li> <li><b>Italia</b></li> <li><b>Polandia</b></li> <li><b>Rusia</b></li> <li><b>Spanyol</b></li> </ul> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> ScreenShot Pengeditan AudioShell</div> <br /> <div class="separator" style="clear: both; text-align: center;"> <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsP3iatN-ZdmWV2d1pQ4bECSDpBFMWHOY94DEcnd3KSuIZbzE7rooIu_RTD7X9G3aQLU8ek06aMRF8bwhyKwH-sDPG3xSZocGnQ6BoqfWd2zSHl5_xMpkeuajShQxnOuqf5a0Fka98cg/s1600/audioshel-edit-otowebsite.png" /></a></div> <div style="text-align: center;"> <span style="font-size: x-small;">(gambar oleh <a href="https://plus.google.com/u/0/101942472174789798746" target="_blank">dek rif</a>)</span></div> <br /> Interface dan penggunaan yang sangatmudah menjadikan <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html">AudioShell</a> alat yang sangat di butuhkan untuk mengedit isi dari File Music, Jika Anda pernah Download sebuah Mp3 dan di Cover Mp3 tersebut terdapat gambar orang lain maka kita dapat dengan mudah merubahnya sesuka hati kita dengan software ini dengan cara klick <b>kanan-properties</b>. software ini juga berukuran sangat kecil yaitu 1.10 MB.<br /> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> ScreenShot Hasil Pengeditan AudioShell dan Pemutaran di Windows Media Player Win 7</div> <br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHBpL-cxmXzeak8dvh87ZZ_TjL73dT45wQ6FIC5u2T33wMEEDsE4zCTPIK1MCH3qq3afRod3a1nd2iAqpWcv2EeysjTDIXpnYGbfPZLbmPCnZIAqypXeIKU8yhL1OHuB5qCU0eZIAdEg/s1600/audioshel-hasil+edit-otowebsite.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHBpL-cxmXzeak8dvh87ZZ_TjL73dT45wQ6FIC5u2T33wMEEDsE4zCTPIK1MCH3qq3afRod3a1nd2iAqpWcv2EeysjTDIXpnYGbfPZLbmPCnZIAqypXeIKU8yhL1OHuB5qCU0eZIAdEg/s1600/audioshel-hasil+edit-otowebsite.png" /></a></div> <div style="text-align: center;"> <span style="font-size: x-small;">(gambar oleh <a href="https://plus.google.com/u/0/101942472174789798746" target="_blank">dek rif</a>)</span></div> <br /> System requirements: AudioShell dirancang untuk Windows 32 bit sistem 2000.<br /> <br /> Jika Anda kurang paham cara menggunakan <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html">AudioShell</a> maka Anda tidak perlu khawatir, karna setelah Anda mengunduh AudioShell maka akan muncul petunjuk cara menggunakannya.<br /> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow"> Unduh AudioShell</div> <br /> Silahkan tekan tombol di bawah ini untuk mengunduh <a href="http://otowebsite.blogspot.com/2013/02/audioshell-tag-editor-file-music.html">AudioShell</a> secara gratis!<br /> <br /> <br /> <div style="text-align: center;"> <a class="button" href="http://adf.ly/IPqtw" target="_blank"><b>Unduh AudioShell</b></a></div> <br />

• 
• 
• 

1. 1
2. 2
3. 3

• Previous
• Next

AudioShell Tag Editor File Music

AudioShell adalah MS freeware Windows Explorer shell extension plugin yang memungkinkan Anda untuk melihat dan mengedit tag file musik secara langsung pada Windows Explorer. AudioShell mendukung semu…

Baca selengkapnya »

Drop Down Menu Bar Mengagumkan Untuk Blogger

<span class="awal">D</span>alam tutorial kali ini kita akan mencoba Update artikel tentang <a href="http://otowebsite.blogspot.com/search/label/Navigation%20Menus" target="_blank">Navigation Menus</a>, Seperti yang pernah saya utarakan pada tutorial terdahulu bahwa jika kita membahas tentang <a href="http://otowebsite.blogspot.com/search/label/Navigation%20Menus" target="_blank">Navigation Menus</a> maka Anda tidak perlu bertanya ada berapa atau total <a href="http://otowebsite.blogspot.com/search/label/Navigation%20Menus" target="_blank">Navigation Menus</a> yang Ada. Karna setiap waktu <a href="http://otowebsite.blogspot.com/search/label/Navigation%20Menus" target="_blank">Navigation Menus</a> ini dapat kita buat sendiri dengan keahlian kita. Di tutorial atau artikel kali ini kita membahas <a href="http://otowebsite.blogspot.com/search/label/Navigation%20Menus" target="_blank">Navigation Menus</a> yang saya beri nama Drop Down Menu Bar Mengagumkan Untuk Blogger. Mungkin judul ini kurang cocok bagi Anda, tapi ini hanyalah sebuah nama, apalah arti sebuah nama yang penting fungsinya. Untuk tempilan Drop Down Menu Bar Mengagumkan Untuk Blogger yang kita bahas kali ini adalah seperti ini:<br /> <br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow">ScreenShot</div><br /> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZLWPTFRo9WkqzzJshNUsCa1jPqZZmafBir2QevAt6jerZYYahaQaNzbR9AbKcNnfmtuR-znJwkcF0BGoj8iOqh4N1Q0hVJIaFB5C52CI6_13n3eUsTPbN0iZafzom1L07u_XRxim2lQ/s1600/Drop+Down+Menu+Bar+Mengagumkan+Untuk+Blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="350" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZLWPTFRo9WkqzzJshNUsCa1jPqZZmafBir2QevAt6jerZYYahaQaNzbR9AbKcNnfmtuR-znJwkcF0BGoj8iOqh4N1Q0hVJIaFB5C52CI6_13n3eUsTPbN0iZafzom1L07u_XRxim2lQ/s1600/Drop+Down+Menu+Bar+Mengagumkan+Untuk+Blogger.png" width="640" /></a></div><div style="text-align: center;"><span style="font-size: x-small;">(gambar oleh <a href="https://plus.google.com/u/0/101942472174789798746" target="_blank">dek rif</a>)</span></div><br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow">Lihat Demo</div><br /> <div style="text-align: center;"><a class="button" href="http://otowebsite.16mb.com/Menu%20Bar%20Mengagumkan.html" target="_blank"><b>Demo</b></a></div><br /> <style> .ow{ font-size:20px; padding:5px; font-family:consolas; color:#ffffff; text:1px 1px 1px #333; background:#3e81c4; border-left:20px solid #aa0000; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 1px 1px 2px #ccc; -webkit-box-shadow: 1px 1px 2px #ccc; box-shadow: 1px 1px 2px #333; margin: 10px 0; text-transform: capitalize; width: 94%; line-height:1; </style><br /> <div class="YOUR HEADLINE CLASS i.e ow">Kode Yang Digunakan</div><br /> <hr color="#0071bb" /><b><span style="font-size: large;"><span style="color: #0071bb;">HTML/JavaScript</span></span></b><br /> <hr color="#0071bb" /><br /> <blockquote class="tr_bq"><script src='https://code-otowebsite.googlecode.com/svn/trunk/awesome menu.js' type='text/javascript'></script><br /> <style><br /> #OWmenu *{<br /> margin:0px; padding:0px; list-style-type:none; text-decoration:none}<br /> div#OWmenu{position:relative}<br /> #OWmenu ul.OWmenu{ white-space:nowrap}#OWmenu ul.OWmenu li{ display:inline-block; height:57px; position:relative}#OWmenu ul.OWmenu li div{ position:absolute; top:55px; left:0px}#OWmenu ul.OWmenu li div div{ position:absolute; top:-6px; left:176px}#OWmenu ul.OWmenu li div ul li{ display:block; float:none; width:auto; height:auto}#OWmenu ul.OWmenu li a{  padding-left:15px;  background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9-qVWe2hggpF9lFYw3iD851rW-nR7DH8g8A6iMGwehShdlgM_9ZoUXzVdZfuoXXpU2oawinUvXvXSjzrljG1WZEvaBpHnhOzZrcP7Y81ddhVGM0Fgay6V8YYYsopR4XFhxxxHe6i6z1x8/s1600/menu_level1_item.png");  background-repeat:no-repeat;  background-position:left -1000px;  display:inline-block;  margin:6px 2px}#OWmenu ul.OWmenu li a span{  padding-right:15px;  padding-left:0px;  background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9-qVWe2hggpF9lFYw3iD851rW-nR7DH8g8A6iMGwehShdlgM_9ZoUXzVdZfuoXXpU2oawinUvXvXSjzrljG1WZEvaBpHnhOzZrcP7Y81ddhVGM0Fgay6V8YYYsopR4XFhxxxHe6i6z1x8/s1600/menu_level1_item.png"); background-repeat:no-repeat; background-position:right -1000px; display:inline-block; height:40px; line-height:40px; cursor:pointer}#OWmenu ul.OWmenu li:hover a{ background-position:left -90px}#OWmenu ul.OWmenu li:hover a span{ background-position:right -135px}#OWmenu ul.OWmenu li.active a{ background-position:left 0px}#OWmenu ul.OWmenu li.active a span{ background-position:right -45px}#OWmenu ul.OWmenu li div ul li a{ display:block; padding:0px; margin:0px; background:none}#OWmenu ul.OWmenu li div ul li a span{ display:block; padding:0px; background:none; height:auto; line-height:25px; padding:10px 0 10px 12px; white-space:normal}#OWmenu ul.OWmenu li div{  width:194px;  padding-top:6px;  background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdGEOkgay42Ssl00tg3x3SRDytzY0ojFVvRd-l4l3wNzvpmpMmfrurtOp9f6JvjuLo0SQqN7DVyYtRNXi-SprQxUoHgfalvQ_QJUP3dlMdMJQeBh8kgodIot2rm5-r0P9e1GUYV5MV4CRl/s1600/submenu-top.png");  background-repeat:no-repeat;  background-position:0px top}#OWmenu ul.OWmenu li div ul{  padding:9px;  padding-top:0;  background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIinJt9oNWULXL8pdDLr1Qr3VkPv2xPlb_GFPxZtB8YcSZpH-1SycnbfnvnasrvQVcBBICcVkVi4t_OYLTwBi7dnTU_3ROob5xxUaumjgtcNxe6r7N6IBPQbXsmTDRHmMDZbPmw6eM67D-/s1600/submenu-bottom.png"); background-repeat:no-repeat; background-position:0px bottom}#OWmenu ul.OWmenu ul li:hover{  background-repeat:repeat-x;  background-position:0% 100%;  background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiehds1MrZZHk_DIUla5Fmq8bzEC7M5ddpC1mRsUYOoNn8_0F84IxQEOqhih3kRaw83S6sJcxBrMxRs5gQvfsmu4mK_FxzZGVV5EMjZjd_M23Lo9dLpPpBoa4-mac1U0c15POkYUUtLD_sn/s1600/menu_level2_item_hover.png)}#OWmenu ul.OWmenu ul li:hover>a{  background-repeat:repeat-x;  background-position:0% 0%;  background-color:transparent;  background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiehds1MrZZHk_DIUla5Fmq8bzEC7M5ddpC1mRsUYOoNn8_0F84IxQEOqhih3kRaw83S6sJcxBrMxRs5gQvfsmu4mK_FxzZGVV5EMjZjd_M23Lo9dLpPpBoa4-mac1U0c15POkYUUtLD_sn/s1600/menu_level2_item_hover.png)}<br /> #OWmenu{  height:57px;  padding-left:14px;  background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib3TZkYYKIk2Z9rJVDPU1yU1EZXLKMMCHefu2uzhca9A1tWhUA2-cnC5k1t7MDabZv4kdHGsq4hrceTsPivRJU7h9IuapsJHSw9CHNUT3x1c1xrha0e-mwdGYmDmA0TRERR80r_YHC2z38/s1600/page_header_b.png) repeat-x;<br /> -webkit-border-radius: 20px;-khtml-border-radius: 10px; -moz-border-radius: 20px;border-radius: 10px;}<br /> #OWmenu span{ color:#edf0f1; text-shadow:0 -1px 1px #000}#OWmenu li:hover>a>span { color:#fff; text-shadow:0 1px 1px #000,0 2px 10px #969696}#OWmenu ul.OWmenu li a span{ font-family:Arial; font-size:18px; font-weight:400}#OWmenu ul.OWmenu li div ul li a span{ font-family:Arial; font-size:15px; font-weight:400}#OWmenu ul.OWmenu li div ul{ padding-bottom:8px}#OWmenu ul.OWmenu li div ul li:first-child{ border-top-width:0px}#OWmenu li>div{visibility:hidden}#OWmenu li:hover>div{visibility:visible}/* */#OWmenu ul.OWmenu ul li:hover{ background-color:#393c45}#OWmenu ul.OWmenu li div ul li{ border-bottom:1px solid #70757b; border-top:1px solid #31363b}/* ie7 */#OWmenu ul.OWmenu li{ *zoom:1; *display:inline}#OWmenu ul.OWmenu li a{ *zoom:1; *display:inline}#OWmenu ul.OWmenu li a span{ *zoom:1; *display:inline}#OWmenu ul.OWmenu li div ul li a{ *display:inline}#OWmenu ul.OWmenu ul li:hover{ *background-image:none}#OWmenu ul.OWmenu ul li:hover>a{ *background-image:none}/* IE6 */#OWmenu ul.OWmenu li a{  _background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEital45-OCWPtdf39qckraPm1UxpcDVIvohZbCSzv_TKhx5NLwu1obFVC3tv8zXcXgO192dWytdN7gahWclJJ4CZtylrxrTlpSySGY9rFSKTk_X-Vyy7C1UtzFzfqbTJH8SvyvX2LFHR4od/s1600/menu_level1_item.gif")}#OWmenu ul.OWmenu li a span{  _background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEital45-OCWPtdf39qckraPm1UxpcDVIvohZbCSzv_TKhx5NLwu1obFVC3tv8zXcXgO192dWytdN7gahWclJJ4CZtylrxrTlpSySGY9rFSKTk_X-Vyy7C1UtzFzfqbTJH8SvyvX2LFHR4od/s1600/menu_level1_item.gif")}#OWmenu ul.OWmenu li div{  _background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjs0n6nzEHo4-IYfkcSpp9GjWuZKhUTc7KA0VcnwZ0_qFk3fyqZMSkTXy6foKZVkhVHGSXlu6GAn5es-n13kDij1yaFIH-xrZeLYTnyL2noUovDG4ebAeQ5nw9dUtTnwyiwupMT1SZ5_-42/s1600/submenu-top.gif");z-index:10}#OWmenu ul.OWmenu li div ul{  _background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9QqsjK3C6CmCer_BA2Jne-doFpNDhwysqdLDVfGo2fii64BkrqVaaRyBzB8tEn-Npq3c-oR9zfYpHnUe5P-xOfYsyPzsOq6YvVqnO3yjlrcqwKmS0YOWZiqt-XRu4cuWJTgfABF4VZC9-/s1600/submenu-bottom.gif")}#OWmenu ul.OWmenu li a:hover{ _background-position:left -90px}#OWmenu ul.OWmenu li a:hover span{ _background-position:right -135px}#OWmenu div{_display:none}#OWmenu div li:hover div{_display:block}#OWmenu div li:hover li:hover div{_display:block}#OWmenu div li:hover li:hover li:hover div{_display:block}/* */<br /> </style><br /> <br /> <div id="OWmenu"><br />     <ul class="OWmenu"><br />         <li><a href="#" class="parent"><span>LINK 1</span></a><br />         </li><br />         <li><a href="#" class="parent"><span>LINK 2</span></a><br />             <div><ul><br />             <li><a href="#" class="parent"><span>ITEM 1</span></a><br />                     <div><ul><br />                       <li><a href="#"><span>ITEM 1.1</span></a><br />                        <div><ul><br />                         <li><a href="#"><span>ITEM 1.1.1</span></a></li><br />                         <li><a href="#"><span>ITEM 1.1.2</span></a></li><br />                         <li><a href="#"><span>ITEM 1.1.3</span></a></li><br />                         <li><a href="#"><span>ITEM 1.1.4</span></a></li><br />                        </ul></div><br />                        </li><br />  <li><a href="#"><span>ITEM 1.2</span></a></li>                                        <li><a href="#"><span>ITEM 1.3</span></a></li><br />                         <li><a href="#"><span>ITEM 1.4</span></a></li><br />                         <li><a href="#"><span>ITEM 1.5</span></a></li><br />                         <li><a href="#"><span>ITEM 1.6</span></a></li><br />                                         <li><a href="#"><span>ITEM 1.7</span></a></li><br />                         <li><a href="#"><span>ITEM 1.8</span></a></li><br />                         <li><a href="#"><span>ITEM 1.9</span></a></li><br />                    </ul></div><br />                 </li><br />                 <li><a href="#" class="parent"><span>ITEM 2</span></a><br />                 </li><br />  <li><a href="#" class="parent"><span>ITEM 3</span></a><br />                 </li><br />  <li><a href="#" class="parent"><span>ITEM 4</span></a><br />                 </li><br />              </ul></div><br />         </li>           <br />     <li><a href="#" class="parent"><span>LINK 3</span></a></li><br /> <li><a href="#" class="parent"><span>LINK 4</span></a></li><br />     <li><a href="#"><span>LINK 5</span><br />         <li class="last"><a href="#"><span>LINK 6</span></a></li><br /> <br /> <li class="last"><a href="#"><span>LINK 7</span></a></li></a></li><br /> <br /> <li class="last"><a href="http://www.otowebsite.blogspot.com/"><span>Oto Website</span></a></li><br /> </ul><br /> </div></blockquote><br />

• 
• 
• 
• 
• 

1. 1
2. 2
3. 3
4. 4
5. 5

• Previous
• Next

Drop Down Menu Bar Mengagumkan Untuk Blogger

Dalam tutorial kali ini kita akan mencoba Update artikel tentang Navigation Menus, Seperti yang pernah saya utarakan pada tutorial terdahulu bahwa jika kita membahas tentang Navigation Menus maka Anda…

Baca selengkapnya »