Cara Mudah Membuat Aplikasi Android Untuk Blogmu

Selamat siang sobat blogger semuanya bagaimana kabar sobat semua? maaf sekali sebelumnya karena blog ini sudah lama sekali tidak update atau posting artikel karena berbagai macam kesibukan yang saya alami, sekarang mumpung agak nyantai saya sempatkan untuk update artikel.

Langsung saja, kali ini saya ingin berbagi ilmu kepada sobat semua tentang bagaimana caranya agar blog kita bisa di bikin aplikasi android. Sekarang lagi zamannya android sob dimana mana pada pakai android semua, jadi saya punya pikiran gimana caranya agar blog saya ini bisa dibuat aplikasi untuk android.

Ternyata sangat mudah kawan, langkahnya seperti dibawah ini:

1. sobat pergi ke situs ini http://www.appsgeyser.com 
2. Klik Create now
3. Kemudian pilih aplikasi untuk membuat website seperti contoh dibawah ini








4. Setelah selesai kemudian isi form url dll seperti dibawah ini

5. Setelah selesai kemudian klik create app
6. Setelah jadi ada tampilan seperti dibawah ini

7. Sobat bisa langsung download aplikasinya dan sobat juga bisa langsung publish aplikasinya di google play. Contoh aplikasi blog ini bisa di download aplikasi Thefreaks250

Bagaimana kawan, mudah bukan?? kini sobat bisa punya aplikasi android sendiri untuk blog sobat dan bisa diunduh langsung dari google play.

Semoga dapat membantu.. ingat blogger yang baik selalu meninggalkan komentar yang baik pula :D

Read More..

Cara memasang widget speedtest mini pada blog

Selamat malam sobat blogger semua, ah saya kehabisan ide nih mau posting apaan, tapi untungnya selalu muncul saja ide itu :D

Kali ini saya ingin berbagi bagaimana cara memasang speedtest mini pada blog. Ada yang belum tahu apa itu speedtest?speedtest itu adalah sebuah website yang mengukur berapa kecepatan internet kita, sobat bisa langsung kunjungi websitenya http://speedtest.net kalau buat modem yang super lelet jangan harap deh bisa buka web tersebut karena dia pakai flash yang otomatis berat loadingnya hehehe peace :D

Buat contoh, agan bisa lihat speed internet di tempat kerja saya

Nah sekarang bagaimana cara memasang speedtest mini pada blog sobat?langsung saja, gini caranya:

•  Login ke blog tentunya
• Ke Tata Letak -> Tambah Gadjet
• Pilih Html/Javascript
• Kemudian masukkan script dibawah ini
  <embed menu="false" quality="high" bgcolor="#171715" name="minitest" id="minitest" style="" src="http://www.speedtest.net/mini/speedtest.swf?v=2.0.7" type="application/x-shockwave-flash" width="450" height="250">
• Simpan

Sobat bisa mengganti tinggi dan lebarnya sesuai keperluan, semoga tipsnya dapat membantu :)

Read More..

Membuat Kolom Scroll pada Blog Archive

Selamat sore semua..setelah sekian lama sibuk dan gak punya ide mau buat tulisan apa akhirnya saya punya ide membuat kolom scroll pada blog saja deh..

Biasanya lebih gampang untuk menambah kotak kolom pada add widget -> html/javascript, tapi untuk blog archieve kita harus merubahnya lewat template, tapi sebelumnya sobat harus menambahkan dulu widget archieve pada blog sobat, sudah tahu kan cara menambahnya? add widget -> archieve. Tujuannya dari membuat kolom ini jelas untuk memotong agar archieve nya tidak terlalu panjang kebawah. Langsung saja sobat ikuti cara dibawah ini

1. Pertama sobat ke menu rancangan -> edit html
2. Jangan lupa centang Expand Widget Templates
3. Sobat cari kode berikut <div id='ArchiveList'> ingat sobat sebelumnya sudah memasang widget archieve terlebih dahulu ya, kalau belum ya nggak ada kodenya.
4. Setelah ketemu, sobat masukkan script dibawah ini sebelum kode diatas
   <div style="border: 1px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 200px; background-color: #FFFFFF;"> 
5. Kalau sudah, sobat cari kode dibawah ini <b:include name='quickedit'/> sobat tinggal geser kebawah sedikit, nggak perlu Ctrl+F 
6. Setelah ketemu, sobat copy </div> dan letakkan diatas kode <b:include name='quickedit'/> tadi
7. Simpan Template

Sobat bisa mengatur height atau width atau juga warna background nya
Note : Tidak semua template sama, tapi cara ini berhasil di template blog saya

Semoga dapat sedikit membantu sobat semua :)

Read More..

Membuat Slideshow Postingan di blog

Selamat malam sobat blogger, senang sekali rasanya bisa ada ide lagi untuk berbagi bersama sobat blogger semua. Kali ini saya mau berbagi sedikit tentang membuat slideshow postingan di blog.

