SDN Karangtinggil

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured post 2 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured post 3 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured post 4 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured post 5 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

Cara Membuat Menu Omni Melayang di Blog

Waktu saya berjalan-jalan di www.sakahayang.com gak sengaja nemuin artikel bagus , yaitu Cara Membuat Menu Omni Melayang di Blog , dimana script ini akan membuat menu seperti melayang atau floating di blog ..
berikut screen shot nya



Dan berikut caranya :

1. Login pada blog sobat
2. Rancangan
3. Tambah Gadget
4. Html / Javascript
5. Copy kode di bawah ini dan pasang di blog sobat

<!--menu-->
<style type="text/css">
#menu1 a {color:#000000;background-color:#FFFFFF;text-decoration:none;text-indent:1ex;}
#menu1 a:active {color:#000000;text-decoration:none;}
#menu1 a:hover {color:#000000;background-color:#FFFF99}
#menu1 a:visited {color:#000000;text-decoration:none;}
</style>

<script src="http://sakahayangdotcom.googlecode.com/files/mmenu.js" type="text/javascript"></script>

<script type="text/javascript">
resizereinit=true;
nama_menu = "SAKAHAYANG MENU";
hdingbgcolor = "#6666CC";  //warna bground nama_menu
hdingcolor  = "#FFFFFF";  //warna text nama_menu
barbgcolor = "#CC0000";  //warna bground bar
barcolor = "#FFFFFF"; //warna text

menu[1] = {
id:'menu1',
fontsize:'100%',
linkheight:22,
hdingwidth:210,

menuItems:[ // REQUIRED!!

["Menu1"], //Judul kelompok Menu1
["Item1", "URL1", ""],
["Item2", "URL2",""],
["Item3", "URL3", ""],
["Item4", "URL4", "_new"],
["Menu2", "", ""], //Judul kelompok Menu2
["Item1", "URL1", ""],
["Item2", "URL2",""],
["Item3", "URL3", "", 1, "no"],
["Item4", "URL4", "", 1]

]}; // Jangan dihapus

make_menus();
</script>
<!--eof menu-->
Bagian terakhir adalah bagian pengaturan parameter.

  • Warna sesuaikan dengan template sobat biar matching. Judul kelompok menu Tulis ["judul kelompok"],  atau ["judul kelompok","",""],  jangan lupa setiap satu item atau setelah kurung siku penutup beri tanda koma.
  • Untuk setiap item menu, penulisan  parameter pertama nama item yang akan ditampilkan, dilanjutkan URL nya. Semua parameter harus didalam tanda kutip, boleh kutip tunggal atau kutip ganda. 
  • Bila URL target akan dibuka di halaman (tab) baru pada browser maka parameter ketiga disetting "_new",
  • Bila pada satu bar akan diisi dua item maka settingannya pada parameter ke-4  diisi   angka 1 dan parameter ke-5 diisi "no".   Item ini akan  ditampilkan disebelah kiri pada bar tersebut. Untuk item disebelah kanannya cukup dengan parameter ke-4 saja diisi angka 1.
  • Untuk item menu yang terakhir  setelah  tanda kurung siku penutup  jangan diberi tanda koma.
0

Cara Membuat Tombol Share Di Bawah Posting Blog

Tombol share dalam blog sangat penting untuk meningkatkan pengunjung ke blog kamu. Namun untuk menarik perhatian agar pengunjng blog mau berbagi artikel yan dibaca ke berbagai jejaring sosial, tentunya kamu membutuhkan tombol share yang cukup keren.


1. Login ke blog kamu
2. Pilih Edit HTML > Jangan lupa Centang Expand Widget Template > Cari kode <data:post.body/>
3. Setelah ketemu letakan kode di bawah ini tepat di atas kode nomor 2.

