Award Pertama


Yuuhuuuuuu.......Dapat award pertama...... ne Butterfly award aku dapat dari mas Wahyoe. Ok's bangedz, thanx to mas wahyoe..Untuk mendapatkan award ini, ada aturan yang musti, harus dijalani. Ne aturannya :
1. Put the logo on your blog.
2. Add a link to the person who awarded it to you.
3. Link 7 other bloggers whom you wanted to share this award to.
4. Give a reason why you consider that person's blog cool.

So, ne award aku teruskan kepada teman-teman bloger lain:
1. Dunia Bloggertemen untuk saling tukeren info belajar blog
2. Kurneaku blogblog yang ada gambar bunganya, so cocok bgt dpt butterfly award
3. Cabexonlytemen ngeblog, he...he
4. Gratisantemen cari gratisan duit dari internet
5. New Music Update blog tempat cari lagu baru
6. Franciska Dyahtemen blog yang suka pindah-pindah alamat blog, he...he
7. Bawean termenung temen ngeblog dari malay�

 

Memasang Iklan PPC lokal di Blogger

Sudah lama sekale aku ga posting di blog ini. Lagi ML (MaLes). Tapi dengan momen Idul fitri ini semoga menambah semangat untuk tetep ngeblog. Oh iya, aku pengen ngucapin Met Idul Fitri 1429 H, Minal aidin wal faidzin, mohon maaf lahir batin.
Sekarang aku pengen posting bagaimana meletakan Iklan PPC (Pay Per Click) lokal seperti Kliksaya.com, kumpulblogger.com dan lain-lain, apakah ada tutorialnya untuk meletakannya ditengah dan dibawah posting blogspot? Tentu saja ada.
Tutorial ini hanya untuk blogger beta/layout. Dan Langsung saja login ke blogger.com, kemudian �edit layout�, klik �expand widget template�, dan temukan kode berikut ini:

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

Dan gantikan dengan ini:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:left;'>KODE PPC ANDA
</div>
<p><data:post.body/></p>
KODE PPC ANDA
<b:else/>
<p><data:post.body/></p>
</b:if

Ini jika anda memakai PPC Kliksaya.com, kumpulblogger.con, atau PPC (pay per click) apapun maka ganti KODE PPC ANDA dengan kode PPC anda.
Tapi blog saya memakai read more, kalau memasang hack ini tentu akan mempengaruhi read more saya dong! Jangan khawatir lakukan saja 2 langkah berikut ini:
1. Setelah tag berikut: <data:post.body/>
2. Setelah tag itu masukan tag read morenya yaitu ini:
<a expr:href='data:post.url'><b>Read more!</b></a>

3. Begini bentuknya:
<data:post.body/>
<a expr:href='data:post.url'><b>Read more!</b></a>

Jika memakai Read More Keseluruhannya Jadinya akan seperti ini: (Lihat kode warna ungu di bagian bawah)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:left;'>KODE PPC ANDA
</div>
<p><data:post.body/></p>
KODE PPC ANDA
<b:else/>
<p><data:post.body/>
<a expr:href='data:post.url'><b>Read more!</b></a></p></b:if>

Selamat Mencoba!!!!

Sumber: www.abibakarblog.com


 

Menghilangkan Atribut Nofollow di Blogger

Sebenernya aku pengen posting yang unik, tapi setelah sekian lama bergelut dengan cedera dan proses pencarian ide yang lama belum menemukan yang cocok. Sehingga aku putuskan untuk posting yang berkaitan dengan SEO.
Apa arti nofollow bisa kalian bisa kalian lihat disini... Jika komentar pada blog kita dofollow secara tidak langsung kita akan memberikan backlink pada orang yang komentar ato sering disebut "You comment I follow" alias dengan bahasa lain kita memberikan tanda cinta buat temen yang komentar diblog kita. Terus bagaimana caranya menghilangkan nofollow ini? Aku dapat hack ini dari sini, tapi dalam bahasa inggris. Untuk itu aku posting dikit dalam bahasa indonesia.

Ok's, caranya adalah sebagai berikut:
1. Pertama tentu saja login di akun bloggermu.
2. Pilih edit HTML di blogger dashboard.
3. Centang Expand Widget Template
4. Find this code below:

<a expr:href='data:comment.authorUrl' rel='nofollow'><data

Kamu bisa mencarinya dengan menekan CTRL+F trus paste kode tersebut dikotak pencarian.
5. Hilangkan bagian rel='nofollow' sehingga kodenya menjadi seperti dibawah ini

<a expr:href='data:comment.authorUrl' ><data:comment.author

6. Simpan template trus refresh. Ok, selesai.

Ingin menghilangkan nofollow backlinmu juga?
1. Lakukan langkah 1-3
2. Cari kode dibawah ini

<a expr:href='data:backlink.url' rel='nofollow'><data:backlink

3. Hapus kode rel='nofollow' kode jadi seperti ini

<a expr:href='data:backlink.url' ><data:backlink

4. Simpan template trus refresh.

Mudah kan bro n sis? Semoga berhasil!!!


 

Buat Side Menu

Pada postingan kali ini aku akan mengetengahkan (emang nyamping) bagaimana membuat Side Menu. Kebanyakan menu berada di atas, tetapi ini berada di samping. Selain itu menu ini akan keluar secara slide jika kamu menunjuk menu ini dan akan melayang walo kamu men-scroll down halaman blog. Hal ini akan mempermudah pengunjung dan pembaca blogmu untuk melihat menu tanpa harus kembali ke atas. Contoh bisa kamu lihat dan check di samping kiri blog ini!
Jika kamu tertarik untuk membuatnya, silakan ikuti jejak di bawah ini:

Jejak 1
Download file menu.zip ini, di mana terdapat 2 file .js yaitu ssm.js dan ssmItems.js

Jejak 2
Buka file "ssmItems.js
" dengan text editor (misal dengan notepad) untuk mengedit style menu dan linkmu