Mungkin kalau yang biasa saja terkadang kit merasa bosan dan artikel yang sudah kita buat terkadang tidak kebagian untuk dibaca oleh pengunjung lainnya. Nah dengan adanya slideshow postingan diharapkan dapat membuat artikel yang lama dapat dibaca kembali karena dapat menampilkannya secara acak.

Untuk mempersingkat, langsung saja :

• Klik tambah gadget terus pilih html/javascript
• Kemudian masukkan script dibawah ini
  <style type="text/css">
  #rp_plus_img{height:385px;overflow:hidden;border:0;padding:6px 10px 14px 5px;background: transparant;}
  #rp_plus_img ul{list-style-type:none;margin:0;padding:0}
  #rp_plus_img li{border:solid 1px #585858; margin:0; padding:0; list-style:none;}
  #rp_plus_img li{height:85px;padding:5px;list-style:none;}
  #rp_plus_img a{color:#000;}
  #rp_plus_img .news-title{display:block;font-weight:bold !important;margin-bottom:4px;font-size:12px;}
  #rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #585858;width:65px;height:65px;}
  </style>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script type="text/javascript" src="http://thefreaks250.my-place.us/script/Slideshow%20Postingan.js"></script>
  <script type="text/javascript">
  var speed = 1500;
  var pause = 3500;
  $(document).ready(function(){
  rpnewsticker();
  interval = setInterval(rpnewsticker, pause);
  });
  </script>
  <ul id="rp_plus_img">
  <script style="text/javascript">
  var numposts = 5;
  var numchars = 20;
  </script>
  <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
  </ul>
• Kemudian save

Mudah kan??silahkan sobat bereksperimen..Semoga artikelnya dapat bermanfaat :)

Read More..

Menghilangkan Attribution di Blog

Mumpung lagi nganggur nih, dari pada bengong mending share sama sobat semua..

Kali ini saya berbagi bagaimana menghilangkan attribution di blog yang saya dapat di blog tetangga, terima kasih sebelumnya tapi saya lupa nama blognya hehehe

 

Langsung saja caranya adalah :

1. Login Blog sobat masing masing
2. Klik Template -> Edit Html
3. Centang Expand Template Widget
4. Cari ]]></b:skin> kemudian masukkan kode dibawah tepat diatas kode tadi
   
   #Attribution1 {
   height:0px;
   visibility:hidden;
   display:none
   }
5. Simpan

Sekarang lihat hasilnya, semoga dapat membantu :)

Read More..

Memasang kotak pencarian pada blog

Selamat malam sobat blogger semua. Pada artikel kali ini saya akan berbagi tentang bagaimana sih cara memasang kotak pencarian di blog?

Caranya cukup sederhana dan mungkin juga sudah banyak dibahas di blog tetangga, tapi nggak apa apa ini buat yang belum tahu saja :D ok langsung saja gan.

Caranya adalah :

• Biasa login blog masing masing
• Masuk ke Tata Letak -> Tambah Gadget
• Pilih HTML/Javascript Terus masukkan script dibawah ini
  
  <style type="text/css">
  #search{position:absolute;top:80px;right:200px}
  .search form{width:260px;height:30px;background:transparent url(&#39;http://4.bp.blogspot.com/-6sVCcXv5sLw/Tkl5X1gF0KI/AAAAAAAAASY/AWOycgLsW1M/s1600/searchform.png&#39;) no-repeat 0 0;position:relative}
  .search input#search-text{position:absolute;left:10px;top:0;border:0;background:none;width:150px;height:30px;line-height:25px;color:#7b7b7b}
  .search input#search-submit{position:absolute;top:0;right:0;width:73px;background:none;border:none;cursor:pointer;height:26px;line-height:26px}
  .status-msg-wrap{display:none}.status-msg-body{display:none}
  .status-msg-border{display:none}
  </style>
  <div id='pencarian'>
  <div class='search'>
  <form action='/search' id='search-form' method='get'>
  <input id='search-text' name='q' placeholder='Pencarian Kata Kunci' type='text'/>
  <input id='search-submit' name='' type='submit' value=''/>
  </form>
  </div>
  </div>
  
  
  Selesai, simpan lalu sobat coba sendiri..Semoga artikelnya dapat sedikit membantu sobat semua :)
  

Read More..

Membuat gulungan kertas pada blog

Selamat sore semuanya, senang sekali bisa punya kesempatan buat ngeblog lagi uhuy hehehe
Kali ini saya akan berbagi tentang membuat gulungan kertas pada blog. Setiap blogger pasti ingin menghias blognya seindah mungkin agar setiap pengunjung yang datang bisa betah berada dalam blog tersebut. Nah salah satunya adalah dengan membuat gulungan kertas, sobat tahu kan seperti yang ada pada pojok kanan blog ini, terdapat gulungan kertas tersebut. Nah kali ini saya ingin berbagi bagaimana cara membuatnya.

Ya sudah langsung saja cara - caranya seperti di bawah ini:

1. Jangan lupa login blog masing masing
2. Kemudian masuk edit html -> centang expand Template Widget
3. Cari kode ini </body>, tahu lah caranya...
4. Setelah ketemu, masukkan script dibawah ini, tepat di atas kode </body>
   <script type='text/javascript'>var tujuan ='URL'</script>
   <script src='http://thefreaks250.my-place.us/script/facebook.js' type='text/javascript'></script>
5. Simpan Templat

Ganti tulisan yang berwarna merah dengan url sobat, sobat juga bisa mengganti gambar yang ada didalamnya dengan gambar milik sobat sendiri. Semoga dapat membantu ya..kalau ada yang tidak mengerti silahkan bertanya :)