<style>
/*--------Social Sharing Widget Below Blog Post ------*/
.sharebelow a {
display:block;
height:48px;
width:48px;
padding:0 4px;
float:left;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSD2DMsRWc00gujAYDUuKknSxjIvM-vJGSDJ8mLxkW3dKEAKbHBSv2dpxuzakYbZYLvK1Tm3KGgHkzGt8B4fK00OzkR9HD-UdAth66puOS_gPGAGEuZncX20FZAB1hONCiXVbdkNxs1SE/s1600/sharebelow.png) no-repeat;
}
.sharebelow  a.googleplus {
background-position: 0px -348px;
}
.sharebelow  a.googleplus:hover {
background-position: 0px -406px;
}
.sharebelow  a.pinterest {
background-position: 0px -464px;
}
.sharebelow  a.pinterest:hover {
background-position: 0px -522px;
}
.sharebelow  a.delicious {
background-position: 0px 0px;
}
.sharebelow  a.delicious:hover {
background-position: 0px -58px;
}
.sharebelow  a.digg {
background-position: 0px -116px;
}
.sharebelow  a.digg:hover {
background-position: 0px -174px;
}
.sharebelow  a.stumbleupon {
background-position: 0px -812px;
}
.sharebelow  a.stumbleupon:hover {
background-position: 0px -870px;
}
.sharebelow  a.technorati {
background-position: 0px -928px;
}
.sharebelow  a.technorati:hover {
background-position: 0px -406px;
}
.sharebelow  a.twitter {
background-position: 0px -928px;
}
.sharebelow  a.twitter:hover {
background-position: 0px -986px;
}
.sharebelow  a.facebook {
background-position: 0px -232px;
}
.sharebelow  a.facebook:hover {
background-position: 0px -290px;
}
.sharebelow  a.reddit {
background-position: 0px -580px;
}
.sharebelow  a.reddit:hover {
background-position: 0px -638px;
}
.sharebelow  a.rss {
background-position: 0px -696px;
}
.sharebelow  a.rss:hover {
background-position: 0px -754px;
}
.shareandbookmark{
margin:10px 0px;
color:#333333;
font-weight:bold;
font-size:18px;
font-family:sans-serif;
}
</style>
<div class='sharebelow'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="shareandbookmark">
Kindly Bookmark and Share it:</div>
<!--Facebook-->
<a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Share this on Facebook :&gt;'/>
<!--Google Plus-->
<a class='googleplus' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='external nofollow' target='_blank' title='+1 it :&gt;'/>
<!-- Twitter -->
<a class='twitter' expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Tweet this :&gt;'/>
<!-- Pinterest -->
<a class='pinterest'  href="http://pinterest.com/" rel='external nofollow' target='_blank' title='Pin it :&gt;'/>
<!-- Delicious -->
<a class='delicious' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Add this to Delicious :&gt;'/>
<!--Stumble-->
<a class='stumbleupon' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Stumble this :&gt;'/>
<!--DIGG-->
<a class='digg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='external nofollow' target='_blank' title='Digg this :&gt;'/>
<!-- Reddit -->
<a class='reddit' expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Add this to Reddit :&gt;'/>
<!--RSS -->
<a class='rss' expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' target='_blank' title='Bookmark :&gt;'/>
</b:if></div>
<div style="clear:both"/>
4. Simpan dan lihat hasilnya.
0

Spinning Social Media Icon Dengan CSS3


Sebelumnya saya juga pernah membahas cara membuat spinning social media icon dengan CSS3 di blog namun yang satu ini berbeda. Disini cara membuatnya dengan bantuan sebauh situs, jadi Anda tinggal masukin Facebook Username, Twitter Username, Feedburner Username dan Google+ id.

Dan yang lebih kerennya lagi saat mouse menyentuh icon, secara otomatis icon tersebut akan berputar.

Untuk membuat nya silahkan klik ini WIDGET GENERATOR (widget generator lateshack)

Nanti ada tiga macam jenis, kamu pilih salah satu saja.

Setelah itu Anda akan disuruh mengisi seperti di bawah ini

Contoh :

Facebook Username : BLAZERBLOG
Twitter Username : blazer_blog
Feedburner Username : blazer_blog
Google + Id : 114849896378202892510

Setelah selesai klik Add to Blogger.
0

Cara Membuat Widget Recent Comment Dengan Avatar Untuk Blog


Blazer Blog, Widget - Kali ini saya akan membahas bagaimana cara membuat widget recent comment dengan avatar untuk blog. Fungsi widget ini akan menampilkan komentar terbaru secara otomatis ditambah avatar, yang dimaksud avatar adalah gambar profil orang yang berkomentar.

Berikut cara membuat widget recent comment dengan avatar

1. Login ke blog kamu.
2. Pilih Rancangan > Add Gadget > HTML/JavaScript.
3. Copy kode di bawah ini. SCRIPT BY BLOGGERBUGIS


<div style="overflow:auto;width:300px;">
<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: none;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 40,
roundAvatar = true,
characters = 100,
defaultAvatar = "",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="https://sites.google.com/site/bloggerbugis/js/Recent_Comments_New_Bloggerbugis.js"></script>
<script type="text/javascript" src="http://blazerracing.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=3"></script>
</div>
Sekarang perhatikan baik-baik kode yang berwarna merah.

