Membuat Follower Box Twitter

Membuat Follower Box Twitter ~ Twitter Follower Box atau Twitter Fun Box memungkinkan pengunjung untuk mengikuti anda via Twitter tanpa meninggalkan situs atau blog anda. Twitter Follower Box sangat mirip sekali dengan facebook like box dan sistem kerjanya pun tidak jauh berbeda.

Jika Twitter follower default dari Twitter tidak menampilkan gambar follower, lain halnya dengan widget Twitter follower box yang dapat menampilkan gambar atau foto profil dari follower Twitter blog kita.

Nah yg ingin membuat Twitter Follower Box di blognya silahkan mengikuti langkah langkah berikut ini:
1. Login ke Blogger
2. Tambah gadget kemudian pilih HTML/Javascript
3. Masukan kode berikut ini di dalamnya

<!-- Twitter Follower Box -->
<script type='text/javascript'>
function fanbox_init(screen_name){document.getElementById('twitterfanbox').innerHTML='\<iframe name=\"fbfanIFrame_0\" frameborder=\"0\" allowtransparency=\"true\" src=\"http://s.moopz.com/connect.html?user='+screen_name+'\" class=\"FB_SERVER_IFRAME\" scrolling=\"no\" style=\"width: 295px; height: 250px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; \"\>\<\/iframe\>';}
</script>
<div id="twitterfanbox"></div><script
type="text/javascript">fanbox_init("mainbom");</script
type="text>
<!-- End Twitter Follower Box -->

4. Ganti mainbom dengan username Twitter kamu.
5. Simpan dan selesai

hasilnya akan seperti di bawah ini:

Note: Ubah nilai width dan height sesuai keinginan Anda.

Demikian cara membuat follower box Twitter semoga bermanfaat.

Read More

Video Cara Menghapus Tulisan atau Gambar Yang Tidak Diinginkan Pada Sebuah Logo Menggunakan Photoshop CS5

Video Cara Menghapus Tulisan atau Gambar Yang Tidak Diinginkan Pada Sebuah Logo Menggunakan Photoshop CS5. Ketika kita melihat logo dari blog orang lain yang terlihat bagus, mungkin kita ingin menjiplak atau membuat logo yang mirip seperti itu tetapi kita tidak tahu cara membuatnya, alternatifnya adalah menjiplak logo tersebut, namun sebuah logo biasanya memiliki teks nama blog tersebut dan tentunya kita ingin menghapusnya. Bagaimana cara menghapusnya? Akan Saya jelaskan di dalam video tutorial di bawah ini.

Pada kesempatan kali ini saya akan memberikan tutorial kepada Anda tentang bagaimana cara menghapus tulisan, teks, atau gambar yang tidak diinginkan pada sebuah logo atau gambar, tetapi tidak menghapus background dari gambar itu sendiri. Dimana tutorial kali ini agak sedikit berbeda karena saya menggunakan video sebagai media agar terlihat sedikit keren dan mudah dipahami, wkwkwk...

Dalam video ini Saya menggunakan Adobe Photoshop CS5 untuk menghapus tulisan yang tidak saya inginkan pada sebuah gambar dan menggunakan dua tool pada Photoshop yaitu Content-Aware dan Spot Healing Brush Tool. Untuk Photoshop CS3 dan CS4 kemungkinan bisa juga menggunakan cara ini.

Silahkan disimak tutorial Video Cara Menghapus Tulisan atau Gambar Yang Tidak Diinginkan Pada Sebuah Logo atau Foto Menggunakan Photoshop CS5. Jika ada pertanyaan silahkan komen di kotak komentar.

http://youtu.be/h5v_YwxveL0

Read More

Membuat Widget Tombol Share Mengambang di Halaman Postingan

Widget tombol berbagi yang mengambang di blog semakin populer akhir-akhir ini. Kali ini saya akan berbagi tutorial cara membuat tombol berbagi yang mengambang disebelah kiri postingan. Widget ditampilkan di halaman posting saja dan tidak akan ditampilkan pada homepage. Versi ini berbeda dengan yang lain karena menerapkan dua efek yaitu Jquery dan CSS3. Menggunakan tombol Twitter yang telah dimodifikasi, ditambah dengan tombol Pinterest, AddThis dan tombol Email serta tombol wajib Facebook dan Google Plus.

Langkah-langkah yang dilakukan sangat mudah, cukup dengan Copy-Paste.
1. Login ke Blogger -> Template
2. Backup template Anda untuk mencegah hal-hal yang tidak diinginkan
3. Edit HTML -> Centang Expand Template Widget
4. Cari kode:

<b:includable id='post' var='post'>