Read More..

Cara mudah agar posting blog otomatis terupdate ke twitter

Thefreaks250 Pada artikel sebelumnya Thefreaks250 pernah memuat artikel tentang Cara agar posting blog otomatis terupdate ke fanpage facebook

kali ini saya akan share tentang bagaimana cara agar posting blog kita otomatis terupdate ke twitter.

Twitter adalah jejaring sosial terbesar di dunia, sama seperti facebook. Agar postingan kita dapat langsung terupdate pada twitter, kita perlu melakukan langkah langkah sebagai berikut:

1. Pergi ke link berikut ini http://app.dlvr.it/
2. Kalau belum punya akun langsung sign up saja
3. Setelah daftar sobat bisa langsung login dan masukkan rss blog sobat
   
   
   
4. Klik Next, pada Step 2 pilih twitter, facebook juga bisa terus klik continue
5. Akan muncul ucapan selamat datang, kemudian klik + add untuk menambah tujuan share posting via twitter
6. Selesai, jangan lupa untuk konfirmasi pendaftaran via email

Postingan akan langsung terupdate ke twitter,Semoga artikelnya dapat membantu, bila ada yang tidak mengerti sobat bisa tanyakan melalui komentar dibawah.....

Read More..

Membuat Navigasi Halaman Keren di Blog

Selamat malam sobat blogger semuanya..

Kali ini saya mau posting tentang membuat halaman blog yang keren. Tutorial ini mungkin sudah banyak dibahas di blog blog lain, kalau disini saya berani posting sesuatu karena saya telah berhasil membuatnya, sobat tahu kan apa itu Navigasi halaman??ya pasti tahu dong kalau buka google juga ada di bawah tuh yang nomor nomor, seperti yang saya punya dibawah ini sob. Ok deh langsung Praktek saja.

Sobat pasti sudah tahu dong gimana edit html?saya anggap sudah tahu dah