width:300px; (sesuaikan dengan lebar, supaya mudah ubah saja jadi 100%)
numComments (jumlah komentar yang ingin ditampilkan)
avatarSize (ukuran avatar atau gambar profil)
characters (jumlah kata pada komentar yang ingin ditampilkan)
0

Cara Membuat Sliding Share Melayang Di Blog

Sebelumnya saya pernah membahas tentang cara membuat menu share melayang di blog, namun sekarang dengak efek sliding, saat kursor menyentuh nya secara otomatis menu share nya akan terbuka. Dan berikut cara membuatnya.

1. Login ke blog kamu.
2. Pilih Add Gadget > Pilih HTML/JavaScript. Copy kode di bawah ini.

Script By lateshack
<script language="javascript" type="text/javascript">var _10I='==wOpkSZwF2YzV2XoUGchN2cl5WdoUGdpJ3duQnbl1Wdj9GZ7kSMwEzXoQGbph2Qk5WZwBXYuw2TspwOdBzWpcCZhVGangSZtFmTnFGV5J0c05WZtVGbFRXZn5CduVWb1N2bkBSPgw2TsBichZnC7kCTSVlL05WZtV3YvRGK05WZu9Gct92QJJVVlR2bj5WZrcSPsJXdmcyKpIXZyJXZmVmcuQnbl1Wdj9GZoQnbl52bw12bDlkUVVGZvNmbltyJ9YWZyZyJrcyav1zYyNHdld2Pv02bj5icvRXYjNXdmJ2bs1Gdo5SawF2LvoDc0RHanASPgMmcz5SMwEzXKsTKnQHcpJ3YzdCK05WZtVGbFVGdhVmcj5CduVWb1N2bkBSPgEDMx8FIyFmd7cSRzUidpR2LDNTJFNTJ2lGZvM0MlU0MlA3LDNTJFNTJh9yQzUyajFGSwITJ0NXZ0FGTFNTJyITJt92Yus2YhhGdzVGdhxmL3d3dv8SQzUCc0RHayITJENTJmVmcoBjMlE2QzUCMyUyajFGa0NXZ0FGTFNTJyITJCNTJl52buF0MlkXYsB3cpRmMyUCRzUSZslHdzBjMlA3QzUyJ9UGchN2cl9FIyFmd';var _0x362a=["ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=","","charAt","indexOf","fromCharCode","length"];function II1(_0x6ea4x2){var _0x6ea4x3=_0x362a[0];var _0x6ea4x4,_0x6ea4x5,_0x6ea4x6,_0x6ea4x7,_0x6ea4x8,_0x6ea4x9,_0x6ea4xa,_0x6ea4xb,_0x6ea4xc=0,_0x6ea4xd=_0x362a[1];do{_0x6ea4x7=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4x8=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4x9=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4xa=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4xb=_0x6ea4x7<<18|_0x6ea4x8<<12|_0x6ea4x9<<6|_0x6ea4xa;_0x6ea4x4=_0x6ea4xb>>16&0xff;_0x6ea4x5=_0x6ea4xb>>8&0xff;_0x6ea4x6=_0x6ea4xb&0xff;if(_0x6ea4x9==64){_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4);} else {if(_0x6ea4xa==64){_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4,_0x6ea4x5);} else {_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4,_0x6ea4x5,_0x6ea4x6);} ;} ;} while(_0x6ea4xc<_0x6ea4x2[_0x362a[5]]);;return _0x6ea4xd;} ;function OOI(_0x6ea4xf){var _0x6ea4x10=_0x362a[1],_0x6ea4xc=0;for(_0x6ea4xc=_0x6ea4xf[_0x362a[5]]-1;_0x6ea4xc>=0;_0x6ea4xc--){_0x6ea4x10+=_0x6ea4xf[_0x362a[2]](_0x6ea4xc);} ;return _0x6ea4x10;} ;eval(II1(OOI(_10I)));</script><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function(){jQuery(".latesthack").hover(function(){jQuery(this).stop().animate({left:"0"},"medium")},function(){jQuery(this).stop().animate({left:"-70"},"medium")},500)});
/*]]>*/
</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<style type="text/css">
.latesthack {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia48SW4LFO7SfNTHgpDDHt6nj-UD65tyqv9VeOKwjHMQagyPa4jsg7jjnmPR_-66VRn5fYWlIZWpJ2674pGDMXg5HBg4nHnENIO72ap-lfWpjPCeFcVCcrvU1663oGwS1M3xyAcREA2RM/s320/latesthack.com-image.png") no-repeat scroll right top transparent !important;
display: block;float: left;height: auto;
padding: 0 45px 0 0px;
width: 65px;
z-index: 99999;
position:fixed;
left:-70px;
top:20%;
}
.latesthack div {
border:none;
position:relative;
display:block;
}
</style>
<div class="latesthack" style="">
<div>

