Cara memasang Komentar Google Plus pada Blog

Selamat malam Sobat blogger, Apa kabar semua ? Sudah lama saya tidak lagi posting pada Blogger LHK-Blogs ini dikarenakan Kesibukan di dunia nyata dan banyaknya tugas-tugas kuliah membuat saya jadi jarang bisa posting artikel blogger. nah mumpung sekarang ada kesempatan buat posting. Seelah beberapa waktu yang lalu saya telah posting tentang "cara memasang komentar Facebok pada blog" kini saya akan posting tentang cara memasang Komentar Google Plus pada Blog. tentu saja komentar google plus masih jarang kita temui pada blog. karena kebanyakan para blogger masih menggunakan komentar bawaan dari blogger, atau kebanyakan mereka memasang komentar facebook pada blog. Selain itu, fitur komentar google Plus ini juga baru saja di rilis beberapa waktu yang lalu oleh Tim Google Plus. Oke langsung saja berikut caranya, silahkan simak ya....

Cara memasang Komentar Google Plus pada Blog

• Langkah pertama, silahkan login ke akun Blogger sobat
• Langkah kedua, Pilih Menu Template
• Selanjutnya, Pilih Edit Html
• Lalu cari kode berikut

<div class='post-outer'> <b:include data='post' name='post'/>  <b:if cond='data:blog.pageType == &quot;static_page&quot;'>  <b:include data='post' name='comment_picker'/>  </b:if>  <b:if cond='data:blog.pageType == &quot;item&quot;'>  <b:include data='post' name='comment_picker'/>  </b:if></div>

Keterangan : Untuk memudahkan pencarian, silahkan gunakan mode pencarian dengan menekan tombol CTRL + F

• Setelah sobat berhasil menemukan kode tersebut, silahkan ganti kode tersebut dengan kode dibawah ini

<div class='post-outer'><b:include data='post' name='post'/><b:if cond='data:blog.pageType == &quot;static_page&quot;'><div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/><b:if cond='data:post.showThreadedComments'><b:include data='post' name='threaded_comments'/><b:else/><b:include data='post' name='comments'/></b:if></b:if><b:if cond='data:blog.pageType == &quot;item&quot;'><div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/><b:if cond='data:post.showThreadedComments'><b:include data='post' name='threaded_comments'/><b:else/><b:include data='post' name='comments'/></b:if></b:if></div>

Keterangan :  Masing - Masing template memiliki kode yang berbeda, kemungkinan kode <div class='post-outer'> ada lebih dari satu pada template blog sobat. Jadi, jika sobat ingin menaruh komentar Google Plus diatas komentar bawaan blogger, maka Sobat harus menaruh pada kode yang pertama.

• Jika sudah selesai, silahkan Save Template blog sobat dan lihat hasilnya dibawah salah satu postingan sobat

Demikian Tutorial yang bisa saya share kali ini, jika ada pertanyaan, silahkan Tinggalkan komentar ya, jangan ragu-ragu. Terimakasih dan semoga bermanfaat.

Continue Reading

Cara Memasang Dua Widget Berdampingan pada Blog

cara memasang dua widget supaya berdampingan pada satu kolom Sidebar agar terlihat rapi, Cara Memasang Dua Widget Berdampingan pada Blog - Cara Memasang Dua Widget Berdampingan pada Blog- Ini adalah salah satu hal yang awalnya menjadi permasalahan buat saya, saya ingin blog saya terlihat rapi, namun pada blog saya terpasang beberapa Widget seperti widget Alexa Rank, Histats dan lain sebagainya. Tentu akan terlihat kurang nyaman ketika melihat widget-widget tersebut terpasang berceceran di sidebar yang rata-rata berikiran 300 px sedangkan widget kita hanya berukuran sekitar 30 px saja, pastinya akan meninggalkan ruang kosong atau space yang tidak terpakai. Space inilah yang membuat Blog kita terlihat Kurang rapi sehingga kurang nyama untuk dilihat. Padahal salah satu yang menjadi faktor kenyamanan bagi pengunjung blog kita adalah dari tampilan atau kerapian blog. jika Blog kita rapi, terlihat bagus, kemungkinan besar Pengunjung blog pun pasti akan betah berlama-lama di blog kita. Baiklah disini saya akan berbagi tentang bagaimana cara memasang dua widget supaya berdampingan pada satu kolom Sidebar agar terlihat rapi.