1. Kode Css, copy kode dibawah ini diatas kode </b:skin>
   

   
   .pagenavi{
   clear:both;margin:10px auto;text-align:center
   }
   .pagenavi span,.pagenavi a{
   padding:10px;
   margin-right:5px;
   padding-top:5px;
   padding-bottom:5px;
   background:#FFFFFF;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   }
   .pagenavi a:hover,.pagenavi .current{
   background:#ff8400;color:#fff;text-decoration:none
   }
   .pagenavi .pages,.pagenavi .current{
   font-weight:bold
   }
   .pagenavi .pages{border:none}

2. Javascript, cari kode berikut ini
   <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'> 
3. Setelah ketemu Paste Kode ini dibawah kode javascript diatas
   
   <b:includable id='page-navi'>
   <div class="pagenavi">
   <script type="text/javascript">
   var pageNaviConf = {
   perPage: 5,
   numPages: 5,
   firstText: "First",
   lastText: "Last",
   nextText: &quot;&#187;&quot;,
   prevText: &quot;&#171;&quot; }
   </script>
   <script type="text/javascript" src="http://rilwis.googlecode.com/svn/trunk/blogger/pagenavi.min.js"></script>
   <div class="clear" />
   </div>
   </b:includable>
4. Cari lagi kode ini <!-- navigation --><b:include name='nextprev'/>
5. Ganti dengan Kode dibawah ini
   

   <b:if cond='data:blog.pageType == "index"'>
   <b:include name='page-navi' />
   <b:else/>
   <b:if cond='data:blog.pageType == "archive"'>
   <b:include name='page-navi' />
   </b:if>
   </b:if>  

Nah Selesai, sobat Tinggal memilih salah satu navigasi halaman yang keren keren dibawah ini

Ingat pilih salah satu kode dibawah yang sobat suka lalu taruh diatas </b:skin>

.pagenavi span, .pagenavi a {
display: inline-block;
padding: 0px 9px;
margin-right: 4px;
border-radius: 3px;
border: solid 1px #c0c0c0;
background: #e9e9e9;
box-shadow: inset 0px 1px 0px rgba(255,255,255, .8), 0px 1px 3px rgba(0,0,0, .1);
font-size: .875em;
font-weight: bold;
text-decoration: none;
color: #717171;
text-shadow: 0px 1px 0px rgba(255,255,255, 1);
}


.pagenavi span:hover,.pagenavi a:hover {
background: #fefefe;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FEFEFE), to(#f0f0f0));
background: -moz-linear-gradient(0% 0% 270deg,#FEFEFE, #f0f0f0);
}


.pagenavi a.current {
border: none;
background: #616161;
box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
color: #f0f0f0;
text-shadow: 0px 0px 3px rgba(0,0,0, .5);
}

.pagenavi span, .pagenavi a {
display: inline-block;
padding: 0px 9px;
margin-right: 4px;
border-radius: 3px;
border: solid 1px #32373b;
background: #3e4347;
box-shadow: inset 0px 1px 1px rgba(255,255,255, .1), 0px 1px 3px rgba(0,0,0, .1);
font-size: .875em;
font-weight: bold;
text-decoration: none;
color: #feffff;
text-shadow: 0px 1px 0px rgba(0,0,0, .5);
}
.pagenavi span:hover,.pagenavi a:hover {
background: #3d4f5d;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#547085), to(#3d4f5d));
background: -moz-linear-gradient(0% 0% 270deg,#547085, #3d4f5d);
}
.pagenavi a.current {
border: none;
background: #616161;
box-shadow: inset 0px 0px 8px rgba(0,0,0, .5), 0px 1px 0px rgba(255,255,255, .8);
color: #f0f0f0;
text-shadow: 0px 0px 3px rgba(0,0,0, .5);
}

.pagenavi {
width:300px;
margin: 50px auto;
}
.pagenavi span, .pagenavi a {
background: #f7f7f7;
background: -webkit-linear-gradient(top, #f7f7f7 0%,#f5f5f5 52%,#ebebeb 100%);
background: -moz-linear-gradient(top, #f7f7f7 0%,#f5f5f5 52%,#ebebeb 100%);
background: -o-linear-gradient(top, #f7f7f7 0%,#f5f5f5 52%,#ebebeb 100%);
background: -ms-linear-gradient(top, #f7f7f7 0%,#f5f5f5 52%,#ebebeb 100%);
background: linear-gradient(top, #f7f7f7 0%,#f5f5f5 52%,#ebebeb 100%);
padding: 5px 10px;
text-decoration: none;
color: #7e7e7e;
border: 1px solid #c6c6c6;
-webkit-box-shadow: inset 0 4px 3px rgba(255,255,255,0.6), 0 1px 3px rgba(0,0,0,.2);
-moz-box-shadow: inset 0 4px 3px rgba(255,255,255,0.6), 0 1px 3px rgba(0,0,0,.2);
box-shadow: inset 0 4px 3px rgba(255,255,255,0.6), 0 1px 3px rgba(0,0,0,.2);
font-weight: bold;
border-radius:3px;
}
.pagenavi span:hover,.pagenavi a:hover, .pagenavi a.current {
background: #9ad6fb;
background: -webkit-linear-gradient(top, #9ad6fb 0%,#77c4fc 100%);
background: -moz-linear-gradient(top, #9ad6fb 0%,#77c4fc 100%);
background: -o-linear-gradient(top, #9ad6fb 0%,#77c4fc 100%);
background: -ms-linear-gradient(top, #9ad6fb 0%,#77c4fc 100%);
background: linear-gradient(top, #9ad6fb 0%,#77c4fc 100%);
border: 1px solid #72ade4;
color: #4879a6;
-webkit-box-shadow: inset 0 1px 4px rgba(255,255,255,0.75), 0 1px 3px rgba(79,126,167,.5);
-moz-box-shadow: inset 0 1px 4px rgba(255,255,255,0.75), 0 1px 3px rgba(79,126,167,.5);
box-shadow: inset 0 1px 4px rgba(255,255,255,0.75), 0 1px 3px rgba(79,126,167,.5);
-webkit-transition: all 0.25s ease 0s;
-moz-transition: all 0.25s ease 0s;
-o-transition: all 0.25s ease 0s;
transition: all 0.25s ease 0s;
}
.pagenavi { border:none; }

.pagenavi {
width:300px;
margin: 50px auto;
}
.pagenavi span, .pagenavi a {
display: block;
text-decoration: none;
color: #717171;
font: bold 11px Arial, sans-serif;
text-shadow: 0px 1px white;
padding: 5px 8px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.35);
-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.35);
box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.35);
background: #f9f9f9;
background: -webkit-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: -moz-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: -o-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: -ms-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#e8e8e8',GradientType=0 );
}
.pagenavi span:hover,.pagenavi a:hover {
-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.55);
-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.55);
box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.55);
background: #fff;
background: -webkit-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: -moz-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: -o-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: -ms-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: linear-gradient(top, #fff 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#e8e8e8',GradientType=0 );
border:none;
color:#575757;
}
.pagenavi a.current {
color: white;
text-shadow: 0px 1px #3f789f;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.8);
-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.8);
box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.8);
background: #7cb9e5;
background: -webkit-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: -moz-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: -o-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: -ms-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7cb9e5', endColorstr='#57a1d8',GradientType=0 );
}
.pagenavi a.current:hover {
-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.9);
-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.9);
box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.9);
background: #99cefc;
background: -webkit-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: -moz-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: -o-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: -ms-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: linear-gradient(top, #99cefc 0%, #57a1d8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99cefc', endColorstr='#57a1d8',GradientType=0 );


}
.pagenavi a.current:active {
-webkit-box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.5), 0px 1px 1px 0px rgba(255,255,255,1) !important;
-moz-box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.5), 0px 1px 1px 0px rgba(255,255,255,1) !important;
box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.5), 0px 1px 1px 0px rgba(255,255,255,1) !important;
}

Rahasia ????

.pagenavi span, .pagenavi a {
display: block;
text-decoration: none;
color: #717171;
font: bold 11px Arial, sans-serif;
text-shadow: 0px 1px white;
padding: 5px 8px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.35);
-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.35);
box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.35);
background: #f9f9f9;
background: -webkit-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: -moz-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: -o-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: -ms-linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
background: linear-gradient(top, #f9f9f9 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#e8e8e8',GradientType=0 );
}
.pagenavi span:hover,.pagenavi a:hover {
-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.55);
-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.55);
box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.55);
background: #fff;
background: -webkit-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: -moz-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: -o-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: -ms-linear-gradient(top, #fff 0%, #e8e8e8 100%);
background: linear-gradient(top, #fff 0%, #e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#e8e8e8',GradientType=0 );
}
.pagenavi span:active,.pagenavi a:active, .pagenavi a.current:hover {
-webkit-box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.5), 0px 1px 1px 0px rgba(255,255,255,1) !important;
-moz-box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.5), 0px 1px 1px 0px rgba(255,255,255,1) !important;
box-shadow: inset 0px 1px 3px 0px rgba(0,0,0,0.5), 0px 1px 1px 0px rgba(255,255,255,1) !important;
}
.pagenavi a.current {
color: white;
text-shadow: 0px 1px #3f789f;
-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.8);
-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.8);
box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.8);
background: #7cb9e5;
background: -webkit-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: -moz-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: -o-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: -ms-linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
background: linear-gradient(top, #7cb9e5 0%, #57a1d8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7cb9e5', endColorstr='#57a1d8',GradientType=0 );
}
.pagenavi a.current:hover {
-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.9);
-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.9);
box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.9);
background: #99cefc;
background: -webkit-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: -moz-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: -o-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: -ms-linear-gradient(top, #99cefc 0%, #57a1d8 100%);
background: linear-gradient(top, #99cefc 0%, #57a1d8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99cefc', endColorstr='#57a1d8',GradientType=0 );
}

Semoga Tutorial Blognya Membantu sobat :)