Jejak 3
Upload kedua file .js (ssm.js dan ssmItems.js yang telah kamu edit) tersebut ke webpage directory (misal googlepages)

Jejak 4
Login ke blogger > lay out > edit html > [v] expand widget

Jejak 5
Masukkan kode di bawah <head>

<style type="text/css">
<!--
A.ssmItems:link {color:
black;text-decoration:none;}
A.ssmItems:hover {color:black;text-decoration:none;}
A.ssmItems:active {color:black;text-decoration:none;}
A.ssmItems:visited {color:black;text-decoration:none;}
//-->
</style>

<SCRIPT SRC="
ssm.js" language="JavaScript1.2">

//Dynamic-FX slide in menu v6.5 (By maXimus, http://maximus.ravecore.com/)
//Updated July 8th, 03' for doctype bug
//For full source, and 100's more DHTML scripts, visit http://www.dynamicdrive.com

</SCRIPT>

<SCRIPT SRC="
ssmItems.js" language="JavaScript1.2"></SCRIPT>

Jejak 6
Ok, itu saja. Mudah kan?

Keterangan:
Kamu bisa mengubah warna sesukamu dengan mengganti tulisan "black".
Ganti warna biru dengan alamat ssm.js dan
ssmItems.js yang telah kamu upload. OK, simpan deh template.
 

Kotak Komentar dari IntenseDebate

Ada beberapa blogger yang ga bisa pasang kotak komentar dari blogger yang baru. Seperti i punya blog ini. Blog ini ga bisa di pasangin kotak komentar apapun baik dari standar blogger, kotak komentar blogger yang baru, dari haloscan dan modifikasi jackbook setelah ganti template. Hal ini mungkin dipengaruhi oleh templatenya. Aku dah minta bantuan juga dengan bos Kendhin tapi hasilnya masih nihil. Sebenere aku dah pasang kotak komentar dari intense debate sebelumnya tapi saya ganti dengan haloscan.
Bagi yang mengalami hal yang sama denganku dan juga malas ganti template karena merasa template yang digunakan sekarang disukai dan bagus kamu bisa pasang aplikasi dari Intensedebate. Ok, yang mau pasang silakan ikuti langkah-langkah berikut ini :

1. Pertama-tama buka situs IntenseDebate.
2. Klik link "Sign Up" di pojok kanan atas.
3. Isi semua kolom yang disediakan dengan data Anda. Klik tombol "Create Account".
4. Selanjutnya Anda akan dibawa ke halaman "Users" atau "Profile".
5. Cari link "Add Intense Debate to a Blog" atau tombol "Put Intense Debate on Your Blog�di bagian pojok kanan atas. Klik.
6. Di halaman baru Anda akan diminta memasukkan alamat blog. Isi dengan benar dan klik tombol "Get Intense Debate".
7. Ada 4 pilihan yang akan ditampilkan IntenseDebate, yakni untuk Blogger, TypePad, WordPress atau dalam bentuk javascript snippet. Karena saya membahas Blogger, maka klik tombol berlogo Blogger.
8. Saatnya memasukkan IntenseDebate ke dalam blog. Pilihan yang diberikan ada 2, yakni berupa widget atau template. Opsi widget jauh lebih simpel dan cepat, tapi terkadang tidak dapat bekerja dengan baik di blog yang terlalu banyak kustomisasi di blog, misal banya pasang page element. Lebih baik kita pilih opsi template saja. Untuk itu Anda harus masuk ke account blogger kamu dan mendownload template blog Anda lalu menyimpannya di komputer. Bagian yang ini dah bisa kan? Klo bisa tapi lupa ok dijelasin. Setelah login blogger,pilih lay out > edit html > download tempate lengkap.
9. Setelah template blog disimpan, upload ke IntenseDebate. Lalu atur apakah kolom komentar IntenseDebate akan muncul di semua posting atau hanya di posting yang belum mempunyai komentar. Pilihan terserah Anda, tapi pilihan kedua dapat menghilangkan/menutupi semua komentar yang pernah ada di blog Anda.
10. Klik tombol "Upload and Continue" di bagian paling bawah.
11. Selanjutnya yang perlu Anda lakukan hanyalah mengganti template blog Anda dengan template baru hasil kreasi IntenseDebate. Caranya dengan melakukannya sendiri dengan mengkopi paste kode HTML yang telah dimodifikasi Intensedebate atau biarkan Intensedebate yang melakukannya dengan menekan tombol instal (klo ga salah). Tapi lebih baik dilakukan sendiri mumpung buka blogger. Kamu tinggal copi paste kode yang telah dimodif ke edit template, tapi ingat Expand template widget
JANGAN dicentang.
12. Tekan "simpan template".
13. Selese dech. Lihat kotak komentarmu yang baru. Jangan khawatir, IntenseDebate hanya menambahkan kotak komentarnya saja, so pengaturan dan page element yang kamu buat sebelumnya tidak akan hilang.

Tapi namanya fasilitas dari pihak ketiga, tentu saja ada kelemahannya. Antara lain, klo ada yang komentar di blogmu tidak akan tersimpan di database blog karena yang menyimpan IntenseDebate. Program IntenseDebate memang sejatinya menutup fasilitas komentar asli Blogger, jadi semua komentar yang dibuat pengunjung masuknya ke account IntenseDebate.
Ada informasi yang mengatakan bahwa menambah aplikasi ini akan mempengaruhi SEO dan dikhawatirkan akan melanggar ToS Blogger. Semuanya terserah kamu ya?
 

Ubah atau hapus jumlah label

Label pada blogger biasanya menampilkan jumlah dari banyaknya posting dalam satu kategori, tanda ini biasanya ditandai dengan tanda kurung ( ). Contoh bisa kamu lihat di samping di mana jumlahnya sudah saya hapus. Jika anda ingin mencoba mengubah atau menghapus angka dalam label (Label Count) ikuti caranya dibawah ini:

1. Masuk pada menu Edit HTML
2. Jangan lupa beri tanda centang pada Expand Template Widget
3. Kemudian cari kode seperti dibawah ini

(<data:label.count/>)

4.Silahkan anda ganti tanda ( ).
Misalnya saja seperti contoh di bawah ini:

[<data:label.count/>]

{<data:label.count/>}

5. Jika kamu tidak ingin menampilkan jumlah postingan maka tinggal hapus aja kode tersebut.
6. Ok's, tinggal kamu simpan de....

 

Free Traffic

Sebuah blog/web tak akan berarti tanpa trafik, ya nggak? Apalagi yang pengen cari uang dengan cara ngeblog. Ada banyak cara untuk meningkatkan trafik, bisa dengan berpromosi melalui iklan link exchange dan blogwalking. Tetapi ada cara yang lain untuk meningkatkan trafik blogmu di mana hal ini bukanlah sistem MLM, referral, bukan trafik exchange, no toolbar, no email, no credits, nomembership,absolutely FREE alias GRATIS.

Yaitu dengan bantuan pihak ketiga ato ke berapalah yang biasa disebut software. Karena ini gratis maka sering disebut freeware. Dan yang pasti ini gratis. Klo ada yang gratis tak bisa dipungkiri kalian pasti mau kan? he...he...
Kalian bisa download software dan tuturialnya di sini atau klo ga bisa lewat sini saja.
Inga', di file download yang berbentuk rar ini udah ada Tutorialnya, so kalian bisa ikuti caranya setelah download.
 

Pasang Random Banner

Tadi pagi berkunjung ke beberapa blog dan nemuin sesuatu yang menarik di blognya o-om. Yaitu bagaimana memasang random banner di mana beberapa banner akan bergantian muncul jika ada pengunjung yang melakukan reload atau refrezzz. Hal ini bertujuan untuk memanajemen beberapa iklan (dalam hal ini banner yang berupa gambar) dalam satu area. Contoh bisa kalian lihat di sini.
Ok, bagi yang tertarik bisa ikutan buat. Langsung aja ya ke bagian add page element > html/javascript. Kemudian taruh code dibawah.

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var jumlah_iklan = 3;
var waktu_sekarang = new Date()
var detik = waktu_sekarang.getSeconds()
var pasang_iklan = detik % jumlah_iklan;
pasang_iklan +=1;
if (pasang_iklan==1) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";
}
if (pasang_iklan==2) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";

}
if (pasang_iklan==3) {
txt="Tulis Title";
url="Alamat URL";
alt="Alamat URL";
banner="Alamat URL Gambar";
width="468";
height="60";

}
document.write('<center>');
document.write('<a href=\"' + url + '\" target=\"_top\">');
document.write('<img src=\"' + banner + '\" width=')
document.write(width + ' height=' + height + ' ');
document.write('alt=\"' + alt + '\" border=0><br>');
document.write('<small>' + txt + '</small></a>');
document.write('</center>');
// End -->
</SCRIPT>


Tulis tittle sesuai keinginan, alamat URL diisi alamat web/blog, banner diisi dengan alamat url gambar kalian. Kalo ukuran banner biasanya ya segitu.
Ok? Selamat berjuang.

Sumber : www.o-om.com
 

Membuat Link To Me

Jika kamu pengen buat kolom untuk tukeran link tapi yang beda, yang bisa pasang link langsung di blog yang mau pasang linkmu (khusus blogspot.com ya) maka kamu harus coba yang satu ini. Contoh bisa kamu lihat di bawah ini. Dengan mengklik link to me maka ostosmastis, eh otomatis linkmu terpasang di blog pemasang linkmu.

This button image will display on your site :





Caranya seperti biasa login dulu di blogger > lay out > add page element > html/javascript. Terus kopi paste kode berikut ini.


<form action="http://beta.blogger.com/add-widget" method="post"><input value="FAVOURITE" name="widget.title" type="hidden"/><textarea style="display: none;" name="widget.content"><a href="http://tipsblogging.co.cc"><img alt="Tips dan Trik Blogging" src="http://anggaardian.googlepages.com/blogtips.gif"/></a></textarea><input value="http://buzz.blogger.com" name="infoUrl" type="hidden"/><input value="http://www.blogger.com/img/icon_logo32.gif" name="logoUrl" type="hidden"/><input value="LINK TO ME" name="go" type="submit"/></form><p>This button image will display on your site :</p>

<img src="http://anggaardian.googlepages.com/blogtips.gif"/>
</div>

Keterangan :
warna biru kamu ganti dengan alamat blogmu.
warna ungu ganti dengan judul blogmu.
warna hijau ganti dengan alamat gambarmu.
warna hitam bisa kamu ganti ato tidak terserah kamu.

Ok, selamat mencoba.

Sumber : http://www.bella-cell.blogspot.com/






 

PASANG RECENT POSTS RECENT COMMENTS

Sebenere aku pengen banget masang "Recent Posts" dan "Recent Comments" dalam satu paket. Tapi setelah tak pikir-pikir pasang yang "Recent Posts" aja karena blogku masih jarang dikomentari, he..he.. Tapi bagi kalian yang pengen pasang keduanya silakan saja.
Sejatinya setiap pengunjung tidak selalu ingin membaca artikel kita. Mereka yang menemukan artikel kita melalui browsing sangat mungkin ingin mendapatkan bacaan lengkap yang sesuai dengan kebutuhan mereka. Maka untuk mereka yang seperti ini, artikel kita mungkin akan dibaca dan klo mungkin lagi akan dikomentari.