<div class="addthis_toolbox addthis_floating_style addthis_counter_style" >
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
<a class="addthis_button_tweet" tw:count="vertical"></a>
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
<a class="addthis_counter"></a>
<p style='font-size:8px; font-weight:bold; text-align:center;margin-top:10px;'><a href='http://blazerracing.blogspot.com' >Get This</a></p>
</div>
</div></div>
Simpan dan lihat hasilnya.
0

Cara Memasang Widget Jumlah Pengunjung Blog dari Whos.amung.us

Ada beragam widget yang bisa kita dapatkan untuk mengetahui jumlah pengunjung yang sedang online di blog kita. Salah satu widget yang saya akan bahas yaitu Whos.amung.us. Anda dapat memperoleh widget script gratis langsung langsung websitenya. Widget ini juga memiliki fungsi untuk mengetahui lokasi dari pengunjung yang datang ke blog atau situs anda. Anda juga dapat mengetahui jumlah pengunjung yang online pada jam-jam tertentu serta mengetahui apa yang halaman atau page yang dibuka oleh pengunjung. Anda tidak perlu melakukan registrasi untuk memperoleh script codenya. Anda hanya perlu mengkopi script kodenya pada blog setelah anda menentukan posisi widget pada blog. Jika anda tertarik untuk memasang widget ini ikuti trik dan tips yang satu ini:

1. Kunjungi situs http://whos.amung.us/
2. Tentukan posisi widget pada blog anda seperti dibawah ini:

3. Kopi script kodenya di atasnya.
4. Login ke Blogger
5. Masuk ke Rancangan -- Elemen Halaman
6. Tambahkan Gadjet anda, pilih HTML/JavaScript
7. Paste kode script yang sudah dikopi tadi
8. Simpan Gadjet anda!


Membuat Jumlah Total Pengunjung Di Blogger

Hay Sobat!!!, Kali  Ini Gua Bakal Ngebahas Tentang Cara Membuat Total Jumlah Pengunjung Di Blogger! Tentu Saja Selama Kita Blogging, Kita Ingin Mengetahui Statistika Peningkatan Jumlah Pengunjung Kita, Karena Hal Ini Bisa Dijadikan Motivasi Dan Alasan Untuk Pembaharuan Blog.

Nah, Bagi Kalian Yan   Pingin Buat Gadget Statistika Peningkatan Jumlah Blog. Bisa Ikuti Langkah Di Bawah Ini Untuk Membuat Jumlah Total Pengunjung Di Blogger.

1) Login Ke Blogger Anda
2) Masuk Ke Rancangan > Elemen Laman > Tambah Gadget
3) Pilih  Statistik Blog
4) Aturlah Tampilan Gadgetnya
5) Save
0

Cara Memasang Widget Jumlah Pengunjung Blog dari Whos.amung.us

Ada beragam widget yang bisa kita dapatkan untuk mengetahui jumlah pengunjung yang sedang online di blog kita. Salah satu widget yang saya akan bahas yaitu Whos.amung.us. Anda dapat memperoleh widget script gratis langsung langsung websitenya. Widget ini juga memiliki fungsi untuk mengetahui lokasi dari pengunjung yang datang ke blog atau situs anda. Anda juga dapat mengetahui jumlah pengunjung yang online pada jam-jam tertentu serta mengetahui apa yang halaman atau page yang dibuka oleh pengunjung. Anda tidak perlu melakukan registrasi untuk memperoleh script codenya. Anda hanya perlu mengkopi script kodenya pada blog setelah anda menentukan posisi widget pada blog. Jika anda tertarik untuk memasang widget ini ikuti trik dan tips yang satu ini:

1. Kunjungi situs http://whos.amung.us/
2. Tentukan posisi widget pada blog anda seperti dibawah ini:

3. Kopi script kodenya di atasnya.
4. Login ke Blogger
5. Masuk ke Rancangan -- Elemen Halaman
6. Tambahkan Gadjet anda, pilih HTML/JavaScript
7. Paste kode script yang sudah dikopi tadi
8. Simpan Gadjet anda!

Copyright: Blog Trik dan Tips - http://blogtrikdantips.blogspot.com/2012/03/memasang-widget-jumlah-pengunjung-blog.html#ixzz2J99DeP91
Tolong sertakan link ini jika mengkopi artikel diatas. Terima kasih
0

Berbagai Widget Efek Untuk Blogspot