Read More..

Link Sumber Otomatis Ketika Artikel di Copas

http://thefreaks250.blogspot.com . Dalam dunia blogger, kita pasting sudah sangat sering sekali melakukan aktifitas copy paste dari blog lain, Dalam hal ini pasti banyak sobat yang merasa kesal karena artikel yang sudah dibikin sendiri dengan sempurna eh di copas sama orang lain, parahnya dia tidak mencantumkan alamat sumber yang menulis artikel tadi, dia malah mengklaim kalau artikel tersebut adalah murni hasil dia sendiri, berikut saya kasih tips biar orang yang copas artikel sobat bisa otomatis ngikut link sumbernya, sekaligus sobat bisa dapat backlink gratis dari web orang tersebut.

Buat sobat yang ingin coba, berikut caranya :

1. Biasa login ke blogger
2. Klik menu Template -> edit html
3. Jangan lupa centang expand template widget
4. Cari <body>, biasa pake ctrl + f
5. Copy script dibawah ini, letakkan diatas <body>
   <script type="text/javascript"> if(document.location.protocol=='http:'){ var Tynt=Tynt||[];Tynt.push('cXIEhKYVSr4lJ5adbi-bpO');Tynt.i={"ap":"Sumber :"}; (function(){var s=document.createElement('script');s.async="async";s.type="text/javascript";s.src='http://kupas-project.googlecode.com/files/sumberkupas.js';var h=document.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(); } </script>
6. Kemudian Simpan

Semoga artikelnya dapat membantu :)

Read More..

Merubah Warna Teks saat di Blok di Blogger

Salam sejahtera semuanya. Kali ini Thefreaks250 ingin berbagi ilmu tentang cara merubah warna teks pada saat di blok. Mengerti kan maksudnya?yak,pada saat sobat ngeblok tulisan kan, biasanya warna background biru terus tulisan item, tapi itu bisa di rubah dengan warna tertentu yang sobat inginkan, maksud dari semua itu adalah untuk mempercantik tampilan web kita teman..
Sebelum kita mengganti warna tersebut, pasti kan kita harus tahu kode html untuk warna warna tersebut, kita harus hafal 1 per 1, tapi sobat jangan khawatir karena kita juga bisa memasang kode tersebut pada halaman blog kita teman. Coba teman kunjungi halaman saya yang ini http://thefreaks250.blogspot.com/2012/12/memasang-kode-warna-di-blogger.html.
Ok langsung saja kita ke langkah langkahnya:

1. Log In ke Blogger,
2. Klik Template lalu pilih Edit Html,
3. Jangan lupa, centang expand template widget,
4. Cari kode ]]></b:skin> (gunakan Ctrl + F untuk mencari),
5. Letakan kode di bawah tepat di atas kode ]]></b:skin>
 ::selection {background:#ffffff; color:#fff}
::-moz-selection {background:#ffffff; color:#fff}
::-webkit-selection {background:#ffffff; color:#fff}
6. Terakhir Save Templatenya

 Keterangan :
  #ffffff : warna putih adalah warna background yang bisa diganti dengan warna lain sesuai keinginan sobat
 #fff     : warna merah adalah warna huruf pada saat di blok
yang bisa diganti dengan warna lain sesuai keinginan sobat

Semoga membantu :)

Read More..

Memasang Kode Warna di Blogger

Dalam membuat sebuah blog, kita pasti dihadapkan pada pemilihan sebuah warna. Warna dalam membuat blog memiliki kode tersendiri. Kode warna bagi sebagian blogger yang senang merias tampilan dan keindahan Blog, sangat dibutuhkan untuk kemudahan mendapatkan kode HTML dari setiap warna yang diperlukan. Nah untuk lebih mudah mendapatkan kode HTML setiap warna yang diinginkan, alangkah baiknya jika temen-temen memasang tabel kode warna ini di Blog atau di dalam postingan artikel. Dengan demikian dijamin teman-teman akan lebih cepat dalam bekerja merias blog karena tabel kode warrna sudah terinstall di Blog.

Cara pasang widget kode warna pada blogger

Langkah Pertama

1. Login ke blogger dengan id anda
2. Klik menu Tata Letak
3. Pada tab menu klik Edit HTML
4. Silahkan Backup dulu template anda dengan klik Download Template Lengkap
5. Sekarang cari kode </head>. Jika sudah ketemu, copy lalu paste kode berikut di atas kode </head>

<script language='javascript'>
function Barva(koda)
{
document.getElementById("vzorec").bgColor=koda;
document.hcc.barva.value=koda.toUpperCase();
document.hcc.barva.select();
}
function BarvaDruga(koda)
{
document.getElementById("vzorec2").bgColor=koda;
document.hcc.Barva2.value=koda.toUpperCase();
document.hcc.Barva2.select();
}
</script>

<script type='text/javascript'>

var hue;
var picker;
//var gLogger;
var dd1, dd2;
var r, g, b;

function init() {
if (typeof(ygLogger) != "undefined")
ygLogger.init(document.getElementById("logDiv"));
pickerInit();
//ddcolorposter.fillcolorbox("colorfield1", "colorbox1") //PREFILL "colorbox1" with hex value from "colorfield1"
//ddcolorposter.fillcolorbox("colorfield2", "colorbox2") //PREFILL "colorbox1" with hex value from "colorfield1"
}

// Picker ---------------------------------------------------------

function pickerInit() {
hue = YAHOO.widget.Slider.getVertSlider("hueBg", "hueThumb", 0, 180);
hue.onChange = function(newVal) { hueUpdate(newVal); };

picker = YAHOO.widget.Slider.getSliderRegion("pickerDiv", "selector", 0, 180, 0, 180);
picker.onChange = function(newX, newY) { pickerUpdate(newX, newY); };

hueUpdate();

dd1 = new YAHOO.util.DD("pickerPanel");
dd1.setHandleElId("pickerHandle");
dd1.endDrag = function(e) {
// picker.thumb.resetConstraints();
// hue.thumb.resetConstraints();
};
}

executeonload(init);

function pickerUpdate(newX, newY) {
pickerSwatchUpdate();
}


function hueUpdate(newVal) {

var h = (180 - hue.getValue()) / 180;
if (h == 1) { h = 0; }

var a = YAHOO.util.Color.hsv2rgb( h, 1, 1);

document.getElementById("pickerDiv").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

pickerSwatchUpdate();
}

function pickerSwatchUpdate() {
var h = (180 - hue.getValue());
if (h == 180) { h = 0; }
document.getElementById("pickerhval").value = (h*2);

h = h / 180;

var s = picker.getXValue() / 180;
document.getElementById("pickersval").value = Math.round(s * 100);

var v = (180 - picker.getYValue()) / 180;
document.getElementById("pickervval").value = Math.round(v * 100);

var a = YAHOO.util.Color.hsv2rgb( h, s, v );

document.getElementById("pickerSwatch").style.backgroundColor =
"rgb(" + a[0] + ", " + a[1] + ", " + a[2] + ")";

document.getElementById("pickerrval").value = a[0];
document.getElementById("pickergval").value = a[1];
document.getElementById("pickerbval").value = a[2];
var hexvalue = document.getElementById("pickerhexval").value ='#'+
YAHOO.util.Color.rgb2hex(a[0], a[1], a[2]);
ddcolorposter.initialize(a[0], a[1], a[2], hexvalue)
if (hexvalue!="#FFFFFF") document.getElementById("pickerhexval").select();
}

</script><!--[if gte IE 5.5000]>
<script type="text/javascript">

function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}

YAHOO.util.Event.addListener(window, "load", correctPNG);

</script>
<![endif]-->

6. Selesai

Langkah Kedua :

Berikutnya, memasang tabel kode warna pada blog. Ada dua pilihan, pertama dipasang sebagai posting blog dan yang kedua dipasang pada halaman utama (homepage) blog. Nah, kode untuk tabel kode warna yang akan dipasang adalah berikut ini :

Kode Warna :

</div><center><form name="hcc" id="hcc">
<table style="border-collapse: collapse;" align="center" border="1" bordercolor="#cccccc" cellpadding="0" cellspacing="0"><tbody><tr><td><table align="center" border="0" cellpadding="0" cellspacing="1" width="375"><tbody><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190707">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0808">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b40404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0101">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa5858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f78181">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cece">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbefef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#191007">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a1b0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b240b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#61380b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a4b08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b45f04">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df7401">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff8000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe9a2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#faac58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7be81">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5d0a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6e3ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8ece0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbf5ef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#181907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#292a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#393b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5e610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#868a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#aeb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d7df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7fe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f4fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f3f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f7f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbfbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#101907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#243b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#38610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b8a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5fb404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#74df00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#80ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9afe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#acfa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bef781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3f6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ecf8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5fbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071907">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a0a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b610b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a08">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b404">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df01">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff00">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58fa58">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f781">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5a9">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6ce">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8e0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbef">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071910">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b6138">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a4b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b45f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01df74">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ff80">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efe9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6e3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbf5">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071918">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a2a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b615e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#088a85">
</td><td onclick="Barva(this.bgColor)" bgcolor="#04b4ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#01dfd7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#00ffff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2efef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58faf4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81f7f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9f5f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cef6f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0f8f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#effbfb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#071019">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a1b2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b243b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b3861">
</td><td onclick="Barva(this.bgColor)" bgcolor="#084b8a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#045fb4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0174df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0080ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e9afe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#58acfa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#81bef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9d0f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cee3f6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0ecf8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#eff5fb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#070719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0a0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#08088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0404b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0101df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5858fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8181f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a9a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#cecef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e0e0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#efeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#100719">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1b0a2a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#240b3b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#380b61">
</td><td onclick="Barva(this.bgColor)" bgcolor="#4b088a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#5f04b4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#7401df">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8000ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#9a2efe">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ac58fa">
</td><td onclick="Barva(this.bgColor)" bgcolor="#be81f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d0a9f5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e3cef6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ece0f8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5effb">
</td></tr><tr height="24"> <td onclick="Barva(this.bgColor)" bgcolor="#190718">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a29">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b39">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b5e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a0886">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b404ae">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df01d7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff00ff">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2ef7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58f4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781f3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cef5">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0f7">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeffb">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#190710">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2a0a1b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#3b0b24">
</td><td onclick="Barva(this.bgColor)" bgcolor="#610b38">
</td><td onclick="Barva(this.bgColor)" bgcolor="#8a084b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#b4045f">
</td><td onclick="Barva(this.bgColor)" bgcolor="#df0174">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ff0080">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fe2e9a">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fa58ac">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f781be">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f5a9d0">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f6cee3">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f8e0ec">
</td><td onclick="Barva(this.bgColor)" bgcolor="#fbeff5">
</td></tr><tr height="24"><td onclick="Barva(this.bgColor)" bgcolor="#000000">
</td><td onclick="Barva(this.bgColor)" bgcolor="#0b0b0b">
</td><td onclick="Barva(this.bgColor)" bgcolor="#151515">
</td><td onclick="Barva(this.bgColor)" bgcolor="#1c1c1c">
</td><td onclick="Barva(this.bgColor)" bgcolor="#2e2e2e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#424242">
</td><td onclick="Barva(this.bgColor)" bgcolor="#585858">
</td><td onclick="Barva(this.bgColor)" bgcolor="#6e6e6e">
</td><td onclick="Barva(this.bgColor)" bgcolor="#848484">
</td><td onclick="Barva(this.bgColor)" bgcolor="#a4a4a4">
</td><td onclick="Barva(this.bgColor)" bgcolor="#bdbdbd">
</td><td onclick="Barva(this.bgColor)" bgcolor="#d8d8d8">
</td><td onclick="Barva(this.bgColor)" bgcolor="#e6e6e6">
</td><td onclick="Barva(this.bgColor)" bgcolor="#f2f2f2">
</td><td onclick="Barva(this.bgColor)" bgcolor="#ffffff">
</td></tr></tbody></table></td></tr></tbody></table><table align="center" border="0" cellpadding="0" cellspacing="2"><tbody><tr height="24"><td id="vzorec" height="24" width="24">
</td><td valign="bottom"><p>Kode warna : <input name="barva" id="barva" style="font-weight: bold; font-family: Verdana; height: 16px; width: 74px; font-size: 12px;" maxlength="7" size="9" type="text"></p></td></tr></tbody></table>
</form></center>

Cara pasang kode warna sebagai posting blog :

• Yang pasti, anda buat posting baru terlebih dahulu
• Copy lalu paste Kode Warna tersebut pada posting anda
• Berikan judul posting yang sesuai
• Jangan lupa untuk memberi label posting
• Kemudian terbitkan postingan
• Selesai

Cara pasang kode warna di halaman utama (homepage) blog :

• Masuk ke menu Elemen Halaman
• Klik Tambah Gadget
• Pilih tambahkan HTML/JavaScript
• Copy lalu paste Kode Warna tersebut di dalamnya.
• Berikan judul atau nama gadget
• Klik tombol Simpan
• Silahkan tempatkan gadget kode warna dengan men-drag ke tempat yang sesuai
• Klik tombol Simpan
• Selesai

Hasilnya nanti akan seperti ini :

 

Kode warna :

Sekarang widget kode warna sudah hadir di blog anda. Selamat mencoba dan mudah-mudahan bermanfaat.
Sumber :  http://www.maskolis.com/2011/01/memasang-kode-warna-di-blog.html

Read More..

Membuat Readmore Otomatis di Blogger

Auto Read More Untuk Blogger adalah sangat penting, karena fungsi ini SEO friendly dan membuat visitor memungkinkan surfing terus-menerus di site anda.

Pada kesempatan kali ini, Thefreaks250 akan memberikan tips dan trick untuk membuat Auto Read More Untuk Blogger tanpa menggunakan javascript hosting dari file orang lain.

Jika anda telah mempunyai "Read More" dengan fungsi Manual, maka yang pertama kali anda lakukan adalah menghapus dan menormalkan kembali template anda.

Anda dapat menghapus fungsi dari script : <div class="fullpost">...</div> atau <span class="fullpost">...</span> dimana fungsi ini biasanya ditempatkan pada halaman posting.

Versi Auto Read More ini sangat mengagumkan, dimana kita dapat mengatur tampilan sesuai kemauan kita seperti berapa besar image thumbnail yang akan ditampilkan atau berapa jumlah paragraf suku kata yang akan kita tempatkan pada homepage kita.
Sebagai contoh, silahkan lihat screenshoot dibawah ini:

 Catatan:
Jika anda telah membuat "Read More" fungsi "manual", maka yang harus anda lakukan adalah menormalkan kembali script di template anda seperti semula, setiap template mungkin akan berbeda, tetapi anda dapat menormalkan kembali seperti contoh berikut (hapus script yang berwarna merah):

<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>

<style>.fullpost{display:inline;}</style>

<p><data:post.body/></p>

<b:else/>

<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Readmore</a>
</b:if>

<div style='clear: both;'/>

Setelah menormalkan script diatas, lalu lanjutkan ke EDIT HTML dan temukan script </head>, copy-paste dan tempatkan kode script di bawah ini diatas script </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

Auto Read More Untuk Blogger
Selanjutnya pada EDIT HTML, check "Expand widget template" dan temukan script berikut:

<data:post.body/>

Jika sudah ditemukan script <data:post.body/>, hapus lalu copy-paste kode script dibawah ini:

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'>Read More »»» <b><a expr:href='data:post.url' expr:title='data:post.title' rel='tag'><data:post.title/></a></b></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Lalu simpan template anda.

Keterangan: 
var thumbnail_mode = "float"; (menempatkan image thumbnail di kiri "float", jika tidak suka dengan opsi ini, silahkan ganti dengan "no-float")
summary_noimg = 250; (mengatur jumlah karakter yang akan ditampilkan jika tanpa image thumbnail)

summary_img = 250; (mengatur jumlah karakter yang akan ditampilkan jika menggunakan image thumbnail)

img_thumb_height = 120; (mengatur tinggi pixel thumbnail)

img_thumb_width = 120; (mengatur lebar pixel thumbnail)

#Silahkan ganti angka-angkanya saja script diatas sesuai keinginan anda.


Selamat Mencoba,

Sumber : http://blogclubbers.blogspot.com/2010/04/auto-read-more-untuk-blogger.html

Read More..