Kok dikomentari? Eh jangan salah, komentar itu penting lho, misal klo ada yang ngritik bisa kita gunakan sebagai cambuk untuk berbuat sesuatu yang lebih baik lagi. Ya to? Tapi jika yang berkunjung ke blog kita hanya mungkin sekedar untuk meningkatkan traffic, mungkin mereka tidak membaca seluruh artikel kita. Mereka hanya lihat-lihat judul postingan kita. Jika kita menyediakan elemen daftar judul postingan kita yang terbaru, mereka bisa langsung melihatnya. Dan kalau tertarik baru mereka akan baca artikel kita. Disinilah fungsi elemen "Recent Posts".
Sedangkan elemen "Recent Comments" memudahkan bagi kita untuk mengetahui apakah ada komentar terbaru dan anda tidak harus melihat satu per satu postingan, karena pengunjung bisa saja mengomentari banyak postingan. Blog yang tidak sigap dalam merespon komentar para pengunjungnya, maka jangan heran jika sang pengunjung tidak akan balik lagi. Ya seperti blog saya ini. Gimana mo balik, wong komentar saja enggak....he...he....
Nah jika anda tertarik untuk memasangnya baik keduanya ato salah satu saja, silahkan copy code dibawah ini, tapi jangan lupa baca keterangan dulu. Lantas tambahkan pada elemen blog anda. Sudah tahu caranya kan. Bagi yang belum, nih caranya.
1. Silahkan login ke blogger. Kemudian klik Layout.
2. Kemudian klik "add page element" di sidebar.
3. Pilih "html/java script". Nah kemudian pastekan kode dibawah ini.
4. Simpan perubahan. Selesai.

<h3> Recent Posts</h3>

<script src="http://www.geocities.com/uddin_81/recent-post.js"></script>

<script>var numposts = 5; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>

<script src="http://tipsblogging.co.cc/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">

</script>

<h3> Recent Comments </h3>

<script style="text/javascript" src="http://amen24.googlepages.com/showrecentcomments.js"></script><script style="text/javascript">var numcomments = 5;var showcommentdate = false;var showposttitle = true;var numchars = 50;var standardstyling = true;</script><script src="http://tipsblogging.co.cc/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Keterangan :
1. Silahkan ganti alamat url yang berwarna biru diatas dengan alamat url blog anda
2. Silahkan ganti angka warna biru diatas dengan jumlah post/komentar yang ingin ditampilkan
3. Showcommentdate dan showpostdate untuk menampilkan tanggal. Jika "false" tidak ditampilkan, "true" ditampilkan. Pilih sesuka anda. Juga untuk shoepostsummary, showposttitle dan standarstyling.
4. Var numchars untuk menentukan jumlah huruf/karakter yang ditampilkan
5. Anda bisa memasang keduanya secara langsung maupun sendiri. Up to you!!
Selamat mencoba !
 

Banner Statistik blog

Blogmu belum punya banner statistik? Ato sudah punya tapi pengen banner statistik yang cakep dan keren bin lengkap? Dengan status mbah Google Pagerank, alexa rank, berapa jumlah blog/web yang nge-link ke blogmu? Klo pengen masang yang seperti itu, kalian harus coba dari popuri.us yang ini......!!!!! Contoh seperti pada banner statsitik blogku disamping. Gimana, keren ga? Klo kamu bilang keren, coba kamu pasang di blogmu!

Caranya? Ikuti langkah saya!!!

Pertama buka blogger, pilih layout, tekan add page element, pilih javascript/html.
Langkah kedua CoPas kode bawah ini di content.

<a href="http://popuri.us"><img alt="My Popularity (by popuri.us)" src="http://popuri.us/widgets/?type=light"/></a>

Terdapat 2 warna yang menarik, silver (light) dan Black. Jika pengen yang warna hitam ganti Light dengan Black.

Tekan simpan perubahan.
Langkah ketiga tekan simpan.
Langkah keempat makan, maksudnya sudah slese jadi trus makan dech.....
 

Read More Yahoo! Style

Blog anda sudah mengaplikasi Read More dan anda ingin membuat variasinya? Read more Yahoo! style ini mengacu pada tulisan "read more"-nya ala Yahoo. - yang posisinya di samping kanan. Variasi ini kelihatannya belum banyak yang mengaplikasikan. Anda mau mencoba? Ok, ikuti langkah-langkahnya ya?!

1. Memasukan kode
Login ke blogger, pilih layout, buka halaman Edit Html kemudian centang tulisan Expand Template Widget.
Setelah itu taruh kode ini di bawah ]]></b:skin>

.more {
bottom:5px;
font-family:verdana;
font-size:80%;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
line-height:normal;
padding-right:10px;
text-align:right;
white-space:nowrap;
}

2. Memasukan tag <p class='more'>..</p> pada elemen Html.

Cari tulisan "Read More" atau �Selengkapnya� atawa �Baca Selengkapnya�! Kamu bisa gunakan kotak pencarian browser ( Ctrl + F ).
Can you find it? Good�

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

Tambahkan tag <p class='more'>&#187; ..</p> seperti tulisan di bawah.

<a expr:href='data:post.url'> <p class='more'>&#187; Read More.... </p></a>

Silahkan berimprovisasi sendiri pada tulisan " Read More " misalkan diganti dengan �Baca Selanjutnya", �Seterusnya�, �teruskan bacanya ya?!�� dll. Up to you dech!!!
Ok beres. Simpan Perubahan.

3. Menambah Gambar.

Anda pun bisa menambahkan dengan gambar.