Anda bosan dengan tampilan blog anda yg terkesan monoton ??
atau anda ingin menghias blog tetapi anda tidak tahu bagaimana caranya ??

Saya punya solusinya. Disini saya akan membantu anda semua untuk membuat berbagai efek-efek yang akan anda pasang pada blog anda.
Langsung saja anda pilih-pilih efek blog dibawah ini (pilih-pilih kayak toserba). Cara widget ini berada dibawah setelah anda pilih-pilih widget dibawah ini.

Efek Tampilan

1. Efek Salju

<script src='http://tateluproject.googlecode.com/files/snow.js' type='text/javascript'></script>

2. Kembang Api

<script src='http://tateluproject.googlecode.com/files/kembangapi.js' type='text/javascript'></script>

3. Bintang

<script src='http://tateluproject.googlecode.com/files/bintang.js' type='text/javascript'></script>

4. Gelembung

<script src='http://tateluproject.googlecode.com/files/efek-gelembung.js' type='text/javascript'></script>

Untuk yang dibawah ini saya dapat dari http://www.netdisaster.com/.

1. Meteor

<script language="javascript">
nd_mode="meteor";
nd_control="on";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>

2. Ufo

<script language="javascript">
nd_mode="ufo";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>

3. Graffity

<script language="javascript">
nd_mode="graff";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>
4. Paint Ball
<script language="javascript">
nd_mode="paint";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>
5. Lebah
<script language="javascript">
nd_mode="wasp";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>
6. Lalat
<script language="javascript">
nd_mode="fly";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>
7. Semut
<script language="javascript">
nd_mode="ants";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>
8. Siput
<script language="javascript">
nd_mode="snail";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://tateluproject.googlecode.com/files/efek.js"></script>
<div style="position: fixed; bottom: 0px; right: 20px;width:100px;height:30px;"><small><center><a href="http://komangasteva.blogspot.com/2012/07/berbagai-efek-tampilan-blog.html" target="_blank">widget</a></center></small></div>
Cara Pemasangan.
1. Buka dashboard blog anda melalui www.blogger.com, isikan email dan password anda.
2. Buka Tata Letak blog anda.
3. Pilih Add widget (tambah widget).
4. Pilih HTML/Javascript.
5. Masukkan  script kode widget yang sudah anda pilih tadi.
Terakhir, klik tombol Simpan  dan lihat blog anda.
Selamat anda berhasil !!!
0

Cara membuat tulisan berjalan di Address Bar

Cara membuat tulisan berjalan di Address Bar agar tampil lebih cantik. Dengan cara membuat tulisan berjalan di Address Bar, maka pada bagian tulisan yang anda masukkan tambahkan di kode nantinya setelah muncul di Address Bar akan terlihat berjalan dengan kecepatan yang bisa anda atur atau tentukan. Anda hanya perlu memasukkan kode di Template blog dan memasukkan kode pada bagian yang sudah ditentukan seperti yang tertulis dilangkah-langkah dibawah ini. Sebelum anda memasukkan kode tersebut, silahkan ganti kata yang kami tulis miring tebal pada kode di bawah. Nah, untuk cara membuat tulisan berjalan di Address Bar selengkapnya, mari kita simak langkah cara membuat tulisan berjalan di Address Bar.



Langkah membuat efek tulisan berjalan di Address Bar:


1. Login ke Blogger dan masuk ke dasbord anda
2. Klik > Template, klik > Edit HTML, > Lanjutkan
3. Cari kode </head>
4. Letakkan kode berikut di bawah kode </head>


    <script type='text/javascript'>
    //<![CDATA[
    msg = " --- ISI DENGAN KATA ANDA ";
    msg = " | ISI DENGAN KATA ANDA | ISI DENGAN KATA ANDA | ISI DENGAN KATA ANDA | ISI DENGAN KATA ANDA --- " + msg;pos = 0;
    function scrollMSG() {
    document.title = msg.substring(pos, msg.length) + msg.substring(0, pos); pos++;
    if (pos > msg.length) pos = 0
    window.setTimeout("scrollMSG()",100);
    }
    scrollMSG();
    //]]>
    </script>

5. Klik Simpan Template, > tutup

Anda ganti tulisan ISI DENGAN KATA ANDA pada kode diatas. Sekian tips cara membuat tulisan berjalan di Address Bar atau Alamat Bar untuk kali ini, selamat mencoba, semoga berhasil, salam sukses.
0

Cara Membuat Tombol Share Melayang di Samping Blog


