Archive for 03/29/11

Trik Memproteksi Blog dari Penjiplakan

3:06:00 PM
Trik Memproteksi Blog dari Penjiplakan
Mungkin bagi sebagian para pemilik blog sering kali jengkel jika melihat artikel-artikel yang dibuatnya dengan memeras otak (emangnya cucian) tiba-tiba sudah ada di tempat blog milik orang lain, apalagi kalo disitu tidak disebutkan sumber asli dari artikel tersebut, pasti orang tersebut akan bilang "ANJRIT" :@ dan sumpah serapah yang lain (apa aja ya kata sumpah serapah?, aku taunya cuma itu doang, aku kan selalu ngomong yg baik2 jadi nggak tahu kata-kata kotor :D hooooeeeekkkkk..). Tapi mungkin bagi sebagian orang lagi sih nggak mempermasalahkannya, entah artikelnya diambil kek, di copy kek, di cekek kek "No Problem". Nha, kamu termasuk golongan yang mana nih? yang Protectif atau yang Cuekif (bahasa mana tuh "Cuekif"). Kalo kamu termasuk yang yang Protectif alias golongan orang yang artikelnya nggak mau dicuri orang, sini ikut saya , tak tunjukin jalan menuju sorga, eeh, maksudnya cara melakukannya.
Udah berdebar-debar ya?, nggak sabar nunggu ya? ya udah deh ini dia Tips dan Trik untuk memproteksi artikel dari pencurian...

pertama-tama kita panjatkan puja dan puji sukur kita kepada Tuhan YME. Walah malah pidato. Langsung aja deh
Pertama-tama kita panjatkan, walah kok itu lagi sih :@
Pertama-tama kita analisa dulu, biasanya kalo mau nyuri artikel kan ada beberapa cara nih, mulai dari menyeleksi tulisan yang mau dicuri kemudian di copy-paste. Atau melihat "Source Code"nya dengan meng-klik kanan dan lain-lain. Ada beberapa cara untuk mengatasi masalah tersebut, mulai dari cara yang mudah sampai cara yang sulit. Nha untuk Tips dan Trik kali ini kita akan mencoba menggunakan cara yang mudah saja, tapi ingat, cara ini hanya efektif untuk menghadapi maling kelas teri, jadi nggak akan mempan menghadapi para penjahat kelas kakap yang sudah banyak makan asam garam dunia internet (emangnya enak makan asam ama garam?). Tapi lumayan kan untuk berjaga jaga dari maling-maling kelas teri. Nha berikut adalah triknya...
copy script dibawah ini kedalam body kamu (lho? kok kedalam body sih?), maksudnya kedalam tag <body .....
begini deatil caranya:
pertama login dulu ke blogger, terus pilih Layout --> Edit HTML
cari kode ini <body> letaknya kira-kira di tengah bagian kiri, dan biasanya setelah kode </head> . perlu diperhatikan bahwa di dalam kode html terdapat banyak tulisan "body", jangan salah memilih body :D .
kalo sudah ketemu letakkkan script ini didalamnya

onmousedown="return false" oncontextmenu="return false" onselectstart="return false"

contohnya kayak gini nih

<body onmousedown="return false" oncontextmenu="return false" onselectstart="return false" >

Nha, script diatas untuk memproteksi agar text yang ada tidak bisa di seleksi untuk dicopy, dan juga tidak bisa di klik kanan.
trus bagaimana kalo kalo pencurinya lihat source code kita lewat menu-menu yang ada di web browser? misalnya yang pake Mozilla dengan cara Klik View -->> Page Source atau dengan menekan Ctrl+u. Nha untuk menakali masalah ini kita kita pakai cara licik aja, yaitu dengan menurunkan script html kebawah, caranya gimana tuh?
gini, taruh kursor/pointer ke atas tag <head> (letaknya dibagian atas), trus tekan enter sampai kira-kira 70 kali. Nha kalo pencurinya melihat source code kita, dia hanya akan melihat kode kepala dari html kita, sedangkan isi dari blog kita kan udah turun ke bawah, tul ga? :D
tapi ingat sekali lagi, ini hanya untuk pencuri kelas teri, walaupun diproteksi secanggih apapun, pasti tetap aja ada orang yang akan bisa membongkarnya, tapi kan setidaknya kita berjaga-jaga, ya tho?
Monggo di jajal..