5. Tepat dibawahnya paste kode berikut:

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    <style>
    .mbt_social_floating{
        position:fixed; bottom:10%; margin-left:-60px; float:left;
        width:60px;
        background-color:#f7f7f7;
        padding: 5px 0 0px 0px;
        border-top:1px solid #ddd;
    border-left:1px solid #ddd;
    border-bottom:1px solid #ddd;
    z-index:9999px !important;
    border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;
    }
    .mbt_social_floating .mbt_side_social_button{
        margin-bottom:5px;
        float:none;
        height:auto;
        width:60px;
    }
    .mbt_social_floating .st_twitter_vcount, .mbt_social_floating.st_plusone_vcount, .st_email{
        margin-left:5px;
    }
    .mbt_social_floating .st_fblike_vcount{
        margin-left:5px;
    }
    .mbt_social_floating .stButton_gradient{
        background:none !important;
        height:21px !important;
        padding-left:0 !important;
    }
    .mbt_social_floating .chicklets, .mbt_social_floating .stMainServices {
        background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDACyrBQuJ35zWxvLnQ1Elbp28ZOzwlNDWZK9hpKnCd_JT1T5utiUYVp8tSilOayjWx9sqtN0BLUdxuPjpI2HAcfJrEHh2m8-N4DdfCbYodKd4w-WX-W40shJKHOcZog6tUG1cy5uiWrU/s400/gc_social_sprite.gif&#39;) no-repeat !important;
        height:19px !important;
        width:45px !important;
        padding:0 !important;
    }
    .st_email .chicklets{
        background-position:0 -77px !important;
        background-image:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDACyrBQuJ35zWxvLnQ1Elbp28ZOzwlNDWZK9hpKnCd_JT1T5utiUYVp8tSilOayjWx9sqtN0BLUdxuPjpI2HAcfJrEHh2m8-N4DdfCbYodKd4w-WX-W40shJKHOcZog6tUG1cy5uiWrU/s400/gc_social_sprite.gif&#39;) !important;
    }
    .mbt_social_floating .st_twitter_vcount .st-twitter-counter{
        background-position:0 -58px !important;
    }
    .mbt_social_floating  .stButton_gradient{
        border:none !important;
    }
    .mbt_social_floating .stBubble_count{
        width:44px !important;
        font-size: 15px !important;
        font-weight: normal !important;
        padding-top:7px !important;
        height:23px !important;
        background:none !important;
    }
    .mbt_social_floating .st_twitter_vcount .stBubble_count{
        color:#00a6df;
        background-color:#f8fbfc !important;
    }
    .st_fblike_vcount{
        margin-bottom: 0px;
        display: block;
    }
    .st_twitter_vcount{
        margin-bottom: 3px;
        display: block;
    }
    .st_email{
        margin-bottom: 5px; margin-top: 3px;
        display: block;
    }
    .mbt_social_floating .stBubble{
        background-position: 21px 31px !important;
        height:35px !important;
    }
    </style>
    <div class='mbt_social_floating'>
        <script type='text/javascript'>var switchTo5x=true;</script>
        <script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
        <script type='text/javascript'>stLight.options({onhover:false});</script>
        <span class='st_fblike_vcount' displaytext=''/>
        <span class='st_twitter_vcount' displaytext='' st_via='mainbom'/>
    <div style='margin:5px 0 0px 0;'>
    <center><a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
    <a href='javascript:void(run_pinmarklet())' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/>
    <script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
    <script type='text/javascript'>
    function run_pinmarklet() {
    var e=document.createElement(&#39;script&#39;);
    e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);
    e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);
    e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);
    document.body.appendChild(e);
    }
    </script> </center>
    </div>
    <div style='margin:0px 0 0 5px;'>
        <span class='st_plusone_vcount' displaytext=''/>
    </div>      
    <div class='addthis_toolbox addthis_default_style ' style='margin:5px 0px 5px 8px;'>
    <a class='addthis_counter'/>
    </div>
    <script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>
    <script type='text/javascript'>
    var addthis_config = {
         ui_cobrand: &quot;MainBom.Com&quot;,
    ui_header_color: &quot;#ffffff&quot;,
         ui_header_background: &quot;#0080FF&quot;
    }
    </script>
    <span class='st_email' displaytext=''/>
    </div>
    </b:if></b:if>

6. Ganti mainbom dengan username Twitter Anda
7. Save template, selesai.

Sesuaikan letak widget dengan Template Anda.

Read More

Cara Upload dan Backup Template Versi Blogger Terbaru

Terkadang kita di buat bingung dengan tampilan versi Blogger yang terbaru, untuk upload dan backup template saja kita masih bingung karena belum terbiasa dengan tampilan Blogger yang baru ini.
Sebenarnya tampilan Blogger yang baru tidak sesulit yang kita bayangkan, bahkan jika sudah terbiasa akan lebih terasa nyaman menggunakan tampilan Blogger baru daripada yang lawas, karena tampilan Blogger baru memiliki beberapa kelebihan yang tidak dimiliki Blogger lama.

Silahkan ikuti langkah-langkah untuk Upload dan Backup Template versi Blogger terbaru

1. Login ke Blogger
2. Pilih judul Blog yang akan di backup

3. Klik Template

4. Pilih Cadangkan / Pulihkan

5. Klik Unduh template lengkap untuk membackup template anda atau klik Telusuri untuk meng-upload template anda yang baru.

Mudah bukan? Jika ada pertanyaan silahkan komentar..

Read More

Video Cara Membuat Aplikasi Portable Menggunakan WinRar

Setelah lama gak posting, hari ini Saya akan memberikan tutorial video cara membuat aplikasi portable dengan menggunakan WinRar. Aplikasi portable adalah sebuah aplikasi yang dapat langsung dijalankan tanpa harus menginstalnya terlebih dahulu ke dalam laptop atau PC. Dalam video ini saya memilih IDM atau Internet Download Manager sebagai bahan yang akan dibuat menjadi portable.
Kebanyakan Software atau aplikasi dapat dijadikan portable meggunakan WinRar dengan cara ini. Dan ini juga dapat digunakan untuk menyembunyikan file Dll kedalam injector. Cara inilah yang saya gunakan untuk meng-pack file Dll dan Injector menjadi sebuah file exe.
Sebelum melanjutkan sebaiknya siapkan dulu tools yang akan digunakan:
1. WinRar, Sebagai Packer
2. IDM Installer, Bisa juga aplikasi yang lain yang akan dijadikan portable
3. IcoFXPortable, Sebagai alat untuk mengekstrak atau membuat icon IDM.

Silahkan di simak video tutorialnya :D

Source Video: http://www.youtube.com/watch?v=XUKCy04-OJ0

Jika ada yang belum jelas silahkan tinggalkan komentar, tentunya dengan bahasa yang sopan, hehe...

Read More

Pasang Emoticon Kaskus dan Adsense-ID Pada Blogger Yang Menggunakan Thread Comment - Terbaru

Sebelumnya Saya pernah membuat tutorial tentang Cara Pasang Emoticon Kaskus dan Adsense-ID pada komentar blog, dan ternyata cara itu tidak dapat diterapkan jika sobat blogger menggunakan Thread Comment atau fitur reply comment pada komentar blognya. Nah sekarang saya akan membahas tentang Cara Membuat Emoticon Kaskus dan Adsense-ID pada blog yang menggunakan thread comment atau fitur comment reply.

Agar lebih aman, sebaiknya simpan dulu template anda dengan mengklik Download Template Lengkap.
Ikuti langkah berikut ini:
1. Login ke Dasbor Anda >> Edit HTML
2. Jangan lupa centang Expand Template Widget
3. Cari kode penutup </body>
4. Simpan kode ini di atas </body>