Cara Memasang Dua Widget Berdampingan pada Blog

• Silahkan Login Ke Akun Blogger sobat.
• Pada Dashboard, silahkan pilih menu Layout atau Tata Letak
• Silahkan Pilih Html/JavaScript
• Setelah itu Isi dengan Kode berikut 

<table><tr><td>Kode Widget Sobat</td><td>Kode Widget Sobat</td></tr></table>

Keterangan : Silahkan taruh kode yang akan sobat pasang berdampingan pada tulisan yang berwarna merah.
 Contoh

<table><tr><td><a href="http://www.alexa.com/siteinfo/http://maswidikira.blogspot.com/"><script type='text/javascript' src='http://xslt.alexa.com/site_stats/js/t/a?url=http://maswidikira.blogspot.com/'></script></a></td><td><!-- Histats.com  START  (standard)--><script type="text/javascript">document.write(unescape("%3Cscript src=%27http://s10.histats.com/js15.js%27 type=%27text/javascript%27%3E%3C/script%3E"));</script><a href="http://www.histats.com" target="_blank" title="web tracker" ><script  type="text/javascript" >try {Histats.start(1,2264890,4,432,112,75,"00011111");Histats.track_hits();} catch(err){};</script></a><noscript><a href="http://www.histats.com" target="_blank"><img src="http://sstatic1.histats.com/0.gif?2264890&amp;101" alt="web tracker" border="0" /></a></noscript><!-- Histats.com  END  --></td></tr></table>

Keterangan : Kode yang berwarna Hiijau adalah Kode banner Alexa, Sedangkan yang berwarna Orange adalah kode dari banner Histats. jika kode tersebut dipasang, maka akan menjadi berdampingan seperti gambar dibawah ini.

 Bagaimana Sobat ? Mudah kan.... Demikian cara Memasang Dua Widget Berdampingan pada Blog, jika ada pertanyaan, kritik atau saran, silahkan tinggalkan komentar ya..... Semoga bermanfaat.

Continue Reading

Cara Membuat Random Post Keren dengan Tumbnail

Cara Membuat Random Post Keren dengan Tumbnail- Random Post adalah Sebuah Widget yang berfungsi untuk menampilkan Postingan yang telah kita Puplish secara acak. Disini saya akan mengajak Sobat untuk belajar bagaimana cara membuat random post yang disertai dengan tumbnail. Tentunya sangat keren dan beda dengan yang ada pada umumnya. Tidak hanya itu, disini yang tampil juga bukan hanya judul postinganya saja, tapi juga dengan beberapa Deskripsinya. Salah satu fungsi atau kegunaan dari Random post adalah Menampilkan kembali artikel yang mungkin sudah lama kita buat dan karena terlalu lamanya sehingga jarang ditampilkan, Selain itu Random post juga dapat berfungsi sebagai saran artikel yang mungkin sedang dicari oleh pembaca blog kita, sehingga mereka akan merasa mudah dalam mencari artikel yang mereka butuhkan. Oke langsung saja mari kita belajar cara membuatnya.

Cara Membuat Random Post Keren dengan Tumbnail

• Langkah pertama, sobat harus login dulu ke akun blogger sobat.
• Kedua, Pilih menu Layout
• Ketiga, Pilih Add Gadget dan Pilih Html/JavaScript
• Keempat, Masukan kode berikut

<style>.rp-post-link {font-weight: bold !important;font-size: 120% !important;}.rp-summary {margin-top: 3px !important;font-size: 100% !important;line-height: 1.3em !important;word-wrap: break-word !important;}.rp-thumbnail {margin: 5px 5px 2px 0px !important;float: left !important;width:65px;height:65px;}.rp-pubdate {font-style: italic !important;margin-bottom: 3px !important;}</style><script type="text/javascript">var randarray = new Array();var l=0;var flag;var lengthsummary = 100;var numofpost=4; function randomposts(json){var total = parseInt(json.feed.openSearch$totalResults.$t,10);for(i=0; i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){flag=1;}}if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<div>');for(n in randarray){var p=randarray[n];var entry=json.feed.entry[p-1];var item ="";var posttitle = entry.title.$t || "[Untitled]";"[Untitled]"for(k=entry.link.length -1; k >= 0 ; k--){if(entry.link[k].rel=='alternate'){item +="<a class='rp-post-link' href='" + entry.link[k].href + "'>" + posttitle + "</a>";break;}}item += "<br"item += "/>"var pubdate = new Date(entry.published.$t).toDateString();item +="<span class='rp-pubdate'>Posted On " + pubdate +"</span>";if('media$thumbnail' in entry)item += "<img class='rp-thumbnail' src='" + entry.media$thumbnail.url + "'>"var summary = "";if ("content" in entry) {summary = entry.content.$t;}else if ("summary" in entry) {summary = entry.summary.$t;}var re = /<\S[^>]*>/g;summary = summary.replace(re, "");item += "<p class='rp-summary'>" + summary.substring(0,lengthsummary) + " ...</p>";document.write(item);}document.write('</div>');}</script><script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

• Sebelum Sobat Menyimpan Script tadi, ada beberapa Kode yang harus sobat ubah sesuai dengan Keinginan Sobat, diantaranya :

1. Angka yang saya tandai dengan warna Biru adalah ukuran Lebar dan tinggi dari Tumbnail.
2. Angka yang saya tandai dengan warna Merah adalah Jumlah karakter Deskripsi Pada Random Post.
3. Angka yang saya beri warna Hijau adalah jumlah Postingan yang akan ditampilkan, Silahkan sobat ubah sesuai dengan Selera Sobat.

• Setelah Sobat selesai Mengaturnya, seilahkan Simpan, dan Lihat Hasilnya.

Nah, Keren kan? Oke begitu saja.....
Demikian yang bisa saya share kali ini, Semoga dapa membantu dan bermanfaat bagi sobat. Jika ada Pertanyaan Mengenai  Cara Membuat Random Post Keren dengan Tumbnail, Silahkan sobat Tinggalkan Komentar dibawah ini. Terimakasih.

Continue Reading

Cara mengetahui Situs Dofollow atau Nofollow

Cara mengetahui Situs Dofollow atau Nofollow-Dofollow dan Nofollow adalah sebuah istilah yang digunakan oleh search engine atau mesin pencari sebagai tag yang dimanfaatkan untuk membedakan apakah setiap link yang terdapat dalam sebuah situs web boleh diikuti atau tidak oleh robot search engine atau mesin telusur ketika sedang melakukan proses pengindeksan pada situs atau web tertetu.
apabila situs web yang sedang diindeks termasuk dalam kategori Dofollow, maka semua tautan yang ada di dalamnya akan diikuti  oleh robot mesin telusur, sehingga setiap bagian yang tertaut dengan situs tersebut juga akan ikut terindeks.

Sedangkan Nofollow adalah kebalikan dari Dofollow, yaitu ketika situs atau blog yang sedang diindeks termasuk dalam kategori Nofollow, maka robot mesin telusur hanya akan mengindeks setiap bagian dari situs atau blog yang dimaksud tanpa mengikuti setiap link yang ada di dalamnya, sehingga bagian lain yang tertaut dengan situs atau blog tersebut tidak akan ikut diindeks.
Nah trus bagaimana cara membedakan apakan sebuah Blog atau web tertentu termasuk Dofollow atau Nofollow? Berikut caranya, Silahkan Simak Sebentar.

Cara mengetahui Situs Dofollow atau Nofollow

1. Silahkan Sobat buka Website, atau Blog yang ingin sobat ketahui.
2. Silahkan Tekan tombol ctrl + u, pada keyboard untuk membuka source blog atau website tersebut
3. Selanjutnya silahkan tekan Tombol Ctrl + f untuk Mencari
4. Pada kolom pencarian, silahkan ketik Follow
5. Tekan Tombol next beberapa kali kebawah sampai terlihat code seperti ini:

Rel=’follow’

 Atau

<meta content=”INDEX,FOLLOW“>

 Jika sobat menemukan  tulisan "follow", maka blog tersebut adalah blog dofollow. Tapi jika yang muncul adalah tulisan "nofollow" berarti memang tidak do follow. Tapi tidak ada salahnya jika kita tetap memberikan komentar, selain menambah teman, Blog kita akan kelihatan lebih populer.
Demikian Sedikit yang bisa saya share kepada sobat, Semoga bermanfaat.

Continue Reading

Cara Pasang Komentar Facebook Pada Blog

Cara Pasang Komentar Facebook Pada Blog- Kotak Komentar pada blog adalah bagian terpenting pada Blog, karena dengan adanya kotak komentar inilah para pembaca atau pengunjung blog dapat menyampaikan isi hatinya. Bayangkan saja ketika kita sedang membutuhkan suatu informasi yang bagi kita adalah sebuah informasi yang sangat penting, namun ketika kita punya pertanyaan seputar informasi tersebut dan ingin menyampaikanya kepada penulis blog, namun dalam blog tersebut tidak disediakan kotak untuk menyampaikan komentar, tentu saja sangat menyulitkan kita sebagai pembaca atau pengunjung blog.

Sebenarnya blogger sendiri telah menyediakan kotak komentar, namun terkadang jika si pembaca atau pengunjung yang ingin berkomentar tidak mempunyai akun google merasa kesulitan untuk menyampaikanya, karena keterbatasan user ID yang di izinkan untuk menyampaikan komentar. maka dari itu disini saya akan berbagi sedikit tips kepada sobat blogger tentang Cara Pasang Komentar Facebook Pada Blog. Mungkin sobat ada yang bertanya, mengapa harus komentar facebook yang dipakai? Karena Menggunakan Komentar Facebook memiliki bentuk thread comment, sehingga kita  bisa membalas komentar. Selain itu juga terintegrasi dengan facebook, sehingga komentar bisa dibagikan di facebook si komentator.Keuntungan lainnya adalah, dengan menggunakan kotak komentar facebook maka akan lebih menghemat tempat atau space pada blog kita.

Cara Pasang Komentar Facebook Pada Blog

• Langkah pertama, silahkan sobat login ke akun blogger sobat
• kedua, masuk ke menu Template
• Pilih Edit Html dan jangan lupa beri tanda centang pada Expand template widget
• Selanjutnya silahkan cari kode  <b:includable id='status-message'>  , Setelah ketemu, coba sobat geser sedikit keatas, maka sobat akan menemukan kode </b:includable> 
• setelah itu silahkan taruh kode berikut tepat diatas kode </b:includable>  tadi.

<b:if cond='data:blog.pageType == &quot;item&quot;'><p align='left'><a href='http://lhk-blogs.blogspot.com/2013/04/Cara-Pasang-Komentar-Facebook-Pada-Blog.html' target='new'><img border='0' height='30' src='http://1.bp.blogspot.com/-8ZYTlaWyKss/UVshAXvJt1I/AAAAAAAAAbI/cop-xo1JEl0/s1600/comment+copy.png' width='200'/></a></p><div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:comments expr:href='data:post.url' num_posts='10' width='580'/></b:if>

Sehingga Seluruh kodenya akan terlihat seperti ini

<b:if cond='data:blog.pageType == &quot;item&quot;'><p align='left'><a href='http://lhk-blogs.blogspot.com/2013/04/Cara-Pasang-Komentar-Facebook-Pada-Blog.html' target='new'><img border='0' height='30' src='http://1.bp.blogspot.com/-8ZYTlaWyKss/UVshAXvJt1I/AAAAAAAAAbI/cop-xo1JEl0/s1600/comment+copy.png' width='200'/></a></p><div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:comments expr:href='data:post.url' num_posts='10' width='580'/></b:if></b:includable>
<b:includable id='comment_picker' var='post'>
  <b:if cond='data:post.commentSource == 1'>
    <b:include data='post' name='iframe_comments'/>
  <b:else/>
    <b:if cond='data:post.showThreadedComments'>
      <b:include data='post' name='threaded_comments'/>
    <b:else/>
      <b:include data='post' name='comments'/>
    </b:if>
  </b:if>
</b:includable>
<b:includable id='status-message'>

Keterangan : 

1. Angka yang  saya beri warna kuning adalah jumlah komentar yang akan ditampilkan, sobat bisa menggantinya sesuai dengan keinginan sobat.
2. Angka yang saya beri warna biru adalah ukuran lebar kolom komentar facebook tersebut. silahkan sobat ganti sesuai dengan ukuran pada template sobat masing-masing.

• jika sudah selesai, silahkan sobat simpane template sobat  dan lihat hasilnya.

Continue Reading

Cara menambahkan tombol Share Twitter, Facebook dan Google + pada blog

Cara menambahkan tombol Share Twitter, Facebook dan Google + pada blog-  bagi para sobat blogger, Button Share adalah element yang paling penting dan harus ada dalam setiap posting mereka. karena tombol Share ini adalah sebuah tombol yang dimana dapat mempermudah pembaca untuk membagikan artikel bermanfaat kepada teman-teman di beberapa jejaring sosial. untuk sementara ini, ada sekitar tiga situs jejaring sosial yang paling ramai dan banyak digunakan oleh kebanyakan orang didunia, jejaring sosial tersebut antara lain Facebok, Twitter, dan Google +. dengan menambahkan tombol share atau button share ini, kemungkinan besar akan meningkatkan jumlah pengunjung atau visitor ke blog sobat, jan tentunya akan meningkatkan jumlah traffict blog sobat, sehingga blog sobat akan semakin populer. jika sobat tertarik untuk memasang button share ini, mari kita belajar cara membuatnya, silahkan simak baik-baik.

Cara menambahkan tombol Share Twitter, Facebook dan Google + pada blog

• Langkah awal, silahkan sobat login ke akun blogger sobat masing-masing.
• Langkah kedua, silahkan pilih menu template.
• pilih Edit Html dan jangan lupa beri tanda centang pada Expand template widget.
• setelah itu silahkan sobat cari kode <div class='post-footer'>
• Jika Sudah ketemu, silahkan taruh kode berikut dibawahnya

<!-- Button Share BEGIN --><div class='addthis_toolbox addthis_default_style' expr:addthis:title='data:post.title' expr:addthis:url='data:post.url' style='float:right;padding:0px;'><a class='addthis_button_facebook_like' fb:like:layout='button_count'/><a class='addthis_button_tweet' tw:related='Widikira' tw:via='Widikira'/><a class='addthis_button_google_plusone' g:plusone:size='medium'/> </div><script src='//s7.addthis.com/js/300/addthis_widget.js' type='text/javascript'/><!-- Button Share END -->

Keterangan : 

1. Tulisan yang berwarna merah adalah posisi tombol share tersebut, jika sobat ingun menempatkanya disebelah kiri, maka ganti tulisan tersebut menjadi left
2. Tulisan yang berwarna kuning, silahkan sobat ganti dengan akun Twitter sobat masing-masing.

• Jika Sudah selesai, silahkan sobat simpan template blog sobat dan lihat hasilnya.

demikian sedikit tips Cara menambahkan tombol Share Twitter, Facebook dan Google + pada blog, semoga bermanfaat dan terimakasih sudah berkenan mampir. jika ada pertanyaan mengenai artikel Cara menambahkan tombol Share Twitter, Facebook dan Google + pada blog, silahkan sobat tinggalkan komentar dibawah ini. terimakasih.

Salam hangat

LHK-Blogs

Continue Reading

Cara Membuat Efek Gelembung Pada Blog

Cara Membuat Efek Gelembung Pada Blog- Setelah dulu saya pernah Membuat artikel tentang cara membuat Mouse bertabur bintang pada blog, kini saya akan berbagi tentang cara membuat Efek Gelembung pada blog. cara kerjanya pun hampir sama dengan efek mouse bertabur bintang,namun kali mouse anda akan mengeleluarkan gelembung-gelembung yang semakin lama semakin membesar ukuranya dan melayang naik ke atas. tentu saja dengan efek tersebut akan membuat blog sobat terlihat semakin menarik dan unik, agar pengunjung blog sobat semakin betah singgah di blog sobat yang penuh dengan efek yang sangat unik dan menarik tersebut. nah saya rasa saya tidak perlu ngomong panjang lebar lagi, danlangsung saja berikut caranya :

Cara Membuat Efek Gelembung Pada Blog

• Langkah pertama, login ke akun blogger sobat.
• langkah kedua, pada dashboard blogger sobat, silahkan pilih menu Layout atau tata letak
• pilih Html/Javascript
• Selanjutnya masukan kode berikut kedalamnya :

<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script type="text/javascript">
    // <![CDATA[
    var colours=new Array("#CE0FC7", "#CE0FC7", "#CE0FC7", "#CE0FC7", "#CE0FC7"); // colours for top, right, bottom and left borders and background of bubbles
    var bubbles=100; // maximum number of bubbles on screen
    var x=ox=400;
    var y=oy=300;
    var swide=800;
    var shigh=600;
    var sleft=sdown=0;
    var bubb=new Array();
    var bubbx=new Array();
    var bubby=new Array();
    var bubbs=new Array();
    window.onload=function() { if (document.getElementById) {
    var rats, div;
    for (var i=0; i<bubbles; i++) {
    rats=createDiv("3px", "3px");
    rats.style.visibility="hidden";
    div=createDiv("auto", "auto");
    rats.appendChild(div);
    div=div.style;
    div.top="1px";
    div.left="0px";
    div.bottom="1px";
    div.right="0px";
    div.borderLeft="1px solid "+colours[3];
    div.borderRight="1px solid "+colours[1];
    div=createDiv("auto", "auto");
    rats.appendChild(div);
    div=div.style;
    div.top="0px";
    div.left="1px";
    div.right="1px";
    div.bottom="0px"
    div.borderTop="1px solid "+colours[0];
    div.borderBottom="1px solid "+colours[2];
    div=createDiv("auto", "auto");
    rats.appendChild(div);
    div=div.style;
    div.left="1px";
    div.right="1px";
    div.bottom="1px";
    div.top="1px";
    div.backgroundColor=colours[4];
    div.opacity=0.5;
    if (document.all) div.filter="alpha(opacity=50)";
    document.body.appendChild(rats);
    bubb[i]=rats.style;
    }
    set_scroll();
    set_width();
    bubble();
    }}
    function bubble() {
    var c;
    if (x!=ox || y!=oy) {
    ox=x;
    oy=y;
    for (c=0; c<bubbles; c++) if (!bubby[c]) {
    bubb[c].left=(bubbx[c]=x)+"px";
    bubb[c].top=(bubby[c]=y)+"px";
    bubb[c].width="3px";
    bubb[c].height="3px"
    bubb[c].visibility="visible";
    bubbs[c]=3;
    break;
    }
    }
    for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
    setTimeout("bubble()", 40);
    }
    function update_bubb(i) {
    if (bubby[i]) {
    bubby[i]-=bubbs[i]/2+i%2;
    bubbx[i]+=(i%5-2)/5;
    if (bubby[i]>sdown && bubbx[i]>0) {
    if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
    bubb[i].width=bubbs[i]+"px";
    bubb[i].height=bubbs[i]+"px";
    }
    bubb[i].top=bubby[i]+"px";
    bubb[i].left=bubbx[i]+"px";
    }
    else {
    bubb[i].visibility="hidden";
    bubby[i]=0;
    return;
    }
    }
    }
    document.onmousemove=mouse;
    function mouse(e) {
    set_scroll();
    y=(e)?e.pageY:event.y+sleft;
    x=(e)?e.pageX:event.x+sdown; }
    window.onresize=set_width;
    function set_width() {
    if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
    }
    else if (typeof(self.innerHeight)=="number") {
    swide=self.innerWidth;
    shigh=self.innerHeight;
    }
    else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
    }
    else {
    swide=800;
    shigh=600;
    }
    }
    window.onscroll=set_scroll;
    function set_scroll() {
    if (typeof(self.pageYOffset)=="number") {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
    }
    else if (document.body.scrollTop || document.body.scrollLeft) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
    }
    else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
    sdown=document.documentElement.scrollTop;
    }
    else {
    sdown=0;
    sleft=0;
    }
    }
    function createDiv(height, width) {
    var div=document.createElement("div");
    div.style.position="absolute";
    div.style.height=height;
    div.style.width=width;
    div.style.overflow="hidden";
    return (div);
    }
    // ]]>
    </script>

Keterangan :  Kode yang saya tandai dengan warna hijau adalah kode warna dari gelembung tersebut. jika sobat menginkan warna lain, sobat bisa menggantinya dengan kode warna sesuka sobat.

• Jika sudah selesai, silahkan save dan lihat betapa cantiknya blog sobat dengan efek gelembung yang sangat unik dan menarik. hehehe

demikian yang bisa saya share pada sobat kali ini, jika ada pertanyaan mengenai cara membuat efek gelembung pada blog, silahkan tinggalkan komentar dibawah ini, terimakasih semoga bermanfaat.

Continue Reading