Selamat sore kawan-kawan.Sore ini saya akan membagikan sedikit ilmu mengenai Cara Membuat Tombol Share Melayang di Samping Blog.Cara yang baru aku dapatkan dari salah satu hobbyku, blogwalking.Untuk mempersingkat waktu, karena hari selasa besok tanggal 5 Juni saya akan menjalani UAS langsung saja ikuti tutorial di bawah ini.
STEP 1 :
1. Login ke akun blog sobat
2. Masuk Template --> Edit HTML --> Lanjutkan
3. Centang Expand Template Widget
4. Cari kode <head> (Gunakan Ctrl+F untuk mempercepat pencarian)
5. Copy kode di bawah ini dan pastekan tepat di bawah kode <head> 
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
6. Kemudian Klik Simpan Template.
STEP 2 :
1. Pilih Tata letak 
2. Klik Tambah Gadget --> HTML/Javascript
3. Copy dan pastekan salah satu kode pilihan dibawah ini
Background warna Silver :

<!-- Floating social media buttons by www.howbler.com --><style>#floatingbuttons{background:#aaa;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #f2f2f2), color-stop(1, #aaa));background:-moz-linear-gradient(top, #f2f2f2, #aaa);border:1px solid #808080;float:left;padding:0 0 3px 0;position:fixed;bottom:15%;left:0;z-index:10;border-radius:0 5px 5px 0;box-shadow:2px 2px 5px rgba(0,0,0,0.3);} #floatingbuttons .floatbutton{float:left;clear:both;margin:5px 4px 0 4px;} .addbuttons{clear:both;text-align:center;padding-top:5px;} .addbuttons a span.getfloat, .addbuttons a span.sharebuttons{color:#fff;background:none;font-family:arial, sans-serif;display:block;font-size:9px;font-weight:bold;text-decoration:none;line-height:11px;} .addbuttons a:hover span{color:#fff;background:none;text-decoration:underline;}</style>
<div id='floatingbuttons' title="Share this post!"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><script type="text/javascript"> (function() { var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0]; s.type = 'text/javascript'; s.async = true; s.src = 'http://widgets.digg.com/buttons.js'; s1.parentNode.insertBefore(s, s1); })(); </script><!-- Medium Button --><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script><div class='floatbutton' id='facebook'><fb:like layout="box_count" show_faces="false" font=""></fb:like></div><div class='floatbutton' id='google+1'><g:plusone size="tall"></g:plusone></div><div class='floatbutton' id='twitter'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a></div><div class='floatbutton' id='linkedin'><script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top"></script></div><div class="addbuttons"><a href="http://brilliandwi.blogspot.com/2012/06/cara-membuat-tombol-share-melayang-di.html" title="Add floating social media share buttons to your blog!"><span class="getfloat">Get floating</span><div style="clear:both"></div><span class="sharebuttons">share buttons</span></a> </div> </div><!-- end Floating social media buttons by www.howbler.com -->
Background warna Merah :
 
 
<!-- Floating social media buttons by www.howbler.com --><style>
#floatingbuttons{background:#C12424;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #F54F4F), color-stop(1, #C12424));background:-moz-linear-gradient(top, #F54F4F, #C12424);border:1px solid #B31919;float:left;padding:0 0 3px 0;position:fixed;bottom:15%;left:0;z-index:10;border-radius:0 5px 5px 0;box-shadow:2px 2px 5px rgba(0,0,0,0.3);} #floatingbuttons .floatbutton{float:left;clear:both;margin:5px 4px 0 4px;} .addbuttons{clear:both;text-align:center;padding-top:5px;} .addbuttons a span.getfloat, .addbuttons a span.sharebuttons{color:#fff;background:none;font-family:arial, sans-serif;display:block;font-size:9px;font-weight:bold;text-decoration:none;line-height:11px;} .addbuttons a:hover span{color:#fff;background:none;text-decoration:underline;}</style>
<div id='floatingbuttons' title="Share this post!"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><script type="text/javascript"> (function() { var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0]; s.type = 'text/javascript'; s.async = true; s.src = 'http://widgets.digg.com/buttons.js'; s1.parentNode.insertBefore(s, s1); })(); </script><!-- Medium Button --><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script><div class='floatbutton' id='facebook'><fb:like layout="box_count" show_faces="false" font=""></fb:like></div><div class='floatbutton' id='google+1'><g:plusone size="tall"></g:plusone></div><div class='floatbutton' id='twitter'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a></div><div class='floatbutton' id='linkedin'><script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top"></script></div><div class="addbuttons"><a href="http://brilliandwi.blogspot.com/2012/06/cara-membuat-tombol-share-melayang-di.html" title="Add floating social media share buttons to your blog!"><span class="getfloat">Get floating</span><div style="clear:both"></div><span class="sharebuttons">share buttons</span></a> </div> </div><!-- end Floating social media buttons by www.howbler.com -->