<!-- emoticon  mainbom.com -->
<script type='text/javascript'>
//<![CDATA[
a = document.getElementById('comment-holder');
if(a) {
b = a.getElementsByTagName("p");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'comment-content') {
_str = b.item(i).innerHTML.replace(/:a:/gi, "<img src='http://i.imgur.com/Jnwl1.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:b:/gi, "<img src='http://i.imgur.com/h9NDs.gif' class='smiley'/>");
_str = _str.replace(/:c:/gi, "<img src='http://i.imgur.com/IL1IB.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:d:/gi, "<img src='http://i.imgur.com/k3Fdh.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:e:/gi, "<img src='http://i.imgur.com/ZDlSF.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:f:/gi, "<img src='http://i.imgur.com/OXalA.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:g:/gi, "<img src='http://i.imgur.com/cnARR.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:h:/gi, "<img src='http://i.imgur.com/WTmJr.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:i:/gi, "<img src='http://i.imgur.com/kenHK.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:j:/gi, "<img src='http://i.imgur.com/aDJrj.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:k:/gi, "<img src='http://i.imgur.com/E5qba.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:l:/gi, "<img src='http://i.imgur.com/w3vTW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:m:/gi, "<img src='http://i.imgur.com/0WFG2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:n:/gi, "<img src='http://i.imgur.com/bkfG8.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:o:/gi, "<img src='http://i.imgur.com/zvteN.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:p:/gi, "<img src='http://i.imgur.com/xkzm0.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:q:/gi, "<img src='http://i.imgur.com/UqDiW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:r:/gi, "<img src='http://i.imgur.com/5uihz.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:s:/gi, "<img src='http://i.imgur.com/5O9L2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:t:/gi, "<img src='http://i.imgur.com/7RDAt.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:u:/gi, "<img src='http://i.imgur.com/WmQPn.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:v:/gi, "<img src='http://i.imgur.com/9C3hy.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:w:/gi, "<img src='http://i.imgur.com/fFhYI.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:x:/gi, "<img src='http://i.imgur.com/e50uc.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:y:/gi, "<img src='http://i.imgur.com/RjY5y.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:z:/gi, "<img src='http://i.imgur.com/lrZEF.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:ab:/gi, "<img src='http://i.imgur.com/KJbrk.gif' alt='' width='40' class='smiley'/>");
b.item(i).innerHTML = _str;
}}}
//]]>
</script>

5. Kemudian cari lagi kode:

<div class='post-footer-line post-footer-line-3'/>
</div>
</div>
</div>

6. Dan pasang kode berikut ini di bawah  </div> yang terakhir

<!-- emoticon  mainbom.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='text-align:center; font-weight:bold; margin-top:15px; margin-bottom:10px;'>
Untuk menggunakan emoticon ini, COPAS kode ke kotak komentar.
</div>
<b><img src='http://i.imgur.com/4a2GG.gif' width='40'/>
:a:
<img src='http://i.imgur.com/Jnwl1.gif' width='40'/>
:b:
<img src='http://i.imgur.com/h9NDs.gif' width='40'/>
:c:
<img src='http://i.imgur.com/IL1IB.gif' width='40'/>
:d:
<img src='http://i.imgur.com/k3Fdh.gif' width='40'/>
:e:
<img src='http://i.imgur.com/ZDlSF.gif' width='40'/>
:f:
<img src='http://i.imgur.com/OXalA.gif' width='40'/>
:g:
<img src='http://i.imgur.com/cnARR.gif' width='40'/>
:h:
<img src='http://i.imgur.com/WTmJr.gif' width='40'/>
:i:
<br/>
<img src='http://i.imgur.com/kenHK.gif' width='40'/>
:j:
<img src='http://i.imgur.com/aDJrj.gif' width='40'/>
:k:
<img src='http://i.imgur.com/E5qba.gif' width='40'/>
:l:
<img src='http://i.imgur.com/w3vTW.gif' width='40'/>
:m:
<img src='http://i.imgur.com/0WFG2.gif' width='40'/>
:n:
<img src='http://i.imgur.com/bkfG8.gif' width='40'/>
:o:
<img src='http://i.imgur.com/zvteN.gif' width='40'/>
:p:
<img src='http://i.imgur.com/xkzm0.gif' width='40'/>
:q:
<img src='http://i.imgur.com/UqDiW.gif' width='40'/>
:r:
<br/>
<img src='http://i.imgur.com/5uihz.gif' width='40'/>
:s:
<img src='http://i.imgur.com/5O9L2.gif' width='40'/>
:t:
<img src='http://i.imgur.com/7RDAt.gif' width='40'/>
:u:
<img src='http://i.imgur.com/WmQPn.gif' width='40'/>
:v:
<img src='http://i.imgur.com/9C3hy.gif' width='40'/>
:w:
<img src='http://i.imgur.com/fFhYI.gif' width='40'/>
:x:
<img src='http://i.imgur.com/e50uc.gif' width='40'/>
:y:
<img src='http://i.imgur.com/RjY5y.gif' width='40'/>
:z:
<img src='http://i.imgur.com/lrZEF.gif' width='40'/>
:ab:
<br/>
</b>
</b:if>

7. Save Template dan lihat hasilnya.

Hasilnya akan terlihat seperti ini:

Jika tidak berhasil dan Anda memiliki pertanyaan, silahkan tinggalkan komentar Anda.
Sekian, semoga bermanfaat...

Read More

Cara Pasang Tombol Google Plus

Tombol Google+, "+1" atau Google Plus adalah alat berbagi konten yang dapat ditemui di berbagai artikel, foto, video, dan berbagai konten lain untuk digunakan pengguna berbagi informasi dengan rekan-rekan jejaring sosial.
Tombol google plus 1 sama halnya dengan tombol "Like" Facebook atau Tombol "Tweet" milik Twitter. Agar konten banyak diakses atau dibaca pengguna Internet sebaiknya anda juga memasang Tombol Google +1 tersebut di blog atau website anda. Eits jangan meremehkan tombol ini, tombol Google Plus juga berpotensi meningkatkan peringkat pencarian di Google loh..

