Penerepan Jquery Lettering di Blogspot.

Jquery Lettering ini menurut ku sangat menarik karena kita bisa memodifikasi tulisan - tulisan di blog kita dengan keren dan tulisan bisa warna pelangi, bisa di bikin model kotak - kotak juga bisa, Typography, pokoknya macem - macem dibawah ini aku kasi Contoh satu.


Penerepan Jquery Lettering di Blogspot.
  • Login ke Blogger.
  • Edit template, kemudian tambahkan JS ini di atas kode
  • </head>
Source Code dari Jquery Lettering yang asli..
<script type="text/javascript">
/* Lettering.JS 0.6.1 by Dave Rupert - http://daverupert.com */
(function($){function injector(t,splitter,klass,after){var a=t.text().split(splitter),inject='';if(a.length){$(a).each(function(i,item){inject+='<span class="'+klass+(i+1)+'">'+item+'</span>'+after});t.empty().append(inject)}}var methods={init:function(){return this.each(function(){injector($(this),'','char','')})},words:function(){return this.each(function(){injector($(this),' ','word',' ')})},lines:function(){return this.each(function(){var r="eefec303079ad17405c889e092e105b0";injector($(this).children("br").replaceWith(r).end(),r,'line','')})}};$.fn.lettering=function(method){if(method&&methods[method]){return methods[method].apply(this,[].slice.call(arguments,1))}else if(method==='letters'||!method){return methods.init.apply(this,[].slice.call(arguments,0))}$.error('Method '+method+' does not exist on jQuery.lettering');return this}})(jQuery);

$(document).ready(function() {
$(".entry-title").lettering();
});
</script>
Keterangan : JS ini berfungsi untuk judul postingan yang menggunakan class .entry-title Setelah itu simpan kode di bawah ini di atas ]]></b:skin> atau <style type='text/css'>
.entry-title {
font-family: "Arial Narrow", Arial, Verdana, sans-serif;
margin: 10px 0 0 0;
font: normal 75px/75px Arial Narrow;
font-weight: bold;
text-transform: uppercase;
color: #5e8b99;
}
.entry-title .char1 {
color: #000;
}
.entry-title .char2 {
color: #AAA;
}
.entry-title .char3 {
color: #ea9;
}
.entry-title .char4 {
color: #50d;
}
.entry-title .char5 {
color: #090;
}
  • Kemudian Simpan template anda..
Penerepan Jquery Lettering di Blogspot.

Perhatikan kata motor terdiri dari 5 kata jadi kodenya sampai .char5 jadi setiap satu kata itu di hitung satu .char dan perhatikan penulisannya pada kode cssnya penulisan setiap char harus di ikuti dengan .entry-title jadi kodenya .entry-title .char1. anda juga bisa gunakan ini pada judul sidebar, judul blog dan lain - lain yang penting anda tahu ID dari judul sidebar atau judul blog itu, misalnya judul sidebar anda ID nya .sidebar h2 maka ganti .entry-title dengan .sidebar h2 dan mulai deh tuh hitung per_katanya dan tulisin kode cssnya.

Oh iya di atas hanya dokumentasi JS dari Lettering.js karena source code aslinya sudah broken link
Silahkan kreasikan lagi, saya yakin anda pasti bisa !
Kompi Eot dan blogger indonesia lainnya telah bergabung di forum Idblogschool.com, kamu ?

Out Of Topic