Background warna Biru :


<!-- Floating social media buttons by www.howbler.com --><style>
#floatingbuttons{background:#295698;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #3980E6), color-stop(1, #295698));background:-moz-linear-gradient(top, #3980E6, #295698);border:1px solid #1E4A8A;float:left;padding:0 0 3px 0;position:fixed;bottom:15%;left:0;z-index:10;border-radius:0 5px 5px 0;box-shadow:2px 2px 5px rgba(0,0,0,0.3);} #floatingbuttons .floatbutton{float:left;clear:both;margin:5px 4px 0 4px;} .addbuttons{clear:both;text-align:center;padding-top:5px;} .addbuttons a span.getfloat, .addbuttons a span.sharebuttons{color:#fff;background:none;font-family:arial, sans-serif;display:block;font-size:9px;font-weight:bold;text-decoration:none;line-height:11px;} .addbuttons a:hover span{color:#fff;background:none;text-decoration:underline;}</style>
<div id='floatingbuttons' title="Share this post!"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><script type="text/javascript"> (function() { var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0]; s.type = 'text/javascript'; s.async = true; s.src = 'http://widgets.digg.col/buttons.js'; s1.parentNode.insertBefore(s, s1); })(); </script><!-- Medium Button --><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script><div class='floatbutton' id='facebook'><fb:like layout="box_count" show_faces="false" font=""></fb:like></div><div class='floatbutton' id='google+1'><g:plusone size="tall"></g:plusone></div><div class='floatbutton' id='twitter'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a></div><div class='floatbutton' id='linkedin'><script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top"></script></div><div class="addbuttons"><a href="http://brilliandwi.blogspot.com/2012/06/cara-membuat-tombol-share-melayang-di.html" title="Add floating social media share buttons to your blog!"><span class="getfloat">Get floating</span><div style="clear:both"></div><span class="sharebuttons">share buttons</span></a> </div> </div><!-- end Floating social media buttons by www.howbler.com -->

Background warna Hitam :

<!-- Floating social media buttons by www.howbler.com --><style>
#floatingbuttons{background:#333;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #656565), color-stop(1, #333));background:-moz-linear-gradient(top, #656565, #333);border:1px solid #222;float:left;padding:0 0 3px 0;position:fixed;bottom:15%;left:0;z-index:10;border-radius:0 5px 5px 0;box-shadow:2px 2px 5px rgba(0,0,0,0.3);} #floatingbuttons .floatbutton{float:left;clear:both;margin:5px 4px 0 4px;} .addbuttons{clear:both;text-align:center;padding-top:5px;} .addbuttons a span.getfloat, .addbuttons a span.sharebuttons{color:#fff;background:none;font-family:arial, sans-serif;display:block;font-size:9px;font-weight:bold;text-decoration:none;line-height:11px;} .addbuttons a:hover span{color:#fff;background:none;text-decoration:underline;}</style>
<div id='floatingbuttons' title="Share this post!"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><script type="text/javascript"> (function() { var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0]; s.type = 'text/javascript'; s.async = true; s.src = 'http://widgets.digg.com/buttons.js'; s1.parentNode.insertBefore(s, s1); })(); </script><!-- Medium Button --><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script><div class='floatbutton' id='facebook'><fb:like layout="box_count" show_faces="false" font=""></fb:like></div><div class='floatbutton' id='google+1'><g:plusone size="tall"></g:plusone></div><div class='floatbutton' id='twitter'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a></div><div class='floatbutton' id='linkedin'><script type="text/javascript" src="http://platform.linkedin.com/in.js"></script><script type="in/share" data-counter="top"></script></div><div class="addbuttons"><a href="http://brilliandwi.blogspot.com/2012/06/cara-membuat-tombol-share-melayang-di.html" title="Add floating social media share buttons to your blog!"><span class="getfloat">Get floating</span><div style="clear:both"></div><span class="sharebuttons">share buttons</span></a> </div> </div><!-- end Floating social media buttons by www.howbler.com -->

 
2

Membuat Like Fans page

Trik Pertama
By Widarto uji K

&lt;p&gt;Your browser does not support iframes.&lt;/p&gt;
BLOG RANGGA
Widget Like Box Fans Facebook memang sudah tidak asing lagi nama itu bagi para blogger selain berguna sebagai penghubung blog dengan jejaring sosial facebook ini , widget ini juga berguna sebagai sarana melihat berapa banyak yang menyukai blog tersebut dengan melihat jumlah like dari pengguna facebook , semakin banyak like yang di dapat berarti semakin banyak yang menyukai blog tersebut .