Perhatian : Kalo pake trik proteksi ini, maka untuk form-form isian seperti search engine, kotak komentar haloscan, shoutbox ogix. tidak bisa diisi. Jadi kalo memang tidak benar-benar diperlukan, jangan menggunakan trik ini. he..he.. :D

Cara Membuat Template di Blogger

3:06:00 PM
Cara Membuat Template di Blogger
Yak akhirnya jadi juga, seperti yang aku janjikan kemarin yaitu "Cara Membuat Template Blogger". Mulai dari mana ya? nnnngg.. :t ohya, tak jelasin dulu deh tentang artikel ini. Gini, dalam trik berikut, kita akan mencoba membuat template yang paling sederhana dan paling mudah. Sebenarnya dalam mebuat template di blogger harus mengerti tentang CSS dan HTML, tapi untuk kali ini kita hanya memerlukan sedikit kemampuan tersebut karena kita akan membuat template yang paling sederhana, tapi jangan salah walaupun caranya sederhana tapi hasilnya bisa sangat luar biasa, tergantung dari desainernya. Ok deh mulai aja deh ya, kayaknya udah pada nggak sabar nih.

Gini, cara termudah dalam membuat template blogger yaitu dengan mendownload sebuah template kemudian kita otak-atik sendiri, jadi kita tidak perlu membuat dari awal. Untuk bahan praktek kali ini kita coba memakai template yang aku dah pernah aku buat, downlad disini bahannya. Sebelum kita mulai gue saranin lo buat blog baru aja biar gak ngerusak blog asli kamu.

Tahap Desain

Template yang akan kita buat disini memiliki empat komponen utama yaitu Background, Header, Main dan Footer. seperti yang ada dalam gambar berikut:



Jadi kamu harus membuat keempat komponen tersebut. Cara buatnya gimana? kamu harus bisa menggunakan software image editor seperti Photoshop, Corel, Paint dll. Cara pembuatan desainya lebih jelasnya seperti ini:
1. Buat desain seperti gambar diatas
2. Pada bagian background usahakan bersifat "Tile / Pattern" (kecil dan berulang-ulang).
3. Untuk Main dibagi lagi menjadi beberapa kolom, boleh 2 kolom, 3 kolom atau terserah deh. Dan biasanya terdiri dari bagian utama (posting) dan sidebar.
4. Kemudian potong-potong perbagian.
5. Untuk bagian Header motongnya harus full.
6. Bagian background, main dan footer motongnya sedikit aja karena bersifat "tile"
7. Desain diatas kalo dipotong-potong akan menjadi seperti ini :

background
header
main
footer

8. Upload potongan-potongan tersebut pada sebuah webhosting atau layanan penyimpanan file lainya. Contohnya di geocities atau Photobucket dll.

Nha modeng po ra?

Sekarang kita memasuki ke tahap penyusunan di blogger. gini langkah-langkahnya. Ohya udah di download belum tadi bahanya, kalo belum download dulu diatas itu. Ok kita mulai:
1. Kembali ke blogger dan ke menu "Edit HTML".
2. Trus klik tombol "Brows" untuk mengupload template yg udah kamu donwload tadi.
3. Kemudian Cari kode seperti ini:

body { margin: 0px; padding: 0px; text-align: left; font:$bodyfont; color:$textcolor; background: #323232 url('http://kendhin.890m.com/template/bg.jpg') repeat-x top left; }
4. Ganti text yang dicetak tebal dengan lokasi gambar background yang kamu buat.
5. Cari kode seperti ini :

#center {background: #ffffff url('http://kendhin.890m.com/template/main.jpg') repeat-y top center;}

6. Ganti text yang dicetak tebal dengan lokasi gambar main kamu.
7. Cari kode seperti ini:

#header { margin: 0; height:196px; width:898; color: $pagetitlecolor; background: url('http://kendhin.890m.com/template/head.jpg') no-repeat top center; }

8. Ganti text yang dicetak tebal dengan gambar header.
9. Cari kode seperti ini:

#footer { margin: 0; width: 898px; height:80px; padding: 0px; background: url('http://kendhin.890m.com/template/foot.jpg') repeat-y top center; }

10. Ganti text yang dicetak tebal dengan gambara foter.
11. Masih ada beberapa hal yang harus kamu perhatikan. coba cari kode-kode berikut:

#outer-wrapper { width: 898px; margin: 0px auto 0; text-align: justify; }

kode width: 898px menunjukkan lebar dari blog kamu, kamu bisa mengubahnya sesuai keinginanmu, tapi harus disesuaikan dengan lebar desain gambar yang kamu buat.

#main { float: left; width: 445px; margin: 5px; padding: 0px 0px 0px 10px; line-height: 1.5em; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; }

kode width: 445px; adalah lebar daerah main yang berisi posting, kamu bisa merubahnya.

#sidebar { float: right; width: 153px; padding-right: 50px; font-size: 83%; color: $sidebartextcolor; line-height: 1.4em; word-wrap: break-word; overflow: hidden; }
#ads-wrapper {float: left; width: 195px; padding-left: 10px; word-wrap: break-word; overflow: hidden; }

kode width: 153px; adalah lebar sidebar bagian kanan. Dan kode width: 195px; adalah lebar sidebar bagian kiri. Terus kode padding-right: 50px; jarak antara tulisan atau isi sidebar sebelah kanan dengan garis batas kanan. Dan kode padding-left: 10px; adalah jarak antara isi sidebar kiri dengan garis batas kiri.

#header { margin: 0; height:196px; width:898; color: $pagetitlecolor; background: url('http://kendhin.890m.com/template/head.jpg') no-repeat top center; }

kode height:196px; width:898; adalah ukuran tinggi dan lebar bagian header, kamu bisa menyesuaikannya dengan ukuran header kamu.

#footer { margin: 0; width: 898px; height:80px; padding: 0px; background: url('http://kendhin.890m.com/template/foot.jpg') no-repeat top center; }

kode width: 898px; height:80px; adalah ukuran lebar dan tinggi bagian footer.

12. Nah kalo udah selesai coba di preview template kamu, sudah sesuai kah? atau hancur?
13. Kalo sudah di Save.

:f akhirnya selesai juga aku buat artikel tentang pembuatan template, capek ya? tapi ingat sekali lagi ini adalah metode membuat template yang mudah dan sederhana, jadi sebenrnya isi dari template lebih rumit lagi, munkin kapan-kapan akan kita bahas detail dari bagian-bagina template tersebut.
OK SELAMAT BERJUANG......

Cara Membuat Dropdown Menu

3:05:00 PM
Cara Membuat Dropdown Menu
Dengan dropdown menu kita bisa mnghemat space/ruang di blog kita, karena dengan ukuran yang kecil seperti itu bisa menyimpan link dan text yang banyak. Itu bisa diisi dengan arsip, blogroll dll.
Gimana? Mau mencobanya?
Gini nih caranya :


Login ke blogger, trus masuk ke menu "Page Element" trus pilih Add page elements --> HTML/JavaScript. Kemudian masukkan script berikut ini di kocat "Content"

<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="Links 1">Text 1</option>
<option value="Links 2">Text 2</option>
</select>

Text yang berwarna merah adalah link. ganti text2 tersebut dengan link2 kamu.
Text yang berwarna biru adalah tulisan yang ditampilkan. Itu juga harus km ganti.

Contohnya seperti ini :

<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option value="0" selected>Arsip Blog</option>
<option value="http://trik-tips.blogspot.com/2008/01/membuat-menu-horizontal.html"> Cara Membuat Menu Horizontal </option>
<option value="http://trik-tips.blogspot.com/2007/12/cara-membuat-search-engine.html"> Cara Membuat Search Engine </option>
</select>

maka hasilnya akan seperti ini :



untuk menambahkan menu lagi, tambahkan kode seperti ini :

<option value="Links 2">Text 2</option>

sebelum kode </select>

Link dalam dropdown menu di atas jika di klik akan membuka link di halaman yang sama. Ini cocok untuk Arsip dan link-link yang masih berhubungan dengan blog tsb.

Ada satu tipe lagi yang jika diklik linknya maka akan membuka window baru tanpa menutup blog kamu. Yang ini cocok untu Blogroll atau Friend link.
Cara mambuatnya seperti diatas tapi ganti kode berikut

<select onChange="document.location.href=this.options[this.selectedIndex].value;">

ganti dengan kode ini :

<select onchange="javascript:window.open(this.options[this.selectedIndex].value);">
file asli ada di sini

Cara Membuat Search Engine

3:03:00 PM
Cara Membuat Search Engine
Tentu kita semua sudah tahu apa itu Search Engine (hari gini gak tahu apa itu search engine? cape' deeh...). Search Engine adalah ... bla.. bla..bla.. dst.
Saat ini Search Engine tidak bisa dipisahkan dalam dunia internet. Dengan Search Engine kita bisa mencari tahu tentang suatu hal yang kita inginkan sesuai dengan keyword yang kita ketikkan dan juga bla.bla..bla..... udah ah penjelasannya, yang mau dibahas disini adalah bagaimana caranya membuat search engine di blogger . Caranya sangat mudah, yaitu:

1. Login ke blogger terus klik Layout terus pilih page elements nha disitu kan banyak tulisan Add a page elements klik link tersebut dan sesuaikan dimana tempatnya menaruh search engine
2. kemudian pada layar baru yang muncul pilih HTML/Javascript kemudian copy/paste script/kode berikut ini di dalam kolom content.

<form action="http://nama-blogmu.blogspot.com/search"
method="get"> <input class="textinput" name="q" size="30" type="text"/> <input value="search" class="buttonsubmit" name="submit" type="submit"/></form>

Ganti nama-blogmu dengan nama blog kamu. Aangka 30 menunjukkan panjang kotak (text box) semakin banyak angkanya maka semakin panjang textbox-nya

Cara Menuliskan Script/Kode Dalam Artikel Blog

3:02:00 PM
Cara Menuliskan Script/Kode Dalam Artikel Blog
Untuk menuliskan script/kode kedalam artikel blog memang ada tekniknya sendiri, karena jika kita menuliskannya dengan cara yang biasa maka yang akan muncul kemudian di blog tidaklah seperti dengan apa yang kita tuliskan. Misalnya gini, jika kita menuliskan kode <head> dengan cara yang biasa maka hasilnya tidak akan muncul dalam postingan karena kode tersebut langsung diterjemahkan kedalam bahasa HTML. Jadi untuk menuliskan kode <head>, maka yang seharusnya dituliskan supaya bisa muncul kode tersebut adalah ini &lt;head&gt;. Nah terus bagaimana kalau ada banyak kode yang harus kita posting?
Mau tahu bagaimana caranya menuliskan kode2/script2 tersebut ke dalam blog?

Ada beberapa cara untuk menuliskan kode-kode tersebut kedalam blog, diantaranya yaitu:

Cara Pertama :
- Gunakan software-software web design, misalnya Macromedia Dreamwaver, Microsoft Frontpage, Namao Web Editor. Atau bisa juga dengan software-software blogtools seperti post2blog dll.
- Trus tuliskan semua kode pada area design, kemudian copy kode-kode tersebut dari area HTML Code. Nha kode-kode dalam area HTML Code tersebut lah yang harus diposting.

Cara Kedua :
- Tuliskan semua kode/script ke dalam notepad
- Kemudian ganti/replace kode-kode berikut

Kode
Kode Pengganti
<
&lt;
>
&gt;
"
&quot;
- Udah tahu kan caranya mereplace di notepad? itu lho dengan memilih menu edit --> replace kemudian pada kotak yang muncul masukkan kode yg akan direplace pada kolom "Find what" trus masukkan kode pengantinya pada kolom "Replace with"trus tekan tombol Replace All.
- Nha kalo udah semua baru kamu copy semua kode yang udah direplace all tadi, trus kamu masukkan kedalam postingan kamu.

Cara Ketiga :
- Buka situs ini http://centricle.com/tools/html-entities, trus isikan kode-kode kamu kedalam kotak yang disediakan, nha kalo sudah tekan tombol "Encode", nha maka kamu akan mendapatkan script baru untuk diposting di blog kamu.

Piye? Gampang to? gitu aja kok repot.....

Hal-hal Yang Harus Diperhatikan Dalam Mengganti Template Blogger

3:01:00 PM
Hal-hal Yang Harus Diperhatikan Dalam Mengganti Template Blogger
Blog adalah ibarat rumah kita, dan tentunya kita ingin blog tersebut tampil menjadil lebih cantik dan indah. Banyak cara yang dilakukan untuk membuat blog menjadi lebih cantik, diantaranya dengan menambah pernak pernik dan juga dengan mengganti tampilan/template blog. Jika kita mengganti template dengan template yang sudah disediakan blogger maka itu adalah cara yang paling mudah, tinggal pilih simpan langsung jadi. Namun template yang disediakan sangat sedikit dan tampilannya juga standar, sehingga kita seringkali mencari template lain yang lebih cantik, karena sekarang banyak sekali situs-situs yang menyediakannya dengan gratis. Namun jika kita menganti template dengan template lain yang disediakan oleh selain blogger, maka itu tidaklah semudah sebagaimana dengan menggunakan template yg disediakan blogger, karena ada beberapa efek sampingnya, diantaranya yaitu kamu akan kehilangan element2 kamu ato malah blog kamu jadi rusak. Nha berikut ini akan aku jelaskan hal-hal apa aja yang harus diperhatikan jika kamu pingin ganti template dengan jasa lain.

Pertama kamu harus membackup dulu tempalte kamu jika template baru kamu tidak berhasil diinstall, caranya masuk ke menu "Layout --> Edit HTML", trus klik link bertuliskan "Download Full Template" terus simpan file yang diberikan.

Kedua yaitu membackup elemen-elemen atau widget-widget yang sudah pernah kamu pasang, caranya gini, Masuk ke menu "Page Element", nha disitu kan banyak tuh element-element yang udah kamu pasang trus dibawahnya kan ada link bertiliskan "edit" klik link-link tersebut satu persatu, copy isi dari elemen itu dan taruh dalam notepad. Kalo kamu nanti dah ganti template dan mau memasang elemen-elemen tersebut tinggal copy dari notepad terus pasang di "add page elements".

Ketiga, jika template dan elemen-elemen sudah kamu backup langkah selanjutnya yaitu mengupload template yang sudah kamu download. Biasanya file template yang di download berextenxi "xml" tapi kadang-kadang ada juga yang berekstensi "zip atau rar", kalo begitu kamu harus mengekstraknya dulu sehingga kamu akan mendapat file berekstensi "xml". Trus gini cara ngaploadnya, Kembali ke menu "Edit HTML", trus disitu kan ada tombol "brows" klik tombol tersebut terus cari file template yg pingin kamu pakai sudah kamu download, trus klik tombol :upload".

Keempat, biasanya kamu akan mendapat konfirmasi seperti gambar dibawah ini, itu artinya elemen-elemen kamu akan dihapus. Klik tombol "Confirm & Save"



Kelima, jika ternyata yang muncul adalah seperti gambar dibawah ini maka itu artinya ada yang tidak beres dengan template kamu dan kamu tidak bisa memakai template tersebut di blog kamu, jadi kamu ganti aja dengan template yang lain.



Keenam, coba preview blog baru kamu, merasa sudah cocok ikuti langkah ketuju. Jika kamu mendapati ada gambar header yang sebelumnya kamu pake buat header masih muncul di template baru kamu dan posisinya sepertinya tidak cocok, maka kamu harus menghilangkannya dulu gambar header tersebut, caranya masuk kembali ke menu "Page Element", dibagian header coba kemu edit dan hapus gambar kamu. Jika di bagian header tidak ada link "edit" coba kamu ganti dulu templatenya dengan template yang disediakan oleh blogger dan kembali ke "Page Element" trus "edit dibagian header dan hapus gambar header kamu kemudian ikuti lagi langkah-langkah ketiga

Ketuju, Kembalikan elemen-elemen yang sudah kamu backup tadi sehingga kini kamu memiliki template baru dan elemen-elemen yang dulu tidak ilang.

Kedelapan, Selamat bermumet-mumet :z

Cara Membuat Blog Lebih Expressive

2:59:00 PM
Cara Membuat Blog Lebih Expressive
Hallo sobat tua dan muda dimanapun anda berada, kita jumpa lagi dalam acara Trik dan Tips :D . Dalam episode kali ini kita akan mencoba membahas tentang "Bagaimana Cara Membuat Postingan/Content Blog Agar Lebih Expressive. Maksudnya apaan tuh?
Gini lho, kalo di layanan Blog lain semisal Wordpress, setiap kita mengetikkan tanda ini :) maka yang muncul adalah gambar ini :) , kalo tanda ini :p maka yang muncul gambar ini :p dan lain-lain . Nha kalo gitu kan akan membuat blog kita menjadi lebih expressive tuh. Sayangnya bagi kita yang memakai layanan di Blogger tidak mendapat fasilitas tersebut. Tapi tenang aja bung, dalam Trik dan Tips kali ini kita akan mencoba membahas bagaimana supaya bagi kita yang memakai layanan Blogger bisa seperti yang ada di Wordpress. Langkahnya cukup mudah, gini lho.....

