Selasa, 12 Juli 2011

Memasang Translate Ikon Bendera Di Blog

Jumpa lagi sobat blogger....masih dalam labels Blog Accessories. Salah satu cara memasang/menambahkan Blog Accessories pada blog yaitu dengan menggunakan kode script. 

Kali ini saya akan share cara Memasang Translate Ikon Bendera Di Blog dengan menggunakan kode script yang dimana Translate Ikon Bendera yang nantinya akan sobat pasang pada blog sobat dengan tampilan ikon bendera Negara-Negara lain, Jadi terkesan kelihatan menarik para pengunjung Blogger dan Blognya bisa di baca dari Luar Negeri.

Oke tanpa bla-blaaaa lagi...sobat ikuti langkah-langkahnya :
  • Log in ke Blogger Anda.
  • Pilih Tata Letak/Layout.
  • Pada halaman Page Element/Elemen Laman.
  • [Klik] Add a Gadget.
  • Pilih HTML/Javascript.
  • Copy code di bawah ini dan paste ke dalam HTML/Javascript tersebut.



  • Simpan dan lihat hasilnya.....!!!

Semoga bermanfaat....


EnaL Rhay SyahRinggan Next..>>
READ MORE - Memasang Translate Ikon Bendera Di Blog
Posted by Enal at Selasa, Juli 12, 2011 0 comments
Labels:

Memasang Tombol Back to Top di Blogspot

Hay...Jumpa lagi nich..!! Sobat Bloggger, kali ini saya akan membahas sekaligus membagi pengetahuan kepada sobat Blogger. Namun materi posting kali ini masih tetap membahas cara memodif/memberikan Accessories pada Blog.

Seperti pada penjelasan diatas, kali ini saya akan share cara Memasang Tombol Back to Top di Blogspot pada sobat Blogger. Dengan menambahkan kode script, sobat bisa membuat Tombol Back to Top yang berkaitan dengan scroll ke atas dan ke bawah pada Blog dengan menggunakan animasi jquery dengan sekali klik..!

Oke.., jika sobat tertarik dengan trik Memasang Tombol Back to Top di Blogspot, sobat ikutin ajh cara-caranya..:

Langkah-langkah yang harus dilakukan yaitu :
  • Seperti biasa Log in ke Blogger anda. => Blogger.com
  • Pilih Tata Letak/Edit HTML.
  • Cari Kode </body> (Gunakan saja pencarian cepat => Ctrl + F) 
  • Copy paste kode Script di bawah ini. Taruh kode Script di bawah ini tepat di atas kode </body>

<div style="display:none;" class="atas" id="atas"></div>
<div style="display:none;" class="bawah" id="bawah"></div>


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <script text="text/javascript">
$(function() {
var $elem = $('#outer-wrapper');
$('#atas').fadeIn('slow');
$('#bawah').fadeIn('slow');
$('#bawah').click(
function (e) {$('html, body').animate({scrollTop: $elem.height()}, 800);});
$('#atas').click(
function (e) {$('html, body').animate({scrollTop: '0px'}, 800);});
});
</script>


  • Setelah itu, sobat cari kode ]]></b:skin> 
  • Copy paste kode dibawah ini tepat diatasnya kode ]]></b:skin>.

#bawah{ padding:7px; background-color:white; border:1px solid #CCC;
position:fixed; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0NsTW3bOZ8vm52rGTsFO95Ek6LlCwWgj9zxThKIkklEeU7naZqRCcTHa-rWWjcawNA9fXVkEHJ3RajoDI6p3T83zyQa1FRWkr9jCoPNsW9AL8MMdUcpyesH4K2_VN1fbLItlrITtrljk/s50/Button-Next-icon.png) no-repeat top left;
background-position:50% 50%; width:20px; height:20px; bottom:10px; opacity:0.7;
left:70px; white-space:nowrap; cursor: pointer;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
-khtml-border-top-left-radius:3px;
-khtml-border-top-right-radius:3px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);}
#atas{ padding:7px; background-color:white; border:1px solid #CCC;
position:fixed; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzX0_QTylr9A7b28g86B2U45wReOh3uUNe499j7OHEZCvzd8wjVYuYo23azc7DW4heQwUyAhMY-2kHX7FrL7zOUWhAK7lr_HCWOOEVW8MeXrCbhuosr2YKj0uOaOfELRliM7oaVWqF2yc/s50/Copy+of+Button-Next-icon.png) no-repeat top left;
background-position:50% 50%; width:20px; height:20px; bottom:10px; opacity:0.7;
left:30px; white-space:nowrap; cursor: pointer;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
-khtml-border-top-left-radius:3px;
-khtml-border-top-right-radius:3px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);}

  • Simpan hasil kerja anda....!!
  • Lihat hasilnya....

Semoga bermanfaat....!!

EnaL Rhay SyahRinggan Next..>>
READ MORE - Memasang Tombol Back to Top di Blogspot
Posted by Enal at Selasa, Juli 12, 2011 0 comments
Labels:

Memasang Recent Post Di Blog

Oke.. Jumpa lagi di Blogger Enal....!!
Oy, posting kali ini membahas tentang modifikasi atau biasa juga disebut Blog Accessories. Mungkin ini sudah tidak populer lagi bagi kalangan Blogger Master. Tapi tips Memasang Recent Post Di Blog kali ini bisa membantu para sobat Blogger Pemula untuk mempermudah pengunjung Blogger melihat postingan yang telah sobat publikasikan...

Oke..Langsung saja, langkah pertama seperti biasa :
  • Log in ke Blogger Anda.
  • Pilih Tata Letak/Layout.
  • Pada halaman Page Element/Elemen Laman.
  • [Klik] Add a Gadget.
  • Pilih HTML/Javascript.
  • Copy code di bawah ini dan paste ke dalam HTML/Javascript tersebut.

<script src="http://sites.google.com/site/anasku2000/post-terakhir.js"></script>
<script>var numposts = 10; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://URL Blog Sobat/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>

  • Ganti tulisan yang berwarna Biru "http://URL Blog Sobat" dengan alamat URL Blog Sobat.
  • Simpan dan coba sobat lihat hasilnya.
Ket :
  • Tulisan yang berwarna Orange "var numposts = 10"adalah Jumlah Posting yang ingin ditampilkan dalam Recent Post.
Semoga bermanfaat....!!!

EnaL Rhay SyahRinggan Next..>>
READ MORE - Memasang Recent Post Di Blog
Posted by Enal at Selasa, Juli 12, 2011 0 comments
Labels:

Comments Via Facebook

| Enal | Trik-Trik Blogger | SEO Blogspot

Memuat...