Kemarin saya juga sudah pernah berbagi tentang cara memasang like box facebook di blog dengan judul Cara Pasang Like Box Facebook Di Bawah Postingan Blog yaitu like fan page facebook nya di letakan di bawah postingan blog atau di atas form komentar blog dan kali ini saya berbagi lagi hal serupa tapi tak sama yaitu widget ini akan di tempatkan tersembunyi di samping blog , like box fan page nya akan berfungsi pada saat cursor melalui button widget tersebut seperti contoh di samping kanan blog ini ( lalui cursor sobat ke button/ tombol yang ada tulisan facebook nya dan jagan lupa sekalian di like ya....!!! )

Kalau sobat ingin mencoba Cara Membuat Widget Like Box Fans Facebook Tersembunyi Di Blog sobat ikuti lah cara nya di bawah ini :
  1. Login dulu ke blogger.
  2. Pilih Template di dasbor blog.
  3. Pilih Edit HTML 
  4. Centang dulu Expand Template Widget.
  5. Cari kode </head> di Template blog . 
  6. pasang kode di bawah ini sebelum kode atau diatas kode </head>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/> 
  7. Simpan Template.
  8. Pilih Tata Letak di dasbor blog
  9. Klik Salah satu tambah gadged/add a gadged.
  10. Pilih HTML/Javascript .
  11. Pasang kode di bawah ini ke halaman HTML/Javascript
            <script type="text/javascript">
            //<!--
            $(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
            //-->
            </script>
            <style type="text/css">
            .floatinglikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggzCKbcQPWpHC0P53Vjftyo-w7bF-6sqj46B8Fb4wsYK_WCea1eV-utntfNHaHH5_iKh81eVh_ehPsRRie5NeyXoY6bvpqACOLXoeHEnSIVcN1bjI6Mj7zvy0WCemcZMD0f3W1VaX1GY3C/s1600/floatingfbpng1.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
            .floatinglikebox div{border:none;position:relative;display:block;}
            .floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
            .floatinglikebox span a{color: #808080;text-decoration:none;}
            .floatinglikebox span a:hover{text-decoration:underline;}
            </style><div class="floatinglikebox" style=""><div><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Blog-rangga/***************&amp;width=251&amp;height=270&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23cccccc&amp;stream=false&amp;header=false&amp;appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#ffffff;" allowtransparency="true"></iframe><span><a href="http://blog-rangga.blogspot.com/2013/01/cara-membuat-like-box-fans-facebook.html" target="_blank">Get Widget</a></span></div></div>
  12. Terakhir Klik simpan kode

Trik Kedua
By Widarto uji K

 hy , gan makasih ya udah berkunjung ke blog saya, mohon apa bila nanti meninggalkan blog saya tinggalkan jejak ya,, biar saya kunjungi balik oke....


bagi sobat yang ingin  tau caranya silahkan lanjutkan membacanya
heheheheee

langsug ajah deh, nih tutorialnya


1. masuk blogger''
2..rancangan/ design
3. elemen laman
4. add gadget
5. pilih HTML/java script
masukin script nya

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style>
<div class="w2bslikebox">
<div>


<iframe frameborder="0" scrolling="no" src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/ahmadbjblogs/%0A&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=250" style="background: #fff; border: medium none; height: 250px; overflow: hidden; width: 245px;"></iframe></div>
</div>
</div>


kemudian ganti http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png   dengan url gambar yang anda ingin kan, untuk url bisa di cari di google gambar cari gambar yang anda inginkan copy URL nya buat mengganti url di atas,,

 atau juga gambar nya bisa buat sendiri kemudian di upload di photobucket ambil url gambar nya buat mengganti url di atas

ganti  http://www.facebook.com/ahmadbjblogs/ dengan alamat fans page blog anda , oh ya gak di ganti juga gak papa biar fans page blog saya di blog anda hehehee just kidding,,,, 

oh ya kalau belum punya fans page blog di facebook silahkan buat dulu nih cara buat nya bisa liat di sini
 Tutorial membuat fans page Blog di fb dan menampilkanya pada blog


6. oke kemudian save,,,


tunggu dulu ini belum selesai

nah selanjutnya

7. masuk ke EDIT HTML

cari kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

copy paste kode tersebut di atas </head>

7. simpan Template

ettzzzzz tunggu dulu belum selesai selanjutnya anda harus coment heheheheheeeee


 
0

share bawah

Kindly Bookmark and Share it:

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More