This is default featured post 1 title

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.

Tampilkan postingan dengan label TUTORIAL BLOG. Tampilkan semua postingan
Tampilkan postingan dengan label TUTORIAL BLOG. Tampilkan semua postingan

Minggu, 06 November 2011

Kode Warna


Add caption
saya telah lama mencari kode warna untuk saya postingkan keblog saya dan akhirnya dapat juga dari blog teman yang berbagi cara mempostingkan kode warna. saya sangat berterima kasih kepadanya. Nah dari beberapa pilihan warna dibawah ini, pilihlah warna yang teman suka. OK n Selamat mencoba






Berikut adalah kodenya. Silahkan teman klik salah satu warna yang teman inginkan :








































































































































































































Kode warna yang terpilih :
Get it

Kamis, 03 November 2011

Cara Menambahkan Button Facebook Like


 Terkadang ada pengunjung yang masuk ke blog kita dan tidak meninggalkan komentar, maunya hanya copy paste apa yang kita postingkan entah apa alasannya. Nah biar labih mudah, 
saya akan beri sebuah cara kepadateman agar pengunjung yang masuk keblog teman walaupun tidak komentar namun mereka bisa menyukai postingan teman lewat facebook like, saya sendiri juga menggunakan facebook like ini coba teman lihat bagian bawah postingan atau sebagai contohnya teman lihat saja gambar yang tertera disamping. Kalau teman tertarik ikuti saja langkah-langkah dibawah ini :

Selasa, 01 November 2011

Cara Membuat Translator di Blog


Translator atau terjemahan sangat dibutuhkan dalam sebuah blog, maka dari itu saya akan berbagi kepada teman cara membuatnya. Caranya sangat mudah dan yang pasti hasilnya sangat memuaskan buktinya saya sendiri juga menggunakan translator ini, dan teman bisa lihat tampilannya seperti pada gambar disamping dan juga coba teman lihat pada samping blog saya, Ok kan. Kalau teman ingin translator ini ada diblog teman ikuti saja langkah-langkah dibawah ini :

  1. Seperti biasa, teman harus login dulu
  2. Edit halaman
  3. Tambah gadget dan pilih atau tambahkan HTML/Javascript
  4. Kemudian copy dan paste script berikut didalamnya

<style>
.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
</style>

<div>

<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBDikqdXMSJikFKflvAP_ez5n6dyL4qE0Poyu1OcjvibCOsS4q0sJIe4byRcCb7RNbhkjow2jAUwMXg1j9Hk-hXi4Hu3BUDxiHfk6qoNi-Hl-UxBBzyjsMUAfRs8Etkc22RgEMSxHwo4s/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0LTt1fyilZ3qEAZWXonGIYpNtnFE_b90A3MBnSbFQa6_Ghca6Ap1FmSfF-htezdyJbv8loU1UqWRRdo0VVapEZo4DqOGn99wR-97mckdB0BX48d8XEJFodPVx7NkJFL8wWyqMQYgTcmE/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHhPY1vSeseelfeEEHRq7wFwlTYpF6mGZKQdk6IMO6o5MYvpmc6XXq91uMHcNV7vy8C5OVL1e9xFspOy2n4K1U_pS7wegq5jsFpsZzz2haX0uvgBUg8rTo7zbeWF60mfivhY_VYfWdCWt5/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyllJgDxEM9grPHujIZ74ZFXeI7_GKeeCYChGYa1_bk35Nc9tzP1rFApQkY6p4OlUGluibboRYz_-E-8XtfM7DQ31844_rnAtRp_hAMjMqs7_Q1rDHIh4a2LFmZ1oAdbELr_AOjoV-1sG0/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6fG0pWPMjcHnfVGk6u0YwkzNqZg2qSYvnuV_aVWq00ogLIN3zBaKOM1yxEyLznKzHtsEfiUMpBmM6xHEctr7Bx8ZkVYQxpRA9Laifwv8nrDM2_2NcOtK9UgW0EPnd0BvUtBRy8_gDR6w/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxOJc3tunMLsM0gVX5F65SCbUGDTNAFgouy98Q0kaYHcloZeeXfFUM97vkADZZdoMVgg7zyyV2YS0XrXxQ_03Bg_KaNZJAaK4aXeMP-xKu0bFA472zTDI9NTaTMtL8yW6jsmOhtFgDgWo/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNu74rOJswq9BsPYgp90NYryvyDqLtAM6dBpnXUwlWDWozngB7W3T2FhkI_xHSuA0tjN_Zo77XFxxiW6hBMn6D62dXYqThH4CMBALfL7zsRgx1dpU2FCX1O41UMBYfukrKCtutxmTPmEk/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg17sK-u5fl3EXJ642tuzDGSpdBZ6p8OlLBUHMGRNRaficx6CviFnhnxFNHVLA_Dd-zcuKjhjjKtJoVKOOVTngpeqgKNOpOum34IfGtmac6g3370yhNytmUP8xJ7H69FZDcOW4f41TV7OM/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3R4106XxwHSNl_DJRaNzxQi3CqwsYTQARqzJw2Kx-TY5RduqTTQKxlVa7gn9EHaF7xguB6C8mhGy4g5PQ_dq4MippAHOz0ngGc8vLieKcTReo3UEfry9VWGEdQ7Ubuwngshx-YiqNFaa6/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiC8IxmBw5nQs0iLTJm-dJn5rhxYfdSQqvslM8Vx8D50IAp4iNiZv7TpetPmgcQYnoK-5tUyNvCaOhO5P34U8zHAbyWBvp-m_qzkF2mYy18WAkhU1W3PcnUa0MiBh5SmjpJvp1jdkQkEJI/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh8ht_nxc9INzilTxjsgdKwV5nxqvAtWUujkG89gsSGy9GD9a07vbwdt_hJu6rbew2NIpxkXbPrMJ02RQOsrFiaNXPMSnPpSqbwg_2XJijVlBrcySdT8tkjxlPpTAT4WRizPCyuAC_yJA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="http://alfapay.blogspot.com" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3-9bV7ildiTt68lrW2Uyv0_Q0BL4WfCo1tiYibuCQHXdhh0Y2bXJbi6I4uI-XvkdnX3g9T2BzHVhI62hyphenhyphen1V0VMdrZBv49lbQIYONhOt4RYJAQ7igf_MTNw66TQ7BaSl2Nk2DLP7jAScE/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
</div>

  1. Pada tulisan yang berwarna merah teman ganti dengan alamat blog teman sendiri
  2. Kalau sudah selesai kemudian klik save. OK^_^

Cara Membuat Read More di Blog


  Teman bisa lihat kan tampilan Read More di halaman depan blog saya tadi atau pada contoh gambar disamping. Jika teman ingin menambahnya damal blog teman ikuti saja langkah-langkah dibawah ini :

1.
Login dulu keblog teman
2. Pilih
Tata Letak kemudian pilih Edit HTML
3. Beri tanda cek (centang) pada
“ Expand Widget Templates “
4. Cari kode di bawah ini
</head>

5. Jika sudah ketemu taruh kode berikut ini
di bawahnya
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

6. Cari kode di bawah ini
<data:post.body/>

7. Ganti kode yang telah kita temukan di atas dengan kode berikut ini
<b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> read more &#8220;<data:post.title/>&#8221;</a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

8.
Simpan Template Kalau sudah beres

Catatan :
Silahkan kamu coba sekarang, tapi berikut ini catatan yang juga perlu kita ketahui:
 
summary noimg= 430 adalah tinggi artikel terpenggal tampa image 
summary img=340 adalah tinggi artikel terpenggal dengan image

Cara Membuat Nomor Halaman di Blog


 Kalau teman mau coba tutorial ini namun masih belum percaya atau tidak yakin telusuri saja bagian bawah blog saya teman akan lihat bagaimana tampak dari nomor halaman ini. Hehehe. Sudah percaya…yups, kalau teman mau coba ikuti saja langkah-langkah dibawah ini :

  1. Login dulu keblog teman
  2. Edit halaman
  3. Kemudian klik tambah gadget dan pilih atau tambah HTML/Javascript
  4. Copy dan paste script berikut didalamnya

<style>
.showpageArea {padding: 0 2px;margin-top:10px;margin-bottom:10px;
}
.showpageArea a {border: 1px solid #505050;
color: #fff;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #fff;
color: #fff;
background-color: #333;
}

.showpageNum a {border: 1px solid #505050;
color: #666;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #fff;
background-color: #333;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #000000;
background-color: #ffffff;


}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #ffffff;
background-color: #333;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #fffff;
color: #ffffff;
background-color: #333333;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #ffffff;
background-color: #333;
}
</style>



<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';


var pageCount=5;
var displayPageNum=2;
var firstPageWord = 'First';
var endPageWord = 'Last';
var upPageWord ='Previous';
var downPageWord ='Next';



var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}else{
html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;color: #ffffff;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>


  1. Kalau sudah klik save atau simpan
  2. Langkah terakhir, pindahkan gadget yang baru diedit ke bawah postingan. Selesai^_^

Senin, 31 Oktober 2011

CARA MEMBUAT LINK BERGOYANG


Maksud dari judul diatas, jika teman arahkan mouse pada menu atau judul posting maka akan bereaksi dan bergerak atau bergoyang, sebagai contohnya arahkan saja muose ke menu blog saya. Teman tertarik dan ingin mencobanya, ikuti saja langkah-langkah berikut ini :
  1. Login Ke Blog Teman
  2. Pada Dasbor Pilih >>Rancangan-->Kemudian EDIT HTML
  3. Cari Kode </head> Dan Letakan Kode Script Berikut Tepat Diatas Kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>         
$(document).ready(function()  {          
$(&#39;a&#39;).hover(function() {  //mouse in          
$(this).animate({ marginLeft:  &#39;12px&#39; }, 400);          
}, function() { //mouse out           
$(this).animate({ marginLeft: 0 }, 400);          
});           
});</script>

 
  
4.Simpan Dan Lihat Hasilnya

CARA MEMBUAT SCREENSAVER KEREN DI BLOG



Ingin pUnya tampilan Screensaver seperti punya saya….??? Kalau teman ingin meliatnya, buka link baru entah itu facebook atau apa saja tampa keluar dari blog aku untuk beberapa saat dan balik lagi keblog aku. Nah contohnya seperti yang teman lihat….atau contohnya terterah disamping......mau…??? Kalau mau ikuti saja langkah-langkah berikut ini :

1.  1.      Login dulu.
2.   2.     Masuk ke Edit Halaman untuk yang tampilan lama dan Layout untuk tampilan yang baru
3    3.    Tambah Gadget terus pilih atau tambah HTML/JavaScriptTambah
4.   4.     Copy paste script dibawah ini didalamnya

<style type="text/css">body .saving{position: fixed;width: 100%;top: 0;left:0;height: 100%;opacity: 0.98;filter: alpha(opacity=98);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";background: #000;border-bottom: 3px solid transparent;z-index: 999999;-o-transition: all 3s ease-in-out 10s;-moz-transition: all 3s ease-in-out 10s;-webkit-transition: all 3s ease-in-out 10s;}body:hover .saving {opacity: 0.0;height:0.001%;filter: alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";background: #0a7f01;border-bottom: 5px solid #333;-o-transition: opacity 2s ease-in-out 2.5s, background-color 3s linear 0.5s, height 1s ease-in 1.8s;-moz-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;-webkit-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;}body .saving p.esm1{margin: 0;padding: 0;width: 92%;background: transparent;font-size: 100px;font-family: "Serif", Times New Roman;color: #FF0000;text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40,   2px -10px 10px #f10;position: relative;margin-top: 200px;line-height: 20px;font-weight: bold;text-align: center;border: 30px solid transparent;border-radius: 20px;-moz-border-radius: 20px;-webkit-border-radius: 20px;-o-transition: -o-transform 5s ease-out 8s, background-color 4s ease-out 12s;-moz-transition: -moz-transform 5s ease-out 8s, background 4s ease-out 12s;-webkit-transition: -webkit-transform 5s ease-out 8s, background 4s ease-out 12s;}body:hover .saving p.esm1{font-size: 10px;color: red;width: 25%;margin: 340px 0 0 300px;padding: 25px;background: #aaa;border: 20px solid #888;border-radius: 170px;-moz-border-radius: 170px;-webkit-border-radius: 170px;-o-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-moz-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-webkit-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-o-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -o-transform 1.2s linear 1.5s, background-color 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-moz-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -moz-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-webkit-transition: font 1.1s 0.1s, width 1.7s 0s, margin-left 0.8s 1.2s, -webkit-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1s ease-in 0.5s, border 3s ease-in, -webkit-border-radius 3s ease-in;}.saving p span.esm2{font-size: 18px;opacity: 0.5;filter: alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";display: block;text-align: center;width: 300px;margin: -10px auto; font-weight: normal;padding: 2px 8px;background: #000;border: 1px solid #333;border-radius: 0;-moz-border-radius: 0;-webkit-border-radius: 0;color: #0000FF;text-shadow: none;font-family: Arial, Helvetica, sans-serif;-o-transition: 1s ease-out;-moz-transition: 1s ease-out;-webkit-transition: 1s ease-out;}.saving:hover p span.esm2{font-size: 10px;width: 200px;padding: 0;}.saving p span.esm3{color: #ccc;font-family: "Tahoma", Arial, Helvetica;display: block;margin:10px auto;background: url http://i964.photobucket.com/albums/ae124...) left center repeat-x;background: -moz-linear-gradient(top,#666,#111);background: -webkit-gradient(linear,0% top,0% bottom,from(#111),to(#666));opacity: 0.6;filter: alpha(opacity=60);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";width: 250px;text-shadow: 1px 1px 1px #000;border: 1px solid #333;border-radius: 4px;padding:2px 10px;-moz-border-radius: 4px;-webkit-border-radius: 4px;font-size: 12px;font-weight: normal;line-height: 16px;}.saving .by_Tejahtc {margin-left: 30px;text-align: center;color: #015828;font-size: 12px;font-weight: normal;position: absolute;bottom: 30px;width: 100%;height: 20px;left: 0;}.saving .by_Tejahtc span.esm4 {color: #aaa;font-style:italic;font-size:14px;font-weight:bold;text-transform:uppercase;}#recpost {width:210px;overflow: hidden;height: 327px;float: right;margin-top: 10px;padding: 4px 2px;background: transparent;border: 1px solid transparent;border-radius: 10px;-moz-border-radius: 10px;-webkit-border-radius: 10px;-o-transition: all 1.5s ease-out;-moz-transition: all 1.5s ease-out;-webkit-transition: all 1.5s ease-out;}</style>

<div class='saving'>
<p class='esm1'>Iman Tamnge<br/>
<span class='esm2'>Selamat Datang DibLog Saya</span><br/><br/>
<span class='esm3'>Move your mouse to go back to the page!<br/>Gerakkan mouse anda dan silahkan nikmati kembali posting kami!</span></p>
</div>

5.   5.     Pada kalimat yang berwarna merah teman ganti dengan kalimat teman sendiri
6.   6.     Kalau sudah selesai mengedit lalu disave dan lihat hasilnya dan selamat mencoba^_^

Related Posts Plugin for WordPress, Blogger...

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More