Saturday, 12 May 2012

Cara Buat Auto Read More Keren

Waktunya berbagi ilmu lagi ,
ilmu ini juga dulu saya gak tau , terus nyarinya juga lumayan susah
jadi dari pada ada newbie yang pengen tau caranya setidak nya Hafidz Blog bisa sedikit membantu

caranya cukup mudah :

1. Kalian logon dulu ke blognya (blogspot.com) kalo yang belum punya klik link ini http://hafidz7abar.blogspot.com/2012/03/cara-membuat-blog.html

2. Pergi ke menu template ( Klik Pada Gambar Biar Jelas )


3. klik edit HTML , terus beri tanda centang pada expand template widget

4 tekan Ctrl+f lalu ketikan kode ini : </head>
kalo sudah ketemu langsung copy kan kode ini :
<!-- Auto read more script Start -->
<script type='text/javascript'>
var thumbnail_mode = "yes"; //yes -with thumbnail, no -no thumbnail
summary_noimg = 430; //summary length when no image
summary_img = 340; //summary length when with image
img_thumb_height = 200;
img_thumb_width = 200;
</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(thumbnail_mode == "yes") {
 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 script End -->

Letakan / paste di atas kode </head> tadi yah

5. Klik Ctrl+F pada keyboard lalu ketikan kode : <data:post.body>
kalo udah ketemu Hapus kode tersebut <data:post.body>  dengan kode berikut :

<!-- Auto read more Start -->
<!-- http:lenterablogger.blogspot.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<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>
<a class='more' expr:href='data:post.url'>Read more ...</a>
</b:if>
</b:if>
<!-- Auto read more End -->

kalo sudah lalu klik pratinjau , buat ngetes sukse atau enggak nya :)
kalo berhasil ucap syukur :D

jangan lupa di simpan ya , dengan mengklik simpan

demikian ilmu dari saya
selamat belajar dan salam bloger

 

Tuesday, 8 May 2012

Cara Membuat Scrollbar keren Berwarna

Ilmu baru lagi nih dari Hafidz Jabar / cara membuat Scrollbar yang keren , 
kayak yang bisa di lihat di scrollbar nya Hafidz Blog warna hitam terus jalur scroll nya warna ijo , cuma sayangnya di mozila fire fox ga mempan / scroll nya jadi biasa beda sama di chrome bisa terlihat perbedaan scrrollnya . . . .

nah buat kalian yang pakai chrome atau yang lainnya , pkoknya di coba dulu kalo gak bisa berarti ga cocok sama aplikasi internet kalian . . .

langkah nya cukup mudah :

1. Login ke blog (blogspot.com)

2. pilih menu template terus pilih lagi edit HTML terus klick lanjutkan

3. Klick tombol Ctrl+f pada keyboard , lalu ketikan kode dibawah  ini :
]]></b:skin>


4. kalo udah ketemu kode nya  copy paste kan kode yang ada di bawah ini diatas kode ]]></b:skin>  tadi :



::-webkit-scrollbar { height:15px; width: 15px; background: #e6e6fa; } ::-webkit-scrollbar-thumb { background-color: #1F61DB; -moz-border-radius: 12px; border-radius: 12px; }


5. untuk yang mau merubah warnanya terus ga tau kode warnanya kaya contoh diatas yang berwarna merah #e6e6fa / #1F61DB tenang aja Hafidz Jabar juga punya formulanya dan gampang banget kalian cuma perlu menyebutkan warnanya dalam bahasa inggris contoh : red (merah) , blue (biru) , black (hitam) , green ( hijau ) , purple ( ungu ) ..... dll, tapi yang perlu di perhatikan , kalian tidak perlu menggunakan tanda pagar ( # ) ==> ( #red ) tapi langsung aja red setelah titik dua ( : ) contoh : background-color: red 


nah setelah selesai semua langkah-langkah nya , tinggal di uji coba dengan cara klick pratinjau . . .

kalo udah berhasil langsung di save deh dengan mengklik simpan . . . .



nih contoh jadinya :




oiyah langkah terakhir jangan sampai lupa buat join n klik like pada Hafidz Blog hehehe ( bercanda kok )
selamat mencoba dan selamat berbagi . . .

kalo mau posting di blog nya boleh copy kode HTML nya , tapi kata-katanya buat sendiri wkwkwk
salam semangat dan salam bloger . . . .

Tuesday, 1 May 2012

Cara Membuat Link Exchange / Kotak Tukeran Link

 Alhamdulillah , soalnya kemarin saya coba nyari-nyari gimana caranya ngebuat kotak Link Exchange / Tukeran  Link . Tadinya saya pikir susah ga tau nya ternyata mudah kok . Hafidz Blog Akan kasih formulanya :

Berikut Langkah-Langkahnya :

1. Klick Dulu tombol like di atas hehe ( Bercanda )

sekarang serius yah ..

1. klick tombol join this site ( kalo mau Join n jadi teman di blog ini ) hihihi

beneran sekarang mah ,

pertama , kalian login dulu ke blog yang kalian punya ( Blogspot )  . . . .


kedua , klick tata letak / edit elemen . . . .

ketiga , pilih add gadget ....


keempat pilih HTML/JavaSript ( Liat gambar dan klik gambar biar terlihat jelas ) :


kelima , copy kode dibawah : ( pake Ctrl+f )

<p>Mau Tukar Link? Copy/paste code HTML berikut ke blog anda</p>
<p><a href="http://hafidz7abar.blogspot.com/" target="_blank"><img alt="Triks blog & Computer" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnCYQ3nVh5iHtEOSzCc1oay92CJOynhElKe1hJ_1ttYvURocd1PiotmSAPcp3_g6GAl3TQVtfD00V-pYLVXmH1uWbRaITOY9fIr7J5ouq1rqtclbgEIZWWWQXIxmteltXNf3z2jH93_ran/s1600/ff.jpg" border="0" /></a></p>
 <p><textarea rows="3" cols="31"><a href="http://hafidz7abar.blogspot.com" target="_blank"><img border="0" alt="Trik Blog , Ilmu Copmuter gratis ,Belajar VB , Delphi , dan Kampus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnCYQ3nVh5iHtEOSzCc1oay92CJOynhElKe1hJ_1ttYvURocd1PiotmSAPcp3_g6GAl3TQVtfD00V-pYLVXmH1uWbRaITOY9fIr7J5ouq1rqtclbgEIZWWWQXIxmteltXNf3z2jH93_ran/s1600/ff.jpg"/></a></textarea></p>

==> Jangan Lupa ganti Tulisan Berwarna Hijau pada kode di atas dengan ==> link  Blog Kalian (contoh :http://hafidz7abar.blogspot.com ) , ==> Url Gambar Kalian ( contoh : https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnCYQ3nVh5iHtEOSzCc1oay92CJOynhElKe1hJ_1ttYvURocd1PiotmSAPcp3_g6GAl3TQVtfD00V-pYLVXmH1uWbRaITOY9fIr7J5ouq1rqtclbgEIZWWWQXIxmteltXNf3z2jH93_ran/s1600/ff.jpg ) sama deskripsi ==> blog kalian yah ( Contoh :  Trik Blog , Ilmu Copmuter gratis ,Belajar VB , Delphi , dan Kampus )<==

kalo sudah di ganti terus langkah selanjutnya 

paste kan ( pake Ctrl+V ) kedalam box yang ada di HTML/JavaScript Tersebut , contoh ( lihat gambar )





Kalo udah klik simpan , dan lihat hasilnya di blog kalian . kalo berhasil contohnya akan seperti ini ( gambar di Hafidz Blog ) :

Mau Tukar Link? Copy/paste code HTML berikut ke blog anda


Triks blog & Computer









Friday, 27 April 2012

Cara Ngumpetin File / Hiden

Bagi yang pengen tau caranya ngumpetin file biar gak ketuan orang lain n biar gak di buka .
biasanya file rahasia biar orang lain ga bisa buka sembarangan cz kan udah di umpetin , yaudah langsung aja praktek :

1. Kita ke Windows Explorer ( Bukan Dora / Peppy yah tapi windows ) caranya liat gambar :



2. Kita Cari File yang pengen kita umpetin / hiden terus klik kanan abis itu klik properties : Caranya Liat gambar ( di klick gambarnya biar jelas );




3. Teru kalo udah di beri tanda centang pada HIDEN nya :  Caranya Liat gambar
 ( di klick gambarnya biar jelas );


4. Klick organize terus pilih foldera and search option: Caranya Liat gambar ( di klick gambarnya biar jelas ); 


5. terakhir pilih view terus pilih don't show folder , files , or driver Caranya Liat gambar ( di klick gambarnya biar jelas );


Okeh sekarang file kita udah ga keliatan lagi deh ...
kalo mau di tampilin lagi , tinggal pilih organize - Folder search option - view - show folder , files , or driver - apply - ok

demikian ilmu sharring dari saya semoga bermanfaat ,
aamiin ......
bagi like nya yah hehe

Cara Membuat Link Sahabat

Ehm dari pada sepi ga ada updatetan ,
Saya akan meng-update bagaimana caranya membuat Link Sahabat :
1. Baca Basmallah ,
2. Klick Tata Letak , Caranya kaya gini : ( Klick Gambar Di bawah )


3. Klick Add Gadget


4. Pilih HTML/JavaScript


5. Copy-in (Ctrl+C) kode di bawah ini terus masukin di HTML/Java Script tsb :

<div style="overflow: auto; width: 200px; height: 100px; text-align: center; background:#ffff;">
<a href="http://Alamat Web / Blog Teman Kalian" target="_blank">Masukan Nama Judulnya</a><br/>
<a href="http://Alamat Web / Blog Teman Kalian" target="_blank">Masukan Nama Judulnya</a><br/>

<a href="http://Alamat Web / Blog Teman Kalian" target="_blank">Masukan Nama Judulnya</a><br/>

kalo Mau Nambahin lagi yah tinggal di copy aja sesuai kebutuhan
yang Warna Merah kalian Ubah Yah sama alamat link temen kalian sama Masukin nama Judul link nya

terus klik simpan

selamat mencoba