Pada posting kali ini akan memberikan tutorial Cara Membuat Readmore atau Baca Selengkapnya pada postingan blog secara otomatis. Dengan demikian, kita bisa menentukan berapa ketinggian dan lebar penggalan postingan dan image yang kita inginkan yang akan muncul pada halaman pertama blog kita sehingga terlihat rapi dan menarik. Trik ini mungkin telah banyak yang mengetahui dan ada juga yang belum mengetahuinya. Bagi anda yang belum mengetahui bagaimana cara membuat readmore otomatis, ayo ikuti tips-tips berikut :
1. Masuk Account blogger anda, pilih Edit Html. Kemudian centang "Expand Widget Template"
2. Cari kode </head> kemudian masukkan script di bawah ini persis dibawah kode tersebut.
<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://deddycamp.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>
3. Cari kode html berikut :
<data:post.body/> atau <p><data:post.body/></p>
Ganti kode tersebut dengan kode 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:right;padding-top:20px;'>
<a expr:href='data:post.url'>»»  READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Keterangan : tulisan yang berwarna merah adalah yang bisa anda ganti.
=> Summary noimg 430 = tinggi artikel terpenggal tanpa image
=> Summar img 430 = tinggi artikel terpenggal dengan image
=> Readmore bisa anda ganti dengan Baca Selengkapnya, full read dan Lain Sebagainya.
Truss.. simpan dech!!
Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial Blog. Tampilkan semua postingan
23 Desember 2010
8 Desember 2010
Mengganti Title Blog Dengan Title Postingan
Pernah lihat blog anda di "mbah GOOGLE" klo pernah disan pasti blog kita tertulis sesuai dengan judul blog kita/title blog kita , nah klo kita lihat pada kebanyakan blog milik oeang lain disana pasti tertulis judul blog sama dengan judul postingannya... nah sedikit saya memberi tahu tentang perubahan title ini, perubahan title ini berpengaruh juga lo untuk mempermudah "mbah GOOGLE" mebaca postingan kita, maka dari itu
untuk blog kita lebih terkenal dan dikenal dengan judul postingan kita maka itu dapat diganti dengan cara sebagai berikut..:
1. Masuk ke -->Edit Html anda.
2. Cari kode <title><data:blog.title/></title>
3. Ganti kode tersebut dengan :
<b:if cond='data:blog.pageType == "index"'><title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>
4. Klo udah simpan..
Selesai mudah bukan klo mo test coba lihat blog anda di google, dan jika kamu buka salah satu postinganmu mak judul blog mu akan berubah menjadi judul postingan..
untuk blog kita lebih terkenal dan dikenal dengan judul postingan kita maka itu dapat diganti dengan cara sebagai berikut..:
1. Masuk ke -->Edit Html anda.
2. Cari kode <title><data:blog.title/></title>
3. Ganti kode tersebut dengan :
<b:if cond='data:blog.pageType == "index"'><title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>
4. Klo udah simpan..
Selesai mudah bukan klo mo test coba lihat blog anda di google, dan jika kamu buka salah satu postinganmu mak judul blog mu akan berubah menjadi judul postingan..
Mendisable Klik Kanan Pada Blog
Mungkin anda sering membuka suatu situs yang melarang blognya untuk diklik kanan oleh pengunjungnya atau dengan kata lain mendisablekan klik kanan khusus pada blog/situsnya saja. Guna dari disable ini ialah untuk melindungi konten atau foto yang anda miliki untuk dicopy oleh orang lain dengan kepentingan yang kita tidak tahu. Nah berkut ini ada javascript untuk mendisablekannya yaitu :
<script language=JavaScript>
<!--
//Matikan Klik Kanan
var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
<script language=JavaScript>
<!--
//Matikan Klik Kanan
var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
Script ini dicopykan ke blog anda dengan cara :
1. Klik Layout dan pilih edit html
2. Cari kode <head>
3. Copykan kode tersebut dibawahnya.
3. Copykan kode tersebut dibawahnya.
4. Save.
7 Desember 2010
Membuat Alert Message di Blog
Mungkin anda pernah melihat kotak alert seperti dibawah ini ketika mengunjungi sebuah blog. Dimana anda harus mengklik tombol OK atau klik tombol Close untuk bisa mengakses blog tersebut.
Sesuai dengan namanya, maka kotak ini berfungsi untuk menampilkan pesan-pesan penting atau peringatan kepada pengunjung. Contohnya seperti pesan diatas..
Caranya :
1. Login ke blogger.
2. Klik Layot (Tata Letak).
3. Klik tab Edit HTML
4. Backup template anda yakni dengan Klik tulisan Download Template Selengkapnya.
5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
6. Cari kode <head> lalu letakkan script berikut dibawahnya :
<script language='JavaScript'>alert("Welcome To My Blog");</script>
7. Teks yang berwarna Biru diatas merupakan teks yang akan muncul dalam kotak alert. Silahkan ganti dengan teks yang ingin anda sampaikan.
8. Terakhir, tentu saja Simpan Template..
Sesuai dengan namanya, maka kotak ini berfungsi untuk menampilkan pesan-pesan penting atau peringatan kepada pengunjung. Contohnya seperti pesan diatas..
Caranya :
1. Login ke blogger.
2. Klik Layot (Tata Letak).
3. Klik tab Edit HTML
4. Backup template anda yakni dengan Klik tulisan Download Template Selengkapnya.
5. Silahkan save dulu template tersebut, ini di maksudkan untuk mengurangi resiko apabila terjadi kesalahan ketika melakukan editting pada template, kita masih punya back up data untuk mengembalikannya seperti semula.
6. Cari kode <head> lalu letakkan script berikut dibawahnya :
<script language='JavaScript'>alert("Welcome To My Blog");</script>
7. Teks yang berwarna Biru diatas merupakan teks yang akan muncul dalam kotak alert. Silahkan ganti dengan teks yang ingin anda sampaikan.
8. Terakhir, tentu saja Simpan Template..
30 November 2010
Membuat Link Exchange
Link Exchange atau biasa kita sebut dengan tukar link adalah salah satu motif widget penghias blog atau website yang walaupun sepele mampu meningkatkan traffic site/blog dan page rank.
Walaupun begitu, dari sejarah survey blog yang ada, masih banyak yang belum memiliki link Exchange ini (kecuali para blogger lama). Akan saya ulas sedikit bagai mana cara membuat link Exchange, juga Link Scrolling atau kotak bergeser.
Lankah-langkah membuat Link Exchange:
1. Anda harus desain dulu banner milik Anda. Terserah mau buat pake apa, pake photoshop, corel draw, firework atau image ready . Ukurannya bebas, (yang umum 150px x 150px)mau sehalaman penuh juga gak pa-pa, Cuma kalo sehalaman penuh ntar nggak ada yang mau tukeran link.. (formatnya suka-sukalah..GIF, JPG, BMP,dan PNG)
2. Kalo udah jadi upload banner mu disini
3. Setelah ter-upload, setiap gambar pasti ada direct link (copy aja direct link dari banner yang kamu upload tadi.
4. Lalu copy paste kode dibawah ini untuk gambar logo link anda :
<a href="http://khoiri-ninetyone.blogspot.com" target="_blank"> <img border="0" alt="Favicon1" src="http://img10.imageshack.us/img10/5795/bannerblogvd.jpg"/> </a>
ganti kode yang berwarna Biru dengan url blog anda dan ganti kode yang berwarna hijau dengan link gambar anda.
Dan untuk kotak copy paste Link Exchange copy kode di bawah ini :
<textarea cols="22" name="textarea"> <a href="http://khoiri-ninetyone.blogspot.com"> <img src="http://img10.imageshack.us/img10/5795/bannerblogvd.jpg" /> </a> <br /></blockquote><br /></code><br /><br /></textarea>
Ganti kode yang berwarna biru dengan url blog anda dan ganti kode yang berwarna hijau dengan link gambar anda..
Jangan lupa di save yaa..
Walaupun begitu, dari sejarah survey blog yang ada, masih banyak yang belum memiliki link Exchange ini (kecuali para blogger lama). Akan saya ulas sedikit bagai mana cara membuat link Exchange, juga Link Scrolling atau kotak bergeser.
Lankah-langkah membuat Link Exchange:
1. Anda harus desain dulu banner milik Anda. Terserah mau buat pake apa, pake photoshop, corel draw, firework atau image ready . Ukurannya bebas, (yang umum 150px x 150px)mau sehalaman penuh juga gak pa-pa, Cuma kalo sehalaman penuh ntar nggak ada yang mau tukeran link.. (formatnya suka-sukalah..GIF, JPG, BMP,dan PNG)
2. Kalo udah jadi upload banner mu disini
3. Setelah ter-upload, setiap gambar pasti ada direct link (copy aja direct link dari banner yang kamu upload tadi.
4. Lalu copy paste kode dibawah ini untuk gambar logo link anda :
<a href="http://khoiri-ninetyone.blogspot.com" target="_blank"> <img border="0" alt="Favicon1" src="http://img10.imageshack.us/img10/5795/bannerblogvd.jpg"/> </a>
ganti kode yang berwarna Biru dengan url blog anda dan ganti kode yang berwarna hijau dengan link gambar anda.
Dan untuk kotak copy paste Link Exchange copy kode di bawah ini :
<textarea cols="22" name="textarea"> <a href="http://khoiri-ninetyone.blogspot.com"> <img src="http://img10.imageshack.us/img10/5795/bannerblogvd.jpg" /> </a> <br /></blockquote><br /></code><br /><br /></textarea>
Ganti kode yang berwarna biru dengan url blog anda dan ganti kode yang berwarna hijau dengan link gambar anda..
Jangan lupa di save yaa..
Membuat Daftar Artikel Dalam Postingan
Agar posting lebih lincah menghantar pengunjung keluar masuk antar artikel di halaman posting, kita juga bisa membuat daftar link di dalamnya. Pastikan dalam pada blog anda sudah tersedia beberapa posting. Berikut langkah-langkahnya:
1. Masuklah ke halaman dasbor anda. Kemudian klik menu Edit Entri. Kemudian klik edit tepat pada baris salah satu tulisan yang akan dipasang daftar link artikel di dalamnya.
2. Sebagai contoh ketiklah seperti di bawah ini (tentu sesuai dengan judul posting yang ada pada blog anda).
3. Sekarang tinggalkan halaman edit entri ini untuk sementara tanpa menutupnya. Bukalah blog anda dan masuklah ke halaman psoting pertama (sesuai daftar posting di atas). Kemudian copy-lah alamat yang tertera pada address bar.
1. Masuklah ke halaman dasbor anda. Kemudian klik menu Edit Entri. Kemudian klik edit tepat pada baris salah satu tulisan yang akan dipasang daftar link artikel di dalamnya.
2. Sebagai contoh ketiklah seperti di bawah ini (tentu sesuai dengan judul posting yang ada pada blog anda).
3. Sekarang tinggalkan halaman edit entri ini untuk sementara tanpa menutupnya. Bukalah blog anda dan masuklah ke halaman psoting pertama (sesuai daftar posting di atas). Kemudian copy-lah alamat yang tertera pada address bar.
Membuat Animasi windows Berputar
Baiklah, Kali saya ingin berbagi ilmu yang baru saya dapatkan, akibat hasil dari browsing di dunia maya.. yaitu membuat windows berputar pada pembukaan blog. ketika kalian buka blog, kalian akan lihat gambar windows yang berputar-putar kayak error. kalo orang gak tau paling dikiranya kena virus kali?? bagaimana cara membuatnya? gampang, tinggal ikuti langkahnya dan langsung praktekkan !!
1. login ke blogger kamu
2. pilih menu tata letak
3. pilih submenu edit html
4. cari kode <head>
5. letakkan kode berikut tepat di bawah kode tersebut
<script type='text/javascript'>
//<![CDATA[
scrW=screen.availWidth
scrH=screen.availHeight
window.resizeTo(10,10)
window.focus()
for(a=0;a<80;a++){
window.moveTo(0,0)
window.resizeTo(0,scrH*a/80)
}
window.resizeTo(0,0)
for(b=0;b<80;b++){
window.moveTo(0,scrH/1)
window.resizeTo(scrW*b/80,0)
}
for(c=0;c<80;c++){
window.moveTo(scrW/1,scrH/1)
window.resizeTo(0,scrH*c/80)
}
for(d=0;d<80;d++){
window.moveTo(scrW/1,0)
window.resizeTo(scrW*d/80,0)
}
for(e=0;e<80;e++){
window.resizeTo(scrW*e/80,scrH*e/80)
}
window.moveTo(0,0)
window.resizeTo(scrW,scrH)
//]]>
</script>
Kemudian jangan lupa di save yaa..
1. login ke blogger kamu
2. pilih menu tata letak
3. pilih submenu edit html
4. cari kode <head>
5. letakkan kode berikut tepat di bawah kode tersebut
<script type='text/javascript'>
//<![CDATA[
scrW=screen.availWidth
scrH=screen.availHeight
window.resizeTo(10,10)
window.focus()
for(a=0;a<80;a++){
window.moveTo(0,0)
window.resizeTo(0,scrH*a/80)
}
window.resizeTo(0,0)
for(b=0;b<80;b++){
window.moveTo(0,scrH/1)
window.resizeTo(scrW*b/80,0)
}
for(c=0;c<80;c++){
window.moveTo(scrW/1,scrH/1)
window.resizeTo(0,scrH*c/80)
}
for(d=0;d<80;d++){
window.moveTo(scrW/1,0)
window.resizeTo(scrW*d/80,0)
}
for(e=0;e<80;e++){
window.resizeTo(scrW*e/80,scrH*e/80)
}
window.moveTo(0,0)
window.resizeTo(scrW,scrH)
//]]>
</script>
Kemudian jangan lupa di save yaa..
Memasukkan Kode HTML Dalam Postingan
Blog tidak bisa lepas dari kode HTML. Untuk memposting suatu artikel, mau tidak mau kode HTML harus ikut serta. Namun, bagaimana caranya supaya kode HTMl yang inginkan bisa tampil dalam postingan? tentu kita harus tau tips dan triknya.. mau tau lebih lanjuut?? baca truuusss...heheh. contohnya kode HTML , tidak ditulis begitu saja pada kotak posting, karena pada saat diterbitkan kode tersebut tidak akan kelihatan. Untuk itu kita harus melakukan sedikit cara yang sangat simpel agar kode HTML bisa ditampilkan. Berikut caranya :
"ENCODE" dulu kode HTML yang akan sobat tulis pada kotak posting di http://centricle.com/tools/html-entities/. mau coba lansung? klik aja disini..
Selanjutnya ketik kode HTML sobat pada kotak tersebut, lalu klik "ENCODE".
Kemudian Anda akan mendapatkan kode baru untuk kode HTML. Copy semua kode tersebut, lalu paste pada postingan yang akan sobat terbitkan. Gampang kan ??? Oke selamat berjuang..
"ENCODE" dulu kode HTML yang akan sobat tulis pada kotak posting di http://centricle.com/tools/html-entities/. mau coba lansung? klik aja disini..
Selanjutnya ketik kode HTML sobat pada kotak tersebut, lalu klik "ENCODE".
Kemudian Anda akan mendapatkan kode baru untuk kode HTML. Copy semua kode tersebut, lalu paste pada postingan yang akan sobat terbitkan. Gampang kan ??? Oke selamat berjuang..
Memasang Widget Translator
Memasang Widget translator atau "Penerjemah" pada blog banyak sekali gunanya. Translator ini berguna apabila ada pengunjung dari negara lain yang secara sengaja maupun tidak yang melihat blog kita dan tidak tahu bahasa kita maka mereka bisa menggunakan widget ini untuk menterjemahkannya kedalam bahasa yang mereka inginkan (tentunya yang sudah ada di widget ini). Widget ini sudah support untuk bahasa Indonesia. Dan kalo kamu mau, translator ini bisa juga untuk menterjemahkan tugas dari sekolah/kampus secara mudah. Dan hasilnya bisa lebih bagus daripada software transtool lho. Gimana? mau membuatnya? caranya mudah lho. Gini nih...
1. Login ke Blogger trus pilih menu "Layout" atau "Tata Letak"
2. Kemudian klik pada "Add Gadget" atau "tambah gadget=".
3. Lalu pilih HTML/Javascript"
4. Kemudian masukkan script berikut ini kedalamnya
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=id&w=160&h=60&title=&border=&output=js"></script>
1. Login ke Blogger trus pilih menu "Layout" atau "Tata Letak"
2. Kemudian klik pada "Add Gadget" atau "tambah gadget=".
3. Lalu pilih HTML/Javascript"
4. Kemudian masukkan script berikut ini kedalamnya
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=id&w=160&h=60&title=&border=&output=js"></script>
Langganan:
Postingan (Atom)
.png "English"){kind=small}