Untuk memasang tombol Google +1 ikuti langkah berikut ini:
1. Login ke Blogger Dasbor > Rancangan > Edit HTML
2. Pasang kode di bawah ini, tepat di atas tag </head>

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>

3. Kemudian letakkan kode berikut ini di tempat yang ingin dipasangi Tombol +1

<g:plusone size="medium" annotation="bubble"></g:plusone>

4. Save Template Anda.

Note:
medium adalah ukuran tombol +1
bubble adalah tampilan tombol +1
Silahkan ganti sesuai dengan selera anda:
small - none         :
small - bubble      :
small - inline         :
medium - none     :
medium - bubble  :
medium - inline     :
standard - none    :
standard - bubble :
standar - inline      :

Tambahan: jika ingin menentukan URL yang ingin di beri +1, ganti kode <g:plusone size="medium" annotation="bubble"></g:plusone> dengan kode di bawah ini:

<g:plusone size="medium" annotation="bubble" href="http://URL yang di inginkan.com"></g:plusone>

Read More

Mengatasi Tampilan "Elemen Laman" Yang Error

Pernah kah anda mendapatkan tampilan "Element Laman" pada tab rancangan di akun blogger anda hanya satu kolom saja? sedangkan blog anda memiliki dua atau tiga kolom. Jika jawabannya YA, berarti anda tidak salah mengunjungi blog ini, hehehe...
Contoh tampilan Elemen Laman yang error seperti gambar di bawah ini:

Jika blog anda memiliki dua kolom, seharusnya pada tampilan Element Laman juga memiliki dua kolom dan penempatan widgetnya yang sama seperti pada blog anda juga. Apabila anda menemukan tampilan Elemen Laman seperti gambar di atas, maka lakukan langkah-langkah berikut ini untuk mengatasinya:

1. Login ke Blogger >> Rancangan >> Edit HTML
2. Copy code dibawah ini:

body#layout ul{list-style-type:none;list-style:none}
body#layout ul li{list-style-type:none;list-style:none}
body#layout #outer-wrapper{overflow:visible;width:1000px}
body#layout #header{float:left;width:240px}
body#layout #header2{float:right;width:240px}
body#layout .add_widget{width:240px}
body#layout div.widget{width:240px}
body#layout #sidebar-wrapper{overflow:visible;width:240px}
body#layout #lsidebar-wrapper{overflow:visible;float:left;width:240px;margin-right:50px;}
body#layout #main-wrapper{overflow:visible;float:left;width:240px}
body#layout #rsidebar-wrapper{overflow:visible;float:right;width:240px}
body#layout #myGallery{display:none}
body#layout .featuredposts{display:none}
body#layout .fp-slider{display:none}
body#layout #navcontainer{display:none}
body#layout .menu-secondary-wrap{display:none}
body#layout .menu-secondary-container{display:none}
body#layout #skiplinks{display:none}
body#layout .feedtwitter{display:none}
body#layout div.section{font-family:sans-serif;margin:0 auto 2px;padding:0 0 10px 0;position:relative;overflow:visible}
body#layout .section-columns{margin:0}
.section{width:100%}

3. Cari Variable definitions atau lihat contoh gambar di bawah, dan tempatkan kode tadi di atas Variable definitions. Lihat gambar:

4. Save Template dan lihat tampilan Elemen Laman anda.

Sekarang anda dapat mengidentifikasi tampilan Elemen Laman anda dengan jelas.

Read More

Mengubah File Mp3 Menjadi File Swf

Kemarin saya telah memberikan tutorial Cara Pasang Lagu di Blog, dimana tutorial tersebut menggunakan lagu yang sudah di konvert ke file Swf. Karena ada sobat blogger yang bertanya bagaimana cara konversi file Mp3 menjadi Swf dan kebetulan saya memiliki waktu luang, maka hari ini saya memberikan tutorial cara Mengubah File Mp3 menjadi File Swf.

Tool yang dibutuhkan:

• Daniusoft Video Converter Ultimate. Kalau belum punya, silahkan download disini

Ikuti langkah berikut ini:

1. Siapkan lagu Mp3 yang akan di konversi
2. Buka Daniusoft Video Converter Ultimate
3. Klik File >> Add Files >> Pilih lagu yang mau di konvert

4. Ganti profile dengan cara: Klik pilihan Profile >> Online Video >> Pilih SWF

5. Klik Convert dan tunggu sampai prosesnya selesai 100%

6. Klik Find Target untuk menemukan hasil konversi kita tadi
7. Selesai.

Mudah bukan? Silahkan mencoba sendiri, semoga bermanfaat...

Read More

Script Open New Tab Eksternal Link

Script dibawah adalah script untuk membuat open new tab apabila pengunjung mengklik link external atau link diluar dari domain kita. Dengan kata lain, semua link diluar situs kita secara otomatis akan terbuka di tab baru saat di klik.

Copy dan paste scriptnya di bagian body atau sebelum tag </body>

<script type='text/javascript'>
//<![CDATA[
jQuery('a').each(function() {
    // Let's make external links open in a new tab.
    var href = jQuery(this).attr('href');
   
    if (typeof href != 'undefined' && href != "" && (href.indexOf('http://') != -1 || href.indexOf('https://') != -1) && href.indexOf(window.location.hostname) == -1) {
        jQuery(this).attr("target", "_blank");
    }
});
//]]>
</script>

Read More

Membuat Tombol Next Page

Sebagian template pada blog tidak memiliki tombol next page, yang mana tombol ini berfungsi buat mengarahkan para pengunjung untuk melihat halaman demi halaman yang berada pada blog kita berdasarkan angka yang tertera dalam tombol tersebut. Untuk anda yang belum memiliki tombol next page di blognya silahkan menyimak tutorial ini, sedangkan anda yang sudah memiliki tombol next page tersebut, abaikan saja tutorial ini. (hehehehe..)
Hasil dari tombol next page akan terlihat seperti gambar di bawah ini.

Cara Membuat Tombol Next Page:
1. Login ke Dasbor Anda ---> Edit HTML
2. Centang Expand Template Widget
3. Untuk menjaga hal-hal yang tidak diinginkan saya sarankan backup dulu template blog anda dengan mengklik Download Full Template.
4. Cari kode: ]]></b:skin>
5. Copy kode yang ada dibawah ini kemudian paste di atas kode ]]></b:skin>