Tambahkan saja properti Background:url (alamat gambarmu) no-repeat right; di bawah kode more {

.more {
background:none;url(http://i120.photobucket.com/albums/o190/jaloewig/blogger/reedmore-bg.gif) no-repeat right;
bottom:5px;
font-family:verdana;
font-size:80%;

Penjelasan.
.more {
bottom:5px;
font-family:verdana;
font-size:80%; = ukuran teks bisa juga pake satuan pixel misal 10px.
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold; = ukuran tebal teks lawannya Normal
line-height:normal;
padding-right:10px;
text-align:right; = posisi teks di samping kanan lawanya left or center
white-space:nowrap;
}
Hoi bro, coba donk. Jangan Cuma baca and duduk-duduk�..

 

Icon baru untuk status Yahoo! Messenger

Yang Baru untuk status yahoo! Messengermu. Untuk menampilkan icon status online yahoo ! messenger, sekarang kita bisa memilih banyak pilihan icon statusnya..Tercatat sebanyak 15 pilihan baru yang lebih keren,catchy dan atraktif. Yakni style id 0 sampe id 1 4. Apa perbedaan dari style id baru ini? Perbedaannya adalah ukuran dari icon dan tampilan gambar yang berbeda beda , untuk melihat perbedaan style id, silahkan sobat perhatikan gambar berikut; dan bisa pilih salah satu.

















<a href="ymsgr:sendIM?YaMesmu"> <img src="http://opi.yahoo.com/online?u=YaMesmu&m=g&t=14&l=us"/></a>

YaMesmu = diganti dengan account yahoo messenger mu
14 = Ganti dengan nomor pilahanmu. Pilih angka dari 0-14

Sumber : www.tanpatinta.blogspot.com

 

Membuat Read More versi 2

Artikel ini saya dapat dari Mas Kendhin.
Lho? maksudnya apa? gini lho kalo read more yang lama, yang sudah pernah dibahas kita bahas dulu (udah baca belum?, kalo belum baca dulu gih), kan kalo kita ng-klik tulisan read more atau Baca Selengkapnya itu kita akan membuka halaman baru sehingga akan meloading lagi halaman web kita, ya tho?. Nha Read more yang ini, yang akan kita bahas ini nggak gitu cara kerjanya, cara kerjanya yaitu berangkat jam 08.00 pagi pulang jam 16.00 WIB (emangnya PNS) Gini lho cara kerjanya :
Di trik Read more yang baru ini, kita akan membuat link Read more yang jika kita meng-klik link tersebut, maka keseluruhan artikel akan terpampang dibawahnya, jadi tidak perlu meload ke halaman yang lain. Piye? uenak tho? bagi yang sudah kebelet ingin menyimak trik ini silahkan langsung ikuti trik berikut ini (langsung loncat dua baris ke bawah). Dan bagi yang kebelet mo pipis silahkan ke kamar mandi dulu, he...he..

Berikut ini langkah-langkahnya:

1. Login ke Blogger
2. Pilih Setting --> Template --> Edit HTML
3. Kamu mau memback-up template kamu dulu nggak?, kalo iya kilik tulisan Download Template lalu simpan.
4. Beri tanda centang pada kotak yang bertuliskan Expand Template Widget
5. Kopi kode berikut ini dan taruh tepat diatas kode </head>

<script src='http://www.geocities.com/kendhin_x/blog/Readmore.js'
type='text/javascript'/>

6. Sudah? sudah belum? ditanya kok diam aja gimana sih ?
7. Kalo sudah cari kode dibawah ini

<div class='post-header-line-1'/>

8. Nha dibawahnya kan ada kode gini <div class='post-body entry-content'> Nha ganti kode tersebut menjadi seperti ini:

<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>

9.Terus dibawahnya kan kan ada kode gini <p><data:post.body/></p>
10. Tembahkan kode ini dibawahnya.

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

11. jadi seluruh kodenya akan menjadi seperti ini :

<div class='post-header-line-1'/>
<div class='post-body entry-content' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Selengkapnya...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>[+/-] Ringkasan...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>

12. Tulisan 'Selengkapnya' dan 'Ringkasan' bisa diganti dengan apa aja kata yang kamu suka.
13. Lalu simpan template.
14. Pilih menu Setting -->> Formatting
15. Di bagian bawah ada kotak yang disampingnya ada tulisan "Post Template", dan isikan kode dibawah ini ke dalamnya lalu simpan setting.

<span id="fullpost">


</span

Ohya, kalo memposting pilih yang "Edit Html", letakkan abstraksi posting yg akan ditampilkan di halaman muka di atas kode <span id="fullpost"> sementara sisanya letakkan di antara kode <span id="fullpost"> dan </span
Trus bagaimana bagi yang sudah pakai 'read more' yang lama dan pingin ganti dengan 'read more' yang baru ini?
gini caranya:

'Read more' yang lama kan kodenya seperti ini :

<div class='post-header-line-1'/>
<div class='post-body entry-conten'>
<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>

hapus text yang berwarna biru, lalu ikuti langkah-langkah diatas.
oh ya jangan lupa ikuti langkah berikut ini
1. Pilih menu Setting -->> Formatting
2. Di bagian bawah ada kotak yang disampingnya ada tulisan "Post Template", dan isikan kode dibawah ini ke dalamnya lalu simpan setting.

<span id="fullpost">


</span

bedanya apa sama read more yang dulu? perhatikan text yang berwarna merah, kalo dulu kan tulisannya "class" sekarang ganti menjadi "id".

Gimana? Sudah bisa belum?
Pinter.... anak siapa siiihhh??? duh lutunya
Sumber: Kendhin (www.trik-tips.blogspot.com)


 

Membuat Read More/ Baca Selengkapnya

Sering saat kita memposting artikel baru, maka postingan tersebut akan ditampilkan di halaman utama blog. Namun jika postingan kamu terlalu panjang maka hal tersebut akan memenuhi halaman utama yang notabenenya akan membuat blog kamu terlihat sangat panjang. Jika ingin supaya postingan kamu yang ditampilkan di halaman utama cuma abstraksinya atau sebagian yang biasanya adalah bagian atas saja (satu ato dua paragraf)kemudian di bawahnya ada sebuah link Read More / Baca Selengkapnya untuk melihat keseluruhan posting maka kamu perlu cara ini dengan mengikuti langkah-langkah berikut :

1. Buka menu Template 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) :

<div class='post-body entry-content'>

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

Kamu bisa mencarinya dengan menekan control+F pada keyboard trus masukkan kode diatas.

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

<div class='post-body entry-content'>

<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 ubah semaumu, misalnya jadi �Selengkapnya� atau "Baca Selengkapnya".

5. Tekan simpan template.
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 artikel baru, pilih EDIT HTML. Maka secara ostosmastis alaah.....otomatis akan tampak kode di atas.
10. Letakkan abstraksi posting atau artikel yang ingin kamu di halamam utama (sebelum tulisan "Readmore") diatas kode ini :<span class="fullpost"> sementara sisanya yaitu keseluruhan posting letakkan di antara kode <span class="fullpost"> dan </span>
 

Form Email Subscriber / Berlangganan Lewat Email

Form ini berfungsi untuk mempermudah para pembaca blog kita agar bisa berlangganan atau mendapatkan info terbaru posting kita melalui alamat email mereka. Jadi setiap kita memposting artikel baru maka para pelanggan/pembaca yang sudah memasukkan email mereka melalui form tersebut akan secara otomatis mendapatkan kiriman email yang berisi postingan terbaru kita. Dengan begitu para pelanggan tidak perlu susah-susah untuk membaca artikel lewat blog dan tidak perlu setiap hari mengecek apakah blog kita sudah ada artikel yang baru atau belum. Hal seperti ini mempermudah pelanggan membaca artikel baru, lha wong tinggal buka email mereka doank kok!

Begini cara membuat form "Email Subscriber" tersebut :

  1. Kunjungi situs ini : http://www.feedburner.com
  2. Saat pertama kali datang kamu akan langsung disodori kotak untuk mengisikan alamat feed blogmu yang akan diburn.
  3. Biasanya alamat feed blog kamu seperti ini http://NAMABLOGMU.blogspot.com/feeds/posts/default , ganti tulisan NAMABLOGMU dengan nama alamat blogmu.
  4. Isikan nama feed blogmu tadi dalam kotak yang disodorkan tersebut, jika blogmu itu isinya hanya video2 maka beri tanda centang pada kotak "I am a podcaster", jika tidak ya gak usah dicentang. Kemudian klik tombol "next"
  5. Setelah itu kamu akan disodori form pendaftaran, isikan data yang perlu diisikan disana, trus klik tombol "Activate Feed"
  6. Kalo berhasil nanti akan ada informasi "Congrats! your ......".
  7. Dibawahnya akan ada tombol "Next" dan link "Skip directly to feed management" kali ini pilih yang link "Skip directly to feed management", sebenarnya lewat tombol "next" bisa sih.
  8. Kemudian nanti akan ada beberapa menu, kali ini pilih menu "Publicize"
  9. Setelah itu disebelah kiri akan muncul beberapa menu. PIlih menu "Email Subscriptions".
  10. Kemudian klik tombol "Activate"
  11. Nha setelah itu nanti akan ada beberapa kotak yang berisi kode2. Nha kalo km pinginnya yang berbentuk form maka pilih kode yang ada di kotak "Subsciption Form Code".
  12. Copy kode yang ada dalam kotak tadi, trus klik tombol "Save" untuk mengaktifkan layanan tersebut.
  13. Cara pasangnya, Login ke blogger, pilih http://www.feedburner.com> nha paste deh kode yang sudah kamu copy di situ.

 

Menampilkan Status Yahoo Messenger Kita

Dalam trik ini kita akan mencoba cara untuk menampilkan status Offline/Online Yahoo Messenger. Hal ini berfungsi untuk mengetahui klo kamu online atau offline. Tapi bagi yang belum punya Account Yahoo ya buat dulu lah, tapi aku yakin klo kalian pasti dah pada punya. Dengan tanda seperti itu kan nanti pengunjung blogmu akan bisa langsung berinteraksi langsung denganmu, dengan begitu kan nanti para penggemar setia dan pengunjung blogmu jadi tambah sayang kamu. Tak kenal maka tak sayang, he..he..
Contohnya seperti ini, jika status kamu offline maka gambarnya akan seperti ini :



Jika kamu sedang online, maka gambar akan berganti seperti ini




Cara buatnya sangat gampang kamu tinggal copy script berikut ini trus kamu pasang di sidebar kam
u, udah tahu kan cara pasanganya, itu lho seperti kalo km masang "page element", Masuk ke "Page Element" trus "Add page elements --> HTML/Javascript".

<a href="ymsgr:sendIM?YaMesmu"> <img src="http://opi.yahoo.com/online?u=YaMesmu&amp;m=g&amp;t=2&amp;l=us"/>
</a>


Ganti text yang warna merah (Yamesmu) dengan id YM kamu. Misal, YaMesku street_spirit_11, ya isi dengan itu. Terus perhatikan angka "2", itu bisa kamu ganti dengan angka yang lain dan hasilnya gambar yang ditampilkan akan berbeda-beda.

Gimana bro, sip kan? Siiiip........
Oke deh, klo gitu kita bersulang dulu





 

Kotak Blogroll Model Marquee

Kalo kamu hanya punya tempat yang kecil alias sempit atawa cuilik buat menamung banyak link temen kamu maka kotak ini bisa menjadi solusinya. Karena kotak yang bernama �marquee� ini mampu menampung banyak link dalam tempat yang sempit. Kotak blog roll ini tidak memiliki rollbar. Itu lho�..yg biasanya disebelah kanan trus bisa ditarik ulur sampe mulur ke atas dan ke bawah. Link-link ato isi didalam kotak ini akan bergerak/berjalan, bisa vertikal ato horizontal. Nah gini nih cara buatnya:
Pasang code berikut ini di kedalam element kamu (Page Element --> Add Page Element --> HTML /Javascript)

<MARQUEE align="center" direction="up" height="200" scrollamount= "2"

onmouseover='this.stop()' onmouseout='this.start()' width="95%" >

#link1 <br />
#link2 <br />
#link3 <br />
#link...<br />

</marquee>

Gimana sampe sini donk to? Klo donk, tarik maaaaaaaaaaaaang��
Keterangan :
- Kode "up" itu menunjukan arah pergerakan, kamu bisa menggantinya dengan down, left, right sesuai dengan keinginan mu.
- Jika kamu memilih untuk bergerak horizontal (left ato right) maka hilangkan kode.
- Angka "200" menunjukkan tinggi dari kotak blogroll kamu. Semakin banyak angkanya maka semakin tinggi pula ukuran blogroll.

Dah jadi, sekarang liat blogmu�.. Gimana? Ok kan? Asyek��..





 

Kotak Blogroll Model Textarea

Langsung aja ya? Nha begini cara membuatnya :
Pasang code berikut ini di kedalam element kamu (Page Element --> Add Page Element --> HTML /Javascript)

<div style="border: 1px solid rgb(153, 153, 153);
overflow: auto;
width: 200px;
height: 200px;
text-align: center; ">

#link1 <br />
#link2 <br />
#link3 <br />
#link seterusnya...... <br />

</div>


keterangan:
- Kode width: 200px; dan height: 200px; adalah ukuran lebar dan panjang kotak, kamu bisa merubahnya dan menyesuaikanya dengan ukuran yg kamu suka.
- Ganti tulisan "#link1,#link2, #link3 dst" dengan daftar link-link kamu, oh ya itu juga bisa diisi dengan banner link.
- Jika kamu pingin daftar link-linknya berjajar, maka hilangkan kode <br />


 

Nulis Script di Blog

Biasanya nulis script di blog hasilnya justru adalah bahasa atau aslinya, bukan scriptnya. Sebenarnya ada beberapa cara untuk menaruh script di blog, tapi itu yang bisa bahasa program. Klo seperti aku ini yang ga bisa bahasa pemograman, cari cara yang paling mudah.

Berikut cara yang paling mudah.
Buka situs ini
http://centricle.com/tools/html-entities, trus isikan kode-kode (script) kamu ke dalam kotak yang disediakan, bisa dengan copy pasta eh paste. Nah kalo sudah, tekan tombol "Encode", maka kamu akan mendapatkan script baru untuk diposting di blog kamu.
Setelah itu, copy paste deh script baru itu ke blog kamu, bisa lewat compose atau edit html di postingan kamu.
Gampang bangets to????
So ikutin aja cara ini, klo yang ga mo repot!!!!






 

X-Change Link

Kamu belum bisa masang banner link exchange? Apa itu banner link exchange? Kalo kita mau tukeran link biasanya ada kotak seperti ini :



Lha itu banner exchange link.
Nha trus gimana cara buat kotak tersebut?
begini, kita duduk sambil ngeteh dulu. Dah pesen es teh belum,pesen dulu gih!!
pertama Login ke blogger trus pilih Setting --> Template
trus klik Add Page Element lalup pilih HTML/Java Script
trus kopi kode berikut ini di tempat yang disediakan.


<textarea name="textarea" cols="20"><a href="http://tipsdantrikblogging.blogspot.com"><img src="http://anggaardian.googlepages.com/tip-trik.gif" width="90" height="17" border="0" /></a></textarea>

Angka 20 menunjukkan lebar kotak, kamu bisa mengaturnya sesuai dengan blogmu. Tipsdantrikblogging adalah link, ganti text tersebut dengan alamat blogmu,
sedangkan text anggaardian.googlepages.com/tip-trik.gif adalah alamat gambar beserta ukurannya, ganti text tsb dengan alamat gambar kamu.
terus simpan templatenya.

Hasilnya akan seperti kotak diatas, trus gambarnya mana?, gini didalam kotak tersebut kan ada textnya tuh, nha kalo textnya itu dicopy terus di paste di blog, maka hasilnya akan menjadi gambar dan juga ada linknya. Kisi kotak diatas kalo dicopy dan paste jadinya akan seperti ini:



Untuk membuat gambar sederhana diatas (chiklet), u bisa baca postingan i sebelumnya, OK'S?
Gampil mboten? Just that easy......



 

Membuat Chicklet link

Membuat badge/chicklet itu mudah, bagi yg agak males otak-atik photoshop atau software-software lain yang dapat untuk membuat sebuah banner tidak usah khawatir. Di internet banyak penyedia program pembuat chicklet dan banner online secara gratis dan instan. Sebagai pembuka, logo atau chicklet adalah banner kecil yg biasa buat link-button seperti yg di sidebar blog saya. Ikuti panduan buat logo/chicklet/banner berikut:

A. Cara Membuat Chicklet



  1. Kunjungi http://button.blogflux.com/

  2. Di LEFT-BLOCK (bagian kiri atas) ada menu �Text�, ganti tulisan �w3c� sesuai dengan yang Anda inginkan. Contoh, tips-trik;

  3. Di RIGHT-BLOCK (bagian kanan atas) ada menu �Text�, ganti tulisan dg yg sesuai dg keinginan Anda, contoh, Tutorial

  4. Di GENERATE-BUTTON (bagian kanan bawah) klik tulisan Generate Button. Maka akan muncul chicklet

  5. Nah, arahkan mouse ke gambar, klik kanan �> save picture as �> kasih nama file (contoh: tp-trik�> 1. save picture as �> kasih nama file (contoh: tip-trik�> save di komputer Anda).

  6. Setelah di save di komputer, masukkan / upload gambar chicklet tsb di situs online seperti googlepages.com. Dalam kasus ini, gambar disimpan di http://anggaardian.googlepages.com/ jadi alamat chicklet gambar tsb. adalah http://anggaardian.googlepages.com/%20trik_blogging.gif

  7. Note: Apabila belum daftar di googlepages.com, Anda tinggal kunjungi alamat URL "googlepages.com" dan login dengan account gmail Anda.

  8. Setelah tersimpan secara online, Anda bisa gunakan sesuai kebutuhan Anda seperti untuk linkbutton tukar link dengan teman-teman blogger lain, atau sekedar buat pajangan di sidebar.

Tip: bentuk font dan background warna dapat dirubah sesuai selera. Tinggal klik menu �color� dan �background� di situs di atas.
Oh iya, gambar sederhananya seperti ini....








 

Buat Kotak Komentar

Comments Box atau Kotak Komentar adalah suatu kotak yang berfungsi untuk memberikan komentar terhadap isi dari suatu artikel dalam sebuah weblog. Jika di Wordpress.com kotak komentar tersebut akan langsung muncul tepat di bawah artikel. Namun tidak halnya di Blogspot/Blogger, kotak komentar dilayanan blog ini hanya berupa link yang kemudian baru akan muncul kotak komentar bagi pengunjung yang mau memberikan komentar terhadap artikel tersebut, hal ini menyebabkan para komentator sedikit enggan untuk melakukannya karena merasa malas untuk membuka window baru yang tentu saja akan memerlukan sedikit waktu untuk membukanya. Sehingga para pengguna layanan Blogspot lebih sedikit menerima komentar dibanding dengan para pengguna layanan Wordpress.

Tapi bagi kamu yang memakai layanan Blogspot tidakperlu khawatir lagi karena trik berikut ini akan mengulas bagaimana caranya menambahkan kotak komentar atau comments box sehingga menjadi kotak komentar yang ada di Wordpress yaitu persis berada dibawah artikel caranya adalah dengan menggunakan layanan di http://www.haloscan.com. Satu hal yang perlu diperhatikan sebelum kamu menggunakan layanan ini yaitu "komentar-komentar terdahulu akan hilang", jadi pikirkanlah dulu sebelum kamu memakai layanan ini. Kalau kamu sudah yakin mau menerapkannya maka berikut ini adalah caranya:

Buka website http://haloscan.com/
Daftarkan diri kamu di website tersebut. Setelah selesai Login dengan username dan password yang sama dengan saat daftar.
Setelah login akan muncul beberapa menu. Pertama pilih menu setting. Didalam menu Setting ada beberapa pengaturan yang harus disi silahkan atur sesuai dengan keinginanmu.
Supaya kotak komentarnya muncul dibawah postingan, ganti status "open in popup window" menjadi "off". kamudian simpan.
Langkah selanjutnya yaitu pilih menu Template. Silahkan pilih mana yang kamu sukai, sebaiknya sesuaikan dengan warna blog kamu kemudian simpan.
Langkah berikutnya yaitu pilih menu Install Beri tanda pada radio button di samping tulisan Blogger or Blogspot (new version) lalu klik Tombol Next
Klik Tombol Brows , silahkan pilih file template yang sudah dibackup. Kalau belum silahkan backup dulu.
Klik tombol Upload Blogger Template. Jika sudah berhasil klik tombol Download New Template kemudian di save.
Login ke Blogger/Blogspot
Pilih Template kemudian klik menu Edit HTML Untuk Upload template klik tombol Browes.
Masukkan template yang sudah didownload dari haloscan tadi lalu Upload kemudian simpan setting.
Coba buka buka web blog kamu dan lihat hasilnya. Sekarang kamu sudah mempunyai kotak komentar seperti yang ada di wordpress.
Trus gimana caranya nampilin komen-komen terbaru biar bisa kelihatan di sidebar? caranya gampang, yiatu kembali ke haloscan trus pilih dashbord nha disitu kan ada recent comments trus dibawahnya ada link tulisannya gini "put this widget on your site" nha kamu klik link tersebut, setelah itu dibawahnya akan muncul kotak yang berisi kode. Copy kode tersebut dan pasang di blog kamu, mudah bang geds to?
Selamat Mencoba... Good Luck Man!!!!!

Oh ya, di haloscan tersebut sudah ada tutorialnya, tinggal ikuti deh petunjuknya....
Ok's bang geds kan?????
 

Membuat Shout Box

Kotak ngoceh atau istilah lainnya shout box, Say Box, Tag Board, dan Chatter Box adalah suatu kotak yang berfungsi untuk mengirimkan pesan-pesan pendek, namun bisa juga berfungsi sebagai tempat ngobrol (chatting). Dengan shoutbox, kita juga bisa mempromosikan blog kita, misalnya nih, kita datangi blog orang yang menyediakan kotak ini kemudian kita kasih komentar atau cuma sekedar salam di shoutbox mereka, lalu yang punya blog akan melihat di shoutbox, biasanya meraka akan balas mengunjungi blog kita. Nha gitu ceritannya. Biasanya kotak ngoceh diselipkan ke dalam halaman web/blog dengan bahasa java Script. Bagi kamu yang jago pemrograman java script mungkin bisa membuatnya sendiri dengan membuat kode-kode yang memusingkan kepala. Namun buat kamu yang nggak jago nggak usah kuatir karena sekarang ini banyak situs internet yang menyediakan layanan ini, salah satunya yaitu Shoutmix . Caranya adalah sebagai berikut :

1. Buka situs Shoutmix Kamu harus mendaftar di situs tersebut, cara daftarnya gampang kok.
2. Jika pendaftarannya berhasil kamu langsung disuruh milih type shoutbox yang
disediakan, terserah kamu milih bentuknya yang gimana. Klik tombol Continue
3. Setelah itu kamu akan mendapat ucapan "Terima Kasih" lalu klik link Go to My
Control Panel Now
4. Disitu kamu bisa mensetting terlebih dahulu shoutbox kamu, misalnya Style &
Color, Date & Time, dan lain-lain.
5. Jika sudah selesai klik menu Get Codes
6. Jika kamu pingin menaruh shoutbox di blog kamu pilih "Place Shoutbox on Webpage"
7. Atur lebar dan tinggi shoutbox di kolom widht dan hight
8. Kemudian Copy kode yang ada di dalam kotak "generated Codes"
9. Login ke blogger.com lalu pilih Layout kemudian Add Page Elements
11. Tambahkan element HTML/Javascript.
12. Paste Kode yang telah kamu copy dari shoutbox.com tadi di kotak "Content" lalu simpan.
13. Jadi deh.....

 
diooda