1. Login ke blogger trus pilih Layout -->> Edit HTML
2. Beri tanda centang pada jawaban yang benar, eh, maksudnya pada Expand Widget Templates
3. Cari kode ini ]]></b:skin> (letaknya kira2 di bagian tengah posisi kiri)
4. Masukkan script di bawah ini persis dibawah kode ]]></b:skin>

<script src='http://kendhin.890m.com/smile/smile.js' type='text/javascript'/>

Jangan lupa disimpan, trus coba deh kamu posting dengan memakai kode-kode tersebut, Insya4JJI berhasil. kalo gagal coba lagi, kalo masih gagal ya coba sekali lagi, kalo masih gagal lagi ya mengkin servernya lagi down atau itu emang karena kamu kurang beruntung. :D

Berikut ini adalah beberapa standar kode smile yang bisa digunakan :

:) --> :)
:D --> :D
:$ --> :$
:( --> :(
:p --> :p
;) --> ;)
:k --> :k
:@ --> :@
:# --> :#
:x --> :x
:o --> :o
:L --> :L
:O --> :O
:r --> :r
:y --> :y
:t --> :t
:s --> :s
:~ --> :~
:v --> :v
:f --> :f
:d --> :d
:c --> :c
:z --> :z

Sebelum mengetikkan kodenya, harus di spasi dulu.
untuk sementera itu dulu, icon-smile selanjutnya masih dalam penelitian di laboratorium :D

Membuat Menu Vertikal (Vertical)

2:59:00 PM
14
Sebelumnya kita pernah membahas tentang membuat menu horizontal, nha sekarang mari kita mencoba membuat menu vertikal. Menu vertikal ini cocok kalau dipasang di sidebar karena bentuknya berjajar sevara vertikal (ya iyalah). Contohnya seperti gambar disamping itu. Beginilah cara membuatnya :

1. Login ke blogger trus pilih "Layout-->Edit HTML"
2. Masukkan kode berikut sebelum kode ]]></b:skin> atau sebelum kode </style> . Pokoknya ditaruh di dalam Barisan kode CSS deh.

.glossymenu, .glossymenu li ul{
list-style-type: none;
margin: 0;
padding: 0;
width: 185px; /*WIDTH OF MAIN MENU ITEMS*/
border: 1px solid black;
}
.glossymenu li{
position: relative;
}
.glossymenu li a{
background: white url('http://kendhin.890m.com/blog/vertical/blue1.gif') repeat-x bottom left;
font: bold 12px Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 5px 0;
padding-left: 10px;
text-decoration: none;
}
.glossymenu li ul{
position: absolute;
width: 190px;
left: 0;
top: 0;
display: none;
}
.glossymenu li ul li{
float: left;
}
.glossymenu li ul a{
width: 180px;
}
.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}
.glossymenu li a:hover{
background-image: url('http://kendhin.890m.com/blog/vertical/blue2.gif');
}

* html .glossymenu li { float: left; height: 1%; }
* html .glossymenu li a { height: 1%; }


Untuk memilih warna menu, perhatikan kode2 yang berwarna merah (blue1.gif dan blue2.gif). Ganti kode tersebut dengan pilihan warna dibawah ini. Misal jika kamu ingin memilih menu warna merah maka kodenya menjadi seperti ini :
.glossymenu li a{
background: white url('http://kendhin.890m.com/blog/vertical/red1.gif') repeat-x bottom left;

dan
.glossymenu li a:hover{
background-image: url('http://kendhin.890m.com/blog/vertical/red1.gif');


Pilihan Warna menu vertikal :

blue1.gif
blue2.gif
green1.gif
green2.gif
red1.gif
red2.gif
pink1.gif
pink2.gif
black1.gif
black2.gif


3. Kemudian di save.
4. Lalu pergi ke menu "Page Elements"
5. Pilih "Add a Gadget -->HTML/JavaScript" kemudian masukkan kode berikut kedalamnya:

<ul id="verticalmenu" class="glossymenu">
<li><a href="/">Home</a></li>
<li><a href="http://trik-tips.blogspot.com">Trik Blog</a></li>
<li><a href="http://x-template.blogspot.com" >Free Template</a></li>
<li><a href="http://getebook.co.cc">Free Ebook</a></li>
</li>
</ul>

Kode yang berwarna merah adalah linknya dan yg warna biru adalah teks yang ditampilkan. Kalau mau menambahkan menu tingal buat lagi kode seperti yg berkedip2 dibawahnya.

Dah gitu aja. Gampang kan???? :D

Cara Membuat Read More / Baca Selengkapnya di Blogger

2:56:00 PM
Cara Membuat Read More / Baca Selengkapnya di Blogger
Biasanya postingan terbaru akan ditampilkan dihalaman utama blog. Namun jika postingan kamu terlalu panjang maka hal tersebut akan membuat penuh halaman utama. Jika kamu ingin supaya postingan kamu yang ditampilkan dihalaman utama cuma abstraksinya saja kemudian ada sebuah link Read More / Baca Selengkapnya untuk melihat selengkapnya maka ikutilah langkah-langkah berikut :

1. Buka menu Layout kemudian pilih Edit HTML.
2. Kasih tanda cek (centang) pada cekbox "expand widget template"
3. Cari kode berikut di Template blog kamu (tempatnya kira-kira pada 1/4 bagian bawah kode hmtl) :

<p><data:post.body/></p>

4. Kalau sudah ketemu, Ganti kode kode tersebut sehingga menjadi seperti ini:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

<p><data:post.body/></p>

<a expr:href='data:post.url'>Read More......</a>
</b:if>

Tulisan "Read More....." itu bisa kamu rubah, misalnya jadi "Baca Selengkapnya".

5. Simpan hasil pengeditan.
6. Kemudian pilih menu Setting lalu pilih Formatting
7. Pada kotak Post Template isikan kode berikut:

<span class="fullpost">


</span>


8. Kemudian Simpan.
9. Ketika memposting, kan disana ada 2 tab pilihan tuh, yang "Compose" dan "Edit Html", Nha km pilih Yang "Edit HTML", Maka secara otomatis akan tampak kode seperti berikut :

<span class="fullpost">


</span>


10. Letakkan abstraksi posting atau artikel yang akan ditampilkan dihalama utama (sebelum tulisan "Redmore") diatas kode ini : <span class="fullpost"> sementara sisanya yaitu keseluruhan posting letakkan di antara kode <span class="fullpost"> dan </span>
11. Ini yang paling penting diantara semua proses diatas yaitu ..... Selesai..... he..he..he.. :D
Selamat Mencoba...

Menambahkan Widget SMS Gratis! pada blog anda.

2:40:00 PM
2
         Waduh....... gak bisa d bayangin kalo pcar kita sms trus kita ga punya pulsa !!! ahh, dunia kerasa ancur bgt(lebay model on.. hhe)..... Tapi tenang ajja buat kalian yang ingin tetep sms-an sma pacar ato ke yang laen bisa coba widget ini..
          Langsung aja yha.. widget SMS Gratis! ini di sponsori oleh sms-online.web.id, mereka ngasih sms gratis ke kita sepuasnya, jdi g pke pulsa dong.(ya iyalah namanya juga SMS Gratis!,, hhe)
Cara smsnya pun mudah tinggal kalian klik BUKA SMS trus tulis sms yang kalian inginkan trus masukin nmernya tinggal klik KIRIM.... eitsss tunggu dulu kalian bakal dikasih perntanyaan,, tenanng ajja gmpang kok...

Tampilan widgetnya kayak gnie nieh...




sederhana yah,,,, gpp lah yg penting bsa buat smsan hhe
CARA MEMASANG WIDGET :
    

  • Silakan login ke blogger
  • Pilih tata letak
  • Tambah widget baru
  • Setelah itu pilih
  • Edit HTML/Javascript
  • Copy dan paste-kan kode dibawahini script code nya
gmnpang kan tmen tmen...

Nihh kodenya :

<span style="color: rgb(114, 45, 50);"><span class="Apple-style-span" style="font-family: Verdana,sans-serif;"><i> </i></span></span><span style="color: rgb(255, 0, 0);" class="apple-style-span"><b><i><span style="font-size: 10pt; line-height: 115%;"><div style="margin: 5px 20px 20px;"><input value="BUKA SMS" style="margin: 0px; padding: 0px; width: 90px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP SMS'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA SMS'; }" type="button" /> </div><br /><div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;"><div style="display:none;"><iframe name="I2" src=http://sms-online.web.id/widget width="270" height="350"> not support </iframe> <a href="http://bangunharyadi.blogspot.com/2011/03/menambahkan-widget-sms-gratis-pada-blog.html" target="_blank">Pasang SMS Garatis! Di Blog Kamu Klik Disini</a></div></div></span></i></b></span><span class="fullpost"><code><span class="Apple-style-span" style="font-family: Verdana,sans-serif;"><i></i></span></code></span>
Langganan: Postingan (Atom)