.showpageArea a {text-decoration:underline;}
.showpageNum a {text-decoration:none;border: 1px solid #cccccc; margin:0 3px;padding:3px;}
.showpageNum a:hover {border: 1px solid #cccccc;background-color:#E56400;}
.showpagePoint {color:#333;text-decoration:none;border: 1px solid #cccccc;background: #cccccc;margin:0 3px;padding:3px;}
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:3px;}
.showpage a:hover {text-decoration:none; background-color:#E56400;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333;}

6. Kemudian cari kode </body>
7. Copy kode yang ada dibawah ini kemudian paste di atas </body>

<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord=&#39;Previous&#39;;
var downPageWord=&#39;Next&#39;;
</script>
<script src='http://rumbiadalam.googlecode.com/files/pag3.js' type='text/javascript'/>

8. Save Template Anda, selesai.

Silahkan anda mencobanya, semoga bermanfaat.

Read More

Cara Membuat Emoticon Kaskus dan Adsense-id di Komentar Blog

Langsung aja tanpa basa-basi...
Sebelum mengedit template sebaiknya simpan dulu template anda dengan mengklik Download Template Lengkap agar lebih aman jika terjadi kegagalan saat mengedit template.

1. Login ke Dasbor Anda ---> Edit HTML
2. Jangan lupa centang Expand Template Widget
3. Cari kode ini:

<b:if cond='data:post.embedCommentForm'>

(di template saya ada 2 kode seperti ini, pilih yang ke 2)
4. Masukkan kode berikut ini tepat di atas kode <b:if cond='data:post.embedCommentForm'>

<b>
<img src='http://i.imgur.com/4a2GG.gif' width='40'/>
:a:
<img src='http://i.imgur.com/Jnwl1.gif' width='40'/>
:b:
<img src='http://i.imgur.com/h9NDs.gif' width='40'/>
:c:
<img src='http://i.imgur.com/IL1IB.gif' width='40'/>
:d:
<img src='http://i.imgur.com/k3Fdh.gif' width='40'/>
:e:
<img src='http://i.imgur.com/ZDlSF.gif' width='40'/>
:f:
<img src='http://i.imgur.com/OXalA.gif' width='40'/>
:g:
<img src='http://i.imgur.com/cnARR.gif' width='40'/>
:h:
<img src='http://i.imgur.com/WTmJr.gif' width='40'/>
:i:
<img src='http://i.imgur.com/kenHK.gif' width='40'/>
:j:
<img src='http://i.imgur.com/aDJrj.gif' width='40'/>
:k:
<img src='http://i.imgur.com/E5qba.gif' width='40'/>
:l:
<img src='http://i.imgur.com/w3vTW.gif' width='40'/>
:m:
<img src='http://i.imgur.com/0WFG2.gif' width='40'/>
:n:
<img src='http://i.imgur.com/bkfG8.gif' width='40'/>
:o:
<img src='http://i.imgur.com/zvteN.gif' width='40'/>
:p:
<img src='http://i.imgur.com/xkzm0.gif' width='40'/>
:q:
<img src='http://i.imgur.com/UqDiW.gif' width='40'/>
:r:
<br/>
<img src='http://i.imgur.com/5uihz.gif' width='40'/>
:s:
<img src='http://i.imgur.com/5O9L2.gif' width='40'/>
:t:
<img src='http://i.imgur.com/7RDAt.gif' width='40'/>
:u:
<img src='http://i.imgur.com/WmQPn.gif' width='40'/>
:v:
<img src='http://i.imgur.com/9C3hy.gif' width='40'/>
:w:
<img src='http://i.imgur.com/fFhYI.gif' width='40'/>
:x:
<img src='http://i.imgur.com/e50uc.gif' width='40'/>
:y:
<img src='http://i.imgur.com/RjY5y.gif' width='40'/>
:z:
<img src='http://i.imgur.com/lrZEF.gif' width='40'/>
:ab:
<br/>
</b>

5.  Pasang kode dibawah ini sebelum </body>

<!-- Emoticon  Start -->
<script type='text/javascript'>
//<![CDATA[
a = document.getElementById('comments');
if(a) {
b = a.getElementsByTagName("DD");
for(i=0; i < b.length; i++) {
if (b.item(i).getAttribute('CLASS') == 'comment-body') {
_str = b.item(i).innerHTML.replace(/:a:/gi, "<img src='http://i.imgur.com/4a2GG.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:b:/gi, "<img src='http://i.imgur.com/Jnwl1.gif' class='smiley'/>");
_str = _str.replace(/:c:/gi, "<img src='http://i.imgur.com/h9NDs.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:d:/gi, "<img src='http://i.imgur.com/IL1IB.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:e:/gi, "<img src='http://i.imgur.com/k3Fdh.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:f:/gi, "<img src='http://i.imgur.com/ZDlSF.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:g:/gi, "<img src='http://i.imgur.com/OXalA.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:h:/gi, "<img src='http://i.imgur.com/cnARR.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:i:/gi, "<img src='http://i.imgur.com/WTmJr.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:j:/gi, "<img src='http://i.imgur.com/kenHK.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:k:/gi, "<img src='http://i.imgur.com/aDJrj.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:l:/gi, "<img src='http://i.imgur.com/E5qba.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:m:/gi, "<img src='http://i.imgur.com/w3vTW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:n:/gi, "<img src='http://i.imgur.com/0WFG2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:o:/gi, "<img src='http://i.imgur.com/bkfG8.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:p:/gi, "<img src='http://i.imgur.com/zvteN.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:q:/gi, "<img src='http://i.imgur.com/xkzm0.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:r:/gi, "<img src='http://i.imgur.com/UqDiW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:s:/gi, "<img src='http://i.imgur.com/5uihz.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:t:/gi, "<img src='http://i.imgur.com/5O9L2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:u:/gi, "<img src='http://i.imgur.com/7RDAt.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:v:/gi, "<img src='http://i.imgur.com/WmQPn.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:w:/gi, "<img src='http://i.imgur.com/9C3hy.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:x:/gi, "<img src='http://i.imgur.com/fFhYI.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:y:/gi, "<img src='http://i.imgur.com/e50uc.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:z:/gi, "<img src='http://i.imgur.com/RjY5y.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:ab:/gi, "<img src='http://i.imgur.com/lrZEF.gif' alt='' width='40' class='smiley'/>");
b.item(i).innerHTML = _str;
}
}
}
a = document.getElementById('comments');
if(a) {
c = a.getElementsByTagName("DD");
for(i=0; i < c.length; i++) {
if (c.item(i).getAttribute('CLASS') == 'comment-body-author') {
_str = b.item(i).innerHTML.replace(/:a:/gi, "<img src='http://i.imgur.com/4a2GG.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:b:/gi, "<img src='http://i.imgur.com/Jnwl1.gif' class='smiley'/>");
_str = _str.replace(/:c:/gi, "<img src='http://i.imgur.com/h9NDs.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:d:/gi, "<img src='http://i.imgur.com/IL1IB.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:e:/gi, "<img src='http://i.imgur.com/k3Fdh.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:f:/gi, "<img src='http://i.imgur.com/ZDlSF.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:g:/gi, "<img src='http://i.imgur.com/OXalA.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:h:/gi, "<img src='http://i.imgur.com/cnARR.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:i:/gi, "<img src='http://i.imgur.com/WTmJr.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:j:/gi, "<img src='http://i.imgur.com/kenHK.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:k:/gi, "<img src='http://i.imgur.com/aDJrj.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:l:/gi, "<img src='http://i.imgur.com/E5qba.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:m:/gi, "<img src='http://i.imgur.com/w3vTW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:n:/gi, "<img src='http://i.imgur.com/0WFG2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:o:/gi, "<img src='http://i.imgur.com/bkfG8.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:p:/gi, "<img src='http://i.imgur.com/zvteN.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:q:/gi, "<img src='http://i.imgur.com/xkzm0.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:r:/gi, "<img src='http://i.imgur.com/UqDiW.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:s:/gi, "<img src='http://i.imgur.com/5uihz.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:t:/gi, "<img src='http://i.imgur.com/5O9L2.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:u:/gi, "<img src='http://i.imgur.com/7RDAt.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:v:/gi, "<img src='http://i.imgur.com/WmQPn.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:w:/gi, "<img src='http://i.imgur.com/9C3hy.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:x:/gi, "<img src='http://i.imgur.com/fFhYI.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:y:/gi, "<img src='http://i.imgur.com/e50uc.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:z:/gi, "<img src='http://i.imgur.com/RjY5y.gif' alt='' width='40' class='smiley'/>");
_str = _str.replace(/:ab:/gi, "<img src='http://i.imgur.com/lrZEF.gif' alt='' width='40' class='smiley'/>");
c.item(i).innerHTML = _str;
}
}
}
//]]>
</script>
<!-- Emoticon  End -->

6. Save template dan lihat hasilnya

Untuk menambah emoticon lain silahkan berkreasi sendiri.
Jika ada masalah silahkan komentar dibawah...

Read More

Tips Mencegah Hacking Facebook Dengan Nomor Telpon

Tips atau Cara Mencegah Hacking Facebook. Hal ini sering diperbincangkan dikalangan blogger maupun Facebooker, baik yang sudah terkena hack atau belum. Berbagai motif muncul ketika seseorang melakukan hacking, dari mulai iseng, kebencian, balas dendam, mencoba kemampuan, pencurian chip poker, dan berbagai alasan lain.
Saya memiliki cara yang saya anggap paling ampuh untuk melindungi akun Facebook dari pencurian atau hacking Facebook dengan nomor telpon. Sedikit gambaran, dengan mengaktifkan fitur ini, setiap kali kamu akan mengakses akun Facebook dari perangkat yang tidak dikenali (mis: komputer atau ponsel apa pun yang belum kamu namai dan disimpan ke akun Facebook kamu), kamu harus terlebih dahulu memasukkan kode keamanan yang terkirim ke ponsel kamu. Berikut langkah-langkahnya:

1. Login ke Facebook kamu
2. Pergi ke Pengaturan Akun
3. Klik Keamanan di bilah/tab sebelah kiri
4. Pilih sunting pada Persetujuan Masuk ke Facebook
5. Centang kotak pada "Haruskan saya memasukkan kode keamanan setiap kali ada komputer atau perangkat yang tidak dikenal mencoba mengakses akun saya"
6. Klik Atur Sekarang saat popup muncul
7. Masukan nomor telpon kamu dan klik Lanjutkan
8. Setelah itu kamu akan menerima SMS kode konfirmasi, periksa SMS  lalu masukkan kodenya ke kotak popup tadi kemudian klik lanjutkan.
9. Jangan lupa klik Simpan Perubahan.

Sampai disini kamu sudah berhasil membuat akun Facebook kamu tidak mudah dibobol oleh orang lain. Cara diatas memang sedikit merepotkan apalagi bagi yang sering main di warnet karena harus memasukan kode keamanan setiap login ke Facebook, tapi dengan cara itu saya yakin akun Facebook anda akan sangat aman dari hacker. Jika menggunakan komputer pribadi saya sarankan untuk mencentang kotak "simpan perangkat ini" saat memasukan kode keamanan pertama kali, agar login berikutnya tidak dimintai kode keamanan lagi.
Sekian, semoga bermanfaat...

Read More

Meta Tag Open Graph Facebook

Open Graph Protocol adalah skema FBML untuk media sosial sharing seperti facebook misalnya agar link bisa di masukkan ke facebook dengan gampang. Hal ini sangat berguna untuk optimasi SEO blog di Facebook.
Memasang meta tags untuk Open Graph Protocol di Blogger:
1. Login ke blogger Dasboar >Rancangan> Edit HTML,
2. Cari kode:

xmlns:expr='http://www.google.com/2005/gml/expr'>

3. Tambahkan kode Open Graph Protocol ini sebelum kode penutup >

xmlns:og='http://ogp.me/ns#'

4. Sehingga hasilnya akan terlihat seperti ini:

<html ...... xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:og='http://ogp.me/ns#'>

5. Cari kode <head> dan simpan kode meta tag berikut ini dibawah kode <head> atau dibawah kode meta tag yang sudah ada sebelumnya.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
<meta content='blog' property='og:type'/>
<b:else/>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='article' property='og:type'/>
</b:if>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='http://example.com/logo blog.jpg' property='og:image'/>
</b:if>
<meta content='Nama Blog' property='og:site_name'/>
<meta content='Your-App-ID' property='fb:app_id'/>
<meta content='Facebook-profile-ID' property='fb:admins'/>

(ganti tulisan warna merah sesuai dengan blog kamu)
6. Save Template, Selesai.

Untuk memeriksa apakah Anda telah menerapkan semua tag <META> dengan benar, kunjungi Facebook Debugger for Developers.

Note: Open graph ini juga berguna untuk menampilkan gambar atau logo blog kamu ketika di share, like atau send ke facebook jika artikel yang di posting tidak memiliki gambar.

Read More

Script Anti Copas - Copy Paste

Cara memasukkan script anti copy paste di blog :

1.Login ke akun blogger kamu.
2.Klik Rancangan lalu klik Edit HTML.
3.Tandai Expand Template Widget pada bagian Edit Template.
4.Cari kode </head>
5.Jika sudah ketemu, masukkan script berikut ini diatas kode </head>

<SCRIPT type="text/javascript">
if (typeof document.onselectstart!="undefined") {
document.onselectstart=new Function ("return false");
}
else{
document.onmousedown=new Function ("return false");
document.onmouseup=new Function ("return true");
}
</SCRIPT>

6.Lalu klik Simpan Template dan lihat hasilnya.
7.Selesai.

Read More

Mengatasi Tombol Reply Yang Tidak Bisa di Klik Alias Error

Tadi saya ingin membalas sebuah komentar di blog ini dan saya menemukan masalah bahwa fitur tombol reply yang ada di blog ini tidak berfungsi dan tidak berpengaruh apa-apa saat di klik, walhasil saya tidak jadi membalas komentar tersebut, hehehe..
Setelah mencari info, ternyata ada perubahan pada JavaScript thread comment. Nah untuk mengatasi masalah tersebut, Lakukan langkah-langkah berikut ini:

1. Login ke Dasbor Anda >> Rancangan >> Edit HTML
2. Centang Expand Template Widget
3. Untuk menjaga hal-hal yang tidak diinginkan saya sarankan backup dulu template blog anda dengan mengklik Download Full Template.

4. Cari kode:

<b:includable id='threaded_comment_js' var='post'>
  <script defer='defer' expr:src='data:post.commentSrc' type='text/javascript'/>

  <script type='text/javascript'>
    (function() {
      var items = <data:post.commentJso/>;
      var msgs = <data:post.commentMsgs/>;
      var postId = &#39;<data:post.id/>&#39;;
      var feed = &#39;<data:post.commentFeed/>&#39;;
      var authorName = &#39;<data:post.author/>&#39;;
      var authorUrl = &#39;<data:post.authorUrl/>&#39;;
      var blogId = &#39;<data:top.id/>&#39;;
      var baseUri = &#39;<data:post.commentBase/>&#39;;

// <![CDATA[
      feed += '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
      var cursor = null;
      if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
      }

      var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
          for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
              return '<span class="deleted-comment">' + entry.content.$t + '</span>';
            }
          }
        }
        return entry.content.$t;
      }

      var parse = function(data) {
        cursor = null;
        var comments = [];
        if (data && data.feed && data.feed.entry) {
          for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
            var comment = {};
            // comment ID, parsed out of the original id format
            var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
            comment.id = id ? id[2] : null;
            comment.body = bodyFromEntry(entry);
            comment.timestamp = Date.parse(entry.published.$t) + '';
            if (entry.author && entry.author.constructor === Array) {
              var auth = entry.author[0];
              if (auth) {
                comment.author = {
                  name: (auth.name ? auth.name.$t : undefined),
                  profileUrl: (auth.uri ? auth.uri.$t : undefined),
                  avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
                };
              }
            }
            if (entry.link) {
              if (entry.link[2]) {
                comment.link = comment.permalink = entry.link[2].href;
              }
              if (entry.link[3]) {
                var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
                if (pid && pid[1]) {
                  comment.parentId = pid[1];
                }
              }
            }
            comment.deleteclass = 'item-control blog-admin';
            if (entry.gd$extendedProperty) {
              for (var k in entry.gd$extendedProperty) {
                console.log(entry.gd$extendedProperty[k].name + ' - ' + entry.gd$extendedProperty[k].value);
                if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
                  comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
                }
              }
            }
            comments.push(comment);
          }
        }
        return comments;
      };

      var paginator = function(callback) {
        if (hasMore()) {
          var url = feed;
          if (cursor) {
            url += '&published-min=' + new Date(cursor).toISOString();
          }
          window.bloggercomments = function(data) {
            var parsed = parse(data);
            cursor = parsed.length < 50 ? null
                : parseInt(parsed[parsed.length - 1].timestamp) + 1
            callback(parsed);
            window.bloggercomments = null;
          }
          url += '&callback=bloggercomments';
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = url;
          document.getElementsByTagName('head')[0].appendChild(script);
        }
      };
      var hasMore = function() {
        return !!cursor;
      };
      var getMeta = function(key, comment) {
        if ('iswriter' == key) {
          var matches = !!comment.author
              && comment.author.name == authorName
              && comment.author.profileUrl == authorUrl;
          return matches ? 'true' : '';
        } else if ('deletelink' == key) {
          return baseUri + '/delete-comment.g?blogID=' + blogId + '&postID=' + comment.id;
        } else if ('deleteclass' == key) {
          return comment.deleteclass;
        }
        return '';
      };

      var replybox = null;
      var replyUrlParts = null;
      var replyParent = undefined;

      var onReply = function(commentId, domId) {
        if (replybox == null) {
          // lazily cache replybox, and adjust to suit this style:
          replybox = document.getElementById('comment-editor');
          if (replybox != null) {
            replybox.height = '250px';
            replybox.style.display = 'block';
            replyUrlParts = replybox.src.split('#');
          }
        }
        if (replybox && (commentId !== replyParent)) {
          document.getElementById(domId).insertBefore(replybox, null);
          replybox.src = replyUrlParts[0]
              + (commentId ? '&parentID=' + commentId : '')
              + '#' + replyUrlParts[1];
          replyParent = commentId;
        }
      };

      var tok = 'comment-form_';
      var hash = window.location.hash || '';
      var startThread = hash.indexOf(tok) == 1 ? hash.substring(tok.length + 1) : undefined;

      // Configure commenting API:
      var configJso = {
        'maxDepth': 2
      };
      var provider = {
        'id': postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
      };

      var render = function() {
        if (window.goog && window.goog.comments) {
          var holder = document.getElementById('comment-holder');
          window.goog.comments.render(holder, provider);
        }
      };

      // render now, or queue to render when library loads:
      if (window.goog && window.goog.comments) {
        render();
      } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
      }
    })();
// ]]>
  </script>
</b:includable>

5. Ganti semua kode tersebut dengan kode dibawah ini:

<b:includable id='threaded_comment_js' var='post'>
  <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>

  <script type='text/javascript'>
    (function() {
      var items = <data:post.commentJso/>;
      var msgs = <data:post.commentMsgs/>;
      var config = <data:post.commentConfig/>;

// <![CDATA[
      var cursor = null;
      if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
      }

      var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
          for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
              return '<span class="deleted-comment">' + entry.content.$t + '</span>';
            }
          }
        }
        return entry.content.$t;
      }

      var parse = function(data) {
        cursor = null;
        var comments = [];
        if (data && data.feed && data.feed.entry) {
          for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
            var comment = {};
            // comment ID, parsed out of the original id format
            var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
            comment.id = id ? id[2] : null;
            comment.body = bodyFromEntry(entry);
            comment.timestamp = Date.parse(entry.published.$t) + '';
            if (entry.author && entry.author.constructor === Array) {
              var auth = entry.author[0];
              if (auth) {
                comment.author = {
                  name: (auth.name ? auth.name.$t : undefined),
                  profileUrl: (auth.uri ? auth.uri.$t : undefined),
                  avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
                };
              }
            }
            if (entry.link) {
              if (entry.link[2]) {
                comment.link = comment.permalink = entry.link[2].href;
              }
              if (entry.link[3]) {
                var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
                if (pid && pid[1]) {
                  comment.parentId = pid[1];
                }
              }
            }
            comment.deleteclass = 'item-control blog-admin';
            if (entry.gd$extendedProperty) {
              for (var k in entry.gd$extendedProperty) {
                if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
                  comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
                }
              }
            }
            comments.push(comment);
          }
        }
        return comments;
      };

      var paginator = function(callback) {
        if (hasMore()) {
          var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
          if (cursor) {
            url += '&published-min=' + new Date(cursor).toISOString();
          }
          window.bloggercomments = function(data) {
            var parsed = parse(data);
            cursor = parsed.length < 50 ? null
                : parseInt(parsed[parsed.length - 1].timestamp) + 1
            callback(parsed);
            window.bloggercomments = null;
          }
          url += '&callback=bloggercomments';
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = url;
          document.getElementsByTagName('head')[0].appendChild(script);
        }
      };
      var hasMore = function() {
        return !!cursor;
      };
      var getMeta = function(key, comment) {
        if ('iswriter' == key) {
          var matches = !!comment.author
              && comment.author.name == config.authorName
              && comment.author.profileUrl == config.authorUrl;
          return matches ? 'true' : '';
        } else if ('deletelink' == key) {
          return config.baseUri + '/delete-comment.g?blogID='
               + config.blogId + '&postID=' + comment.id;
        } else if ('deleteclass' == key) {
          return comment.deleteclass;
        }
        return '';
      };

      var replybox = null;
      var replyUrlParts = null;
      var replyParent = undefined;

      var onReply = function(commentId, domId) {
        if (replybox == null) {
          // lazily cache replybox, and adjust to suit this style:
          replybox = document.getElementById('comment-editor');
          if (replybox != null) {
            replybox.height = '250px';
            replybox.style.display = 'block';
            replyUrlParts = replybox.src.split('#');
          }
        }
        if (replybox && (commentId !== replyParent)) {
          document.getElementById(domId).insertBefore(replybox, null);
          replybox.src = replyUrlParts[0]
              + (commentId ? '&parentID=' + commentId : '')
              + '#' + replyUrlParts[1];
          replyParent = commentId;
        }
      };

      var hash = (window.location.hash || '#').substring(1);
      var startThread, targetComment;
      if (/^comment-form_/.test(hash)) {
        startThread = hash.substring('comment-form_'.length);
      } else if (/^c[0-9]+$/.test(hash)) {
        targetComment = hash.substring(1);
      }

      // Configure commenting API:
      var configJso = {
        'maxDepth': config.maxThreadDepth
      };
      var provider = {
        'id': config.postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initComment': targetComment,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
      };

      var render = function() {
        if (window.goog && window.goog.comments) {
          var holder = document.getElementById('comment-holder');
          window.goog.comments.render(holder, provider);
        }
      };

      // render now, or queue to render when library loads:
      if (window.goog && window.goog.comments) {
        render();
      } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
      }
    })();
// ]]>
  </script>
</b:includable>

6. Save Template dan lihat hasilnya

Read More

Cara Membuat Fitur Reply Comment Seperti Wordpress di Blogger - Terbaru

Kita mungkin iri melihat fitur reply comment pada blog wordpress teman-teman yang lain, nah blogger jg tidak mau kalah dengan fitur seperti itu dan sekarang di blogger juga sudah bisa ditambahkan fitur comment reply atau thread comments. Sebenarnya cara ini sangat mudah dilakukan, tinggal mengubah sedikit kode template html anda.
Disini saya akan mejelaskan cara yang paling simple dengan mengedit template.
1. Login ke Dasbor Anda ---> Edit HTML
2. Jangn lupa centang Expand Template Widget
3. Cari kode ini:

<b:include data='post' name='comments'/>

 (di template saya ada 4 kode seperti itu)
4. Ganti semua kode diatas dengan :

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>

 5. Save.

Dan hasilnya akan seperti ini:



Sampai disini, fitur replay comment atau thread comments blogger anda sudah jadi.
Semoga bermanfaat...

Read More