Mengganti Font Judul Posting di Blogger

enis atau type font pada template blogger, baik itu template bawaan blogger maupun template external yang di download dari situs penyedia template blog, terkadang terasa kurang sesuai dengan tema blog dan keinginan kita, jika anda ingin merubahnya agar tampilan blog menjadi lebih menarik, berikut ini adalah cara mengganti jenis atau type font pada judul posting atau judul artikel yang akan di publikasikan.

• Kunjungi Google Web Font

• Pilih salah satu jenis Font yang anda inginkan (saat artikel ini di publish Google Web Font menyediakan kurang lebih 455 font families) dengan cara klik button Add to collection.

•  Alihkan perhatian ke bagian bawah halaman kemudian klik button Use

• Sekarang gulir layar ke bagian bawah di sana akan terdapat 2 kode yang pertama adalah kode link ke Google Web Font dan yang kedua adalah kode style css font, ambil atau copy kedua kode ini

•  Login ke blogger.com dengan ID Anda.

• Jika sudah berhasil login klik link Nama Blog Anda >> Template >> Edit HTML >> Proceed (tutorial ini menyesuaikan dengan tampilan interface blogger yang diperbaharui)

• Sebelumnya backup terlebih dahulu template Anda.
  

• Cari kode <![CDATA[/* dan tempatkan kode link dari Google Web Font (kode yang pertama) tepat di atas kode <![CDATA[/* tetapi jangan lupa untuk menambahkan karakter slash ( / ) pada akhir kode seperti contoh di bawah ini (tulisan berwana merah) jika tidak ditambahkan maka pada saat menyimpan prubahan akan muncul massege error :

<link href='http://fonts.googleapis.com/css?family=Shadows+Into+Light+Two' rel='stylesheet' type='text/css' /> <b:skin><![CDATA[/*

• Untuk mengganti font judul posting, cari kode .post-title atau cari kode h2.post-title, ini adalah tag untuk judul posting, kemungkinan akan berbeda untuk setiap template yang digunakan, pusatkan saja perhatian pencarian pada kode post-title, cari bagian kode css untuk font seperti ini  font-family: 'Arial', Tahoma, Helvetica, FreeSans, sans-serif; ganti nama font yang pertama (berwarna merah) dengan nama font yang telah anda pilih pada Google Web Font (kode yang kedua).

• Simpan perubahan template dengan menekan button Save template

Mengganti Font Judul Posting di Blogger

Jenis atau type font pada template blogger, baik itu template bawaan blogger maupun template external yang di download dari situs penyedia template blog, terkadang terasa kurang sesuai dengan tema blog dan keinginan kita, jika anda ingin merubahnya agar tampilan blog menjadi lebih menarik, berikut ini adalah cara mengganti jenis atau type font pada judul posting atau judul artikel yang akan di publikasikan.

• Kunjungi Google Web Font

• Pilih salah satu jenis Font yang anda inginkan (saat artikel ini di publish Google Web Font menyediakan kurang lebih 455 font families) dengan cara klik button Add to collection.

•  Alihkan perhatian ke bagian bawah halaman kemudian klik button Use

• Sekarang gulir layar ke bagian bawah di sana akan terdapat 2 kode yang pertama adalah kode link ke Google Web Font dan yang kedua adalah kode style css font, ambil atau copy kedua kode ini

•  Login ke blogger.com dengan ID Anda.

• Jika sudah berhasil login klik link Nama Blog Anda >> Template >> Edit HTML >> Proceed (tutorial ini menyesuaikan dengan tampilan interface blogger yang diperbaharui)

• Sebelumnya backup terlebih dahulu template Anda.
  

• Cari kode <![CDATA[/* dan tempatkan kode link dari Google Web Font (kode yang pertama) tepat di atas kode <![CDATA[/* tetapi jangan lupa untuk menambahkan karakter slash ( / ) pada akhir kode seperti contoh di bawah ini (tulisan berwana merah) jika tidak ditambahkan maka pada saat menyimpan prubahan akan muncul massege error :

<link href='http://fonts.googleapis.com/css?family=Shadows+Into+Light+Two' rel='stylesheet' type='text/css' /> <b:skin><![CDATA[/*

• Untuk mengganti font judul posting, cari kode .post-title atau cari kode h2.post-title, ini adalah tag untuk judul posting, kemungkinan akan berbeda untuk setiap template yang digunakan, pusatkan saja perhatian pencarian pada kode post-title, cari bagian kode css untuk font seperti ini  font-family: 'Arial', Tahoma, Helvetica, FreeSans, sans-serif; ganti nama font yang pertama (berwarna merah) dengan nama font yang telah anda pilih pada Google Web Font (kode yang kedua).

• Simpan perubahan template dengan menekan button Save template

Melacak IP Address e-mail

Sesuai judul diatas, saya akan sharing tips & trick tentang cara "Melacak IP Address e-mail".

Langsung saja :
Sering kali kita menerima pesan yang masuk ke alamat email bahkan pesan yang berupa SPAM (Pesan yang di anggap Sampah biasanya berupa Iklan).Berikut merupakan Tips untuk mengetahui IP address dari manakah asal pengirim email:
Yahoo Mail.
1. Login ke account email anda ( http://mail.yahoo.com/ ).
2. Masuk ke inbox dan buka salah satu email yang ingin anda lihat.
3. Pada pojok kanan bawah cari menu tulisan “Full Headers” dan klik tulisan tersebut.
4. Maka anda bisa mengetahui ip address pengirim email dan info detail yang lain.

Gmail / Google Mail.
1. Login ke account email anda ( http://gmail.com/ ).
2. Masuk ke inbox
3. Buka salah satu email yang ingin anda lihat,
4. Lihat kanan di bagian atas ada pilihan Reply, terus disamping tulisan Reply ada tanda panah ke bawah, klik tanda panah tersebut dan pilih Show Original.
5. Maka anda bisa mengetahui ip address pengirim email dan info detail yang lain.

Hotmail.
1. Login ke account email anda ( http://hotmail.com/ ).
2. Buka salah satu email yang ingin anda lihat
3. Klik kanan email tersebut dan pilih View Source.
4. Maka anda bisa mengetahui ip address pengirim email dan info detail yang lain.

Outlook Express.
1. Buka program Outlook Express dan login ke email anda.
2. Klik kanan pada salah satu email yang ingin anda lihat.
3. Klik menu Properties.
4. Klik tab Detail.
5. Maka anda bisa mengetahui ip address pengirim email dan info detail yang lain.

Microsoft Outlook.
1. Buka program Outlook Express dan login ke email anda.
2. Klik kanan pada salah satu email yang ingin anda lihat dan pilih Options
3. Maka anda bisa mengetahui ip address pengirim email dan info detail yang lain.

Oh iya da yang lupa, trik melacak IP Address ini bisa juga digunakan kalo kita lagi iseng pengen nge-banned si pemakai IP, biar lalu-lintas dunia mayanya "sedikit" terganggu, hehehe..

Screenshot :

spoiler for Yahoo: http://i944.photobucket.com/albums/ad282/linuxer46/yahoo.png

spoiler for Gmail: http://i944.photobucket.com/albums/ad282/linuxer46/gmail.png

mungkin kalo di layanan email lain,lebih kurang sama caranya,full header,show original,dll,tinggal kreatif anda sendiri lah
Trus kalo udah tau IPnya,diapain lagi sob?
Ya kan bisa di lookup di sini,
http://whatismyipaddress.com/ip-lookup ,
ntar keliatan siapa yang ngirim spam ke email anda

Menampilkan / Pasang Emoticon di Kotak Komentar

Dengan adanya emoticon di kotak komentar tentunya akan membuat blog menjadi lebih hidup. Para komentator menjadi lebih bisa mengekspresikan perasaannya melalui icon2 (emoticon). Kalau di wordpress mungkin feature ini sudah tersedia. Tapi untuk blogspot kita harus mengotak-atik dan mengakalinya supaya bisa menampilkan emoticon di area komentar. Gimana? kamu mau memasang emoticon ini?

Seperti biasanya, di trik ini akan diberikan dua macam emoticon, yaitu emoticon kucing (seperti punyaku ini) dan emoticon yahoo. Kamu tinggal pilih mana yang kamu suka.

Emoticon Yahoo :



Emoticon Kucing :



Gini nih cara membuatnya :

1. Pertama login ke blogger, trus ke "Layout (Tataletak) --> Edit HTML "
2. Beri tanda centang pada kotak "expand widget template"
3. Lalu letakkan script berikut sebelum kode </body>

Untuk Emoticon Yahoo :

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

Untuk Emoticon Kucing :

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

4. Kemudian cari kode berikut ini :

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>

5. Kalo sudah ketemu letakkan kode2 berikut setelah kode <p class='comment-footer'>

Ini untuk Yahoo emoticon :

<b><img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/>
:))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/>
:)]
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif'/>
;))
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/>
;;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/>
:D
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/>
;)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/>
:p
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/>
:((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/>
:)
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/>
:(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/>
:X
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/>
=((
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/>
:-o
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/>
:-/
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/>
:-*
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/>
:|
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/>
8-}
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/>
~x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/>
:-t
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif'/>
b-(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif'/>
:-L
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/>
x(
<img border='0' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/>
=))
</b>

Kalo mo yang emoticon kucing pake yang ini :

<b><img border='0' src='http://kendhin.890m.com/emoticon/capek.gif'/>
:f
<img border='0' src='http://kendhin.890m.com/emoticon/bigsmile.gif'/>
:D
<img border='0' src='http://kendhin.890m.com/emoticon/hi.gif'/>
:)
<img border='0' src='http://kendhin.890m.com/emoticon/kagum.gif'/>
;;)
<img border='0' src='http://kendhin.890m.com/emoticon/love.gif'/>
:x
<img border='0' src='http://kendhin.890m.com/emoticon/malu.gif'/>
:$
<img border='0' src='http://kendhin.890m.com/emoticon/marah.gif'/>
x(
<img border='0' src='http://kendhin.890m.com/emoticon/bingung.gif'/>
:?
</b>
<br/>
<b>
<img border='0' src='http://kendhin.890m.com/emoticon/mumet.gif'/>
:@
<img border='0' src='http://kendhin.890m.com/emoticon/muntah.gif'/>
:~
<img border='0' src='http://kendhin.890m.com/emoticon/mentok.gif'/>
:|
<img border='0' src='http://kendhin.890m.com/emoticon/ngakak.gif'/>
:))
<img border='0' src='http://kendhin.890m.com/emoticon/sedih.gif'/>
:(
<img border='0' src='http://kendhin.890m.com/emoticon/senang.gif'/>
:s
<img border='0' src='http://kendhin.890m.com/emoticon/tolong.gif'/>
:((
<img border='0' src='http://kendhin.890m.com/emoticon/wow.gif'/>
:o </b>

6. Kalo sudah trus di "save" dan coba lihat hasilnya

Tambahan
* Kadang-kadang ada beberapa template memiliki kode yang beda. Kalau caranya sudah dilaksanakan dengan benar tapi hasilnya tidak terjadi apa2 atau kodenya tidak berubah menjadi emoticon, kemungkinan itu karena Kode untuk templatenya berbeda atau bisa juga karena mugnkin hosting untuk menaruh file emoticon dan javascriptnya sedang bermasalah.


Semoga info gwa bermanfaat ya wasalam

Cara Menghilangkan Tanda Tang dan Obeng

Sering aku ditanya tentang masalah ini. Yaitu tentang bagaimana cara menghilangakn tanda tang dan obeng yang muncul di blog kita. Bagi yang baru terjun didunia blog pasti ada yang bingung kenapa di blog mereka bisa muncul tanda tang dan obeng yang biasanya bisa digunakan untuk mengedit secara langsung untuk gadget2 atau element2 yang terpasang.

Sebenarnya itu bukan merupakan suatu masalah, karena tanda tersebut hanya muncul jika pemilik blog sedang login di account blognya dan hanya muncul di komputer orang tersebut. Jadi orang lain tidak bisa melihatnya. Dan kalau pemilik blog tersebut sudah "sign out" maka tanda tersebut tidak akan muncul lagi.

Jadi para blogger pemula gak usah khawatir ya ... :D

Semoga bermanfaat ya bro wasalam

Tips Mengedit HTML Blogspot

Jika kita mengotak-atik atau mengedit HTML blog kadang2 akan mengalami kesulitan, apalagi bagi yang masih agak pemula. Entah itu gak bisa nemu kode yang mau diedit lah, gak bisa disimpan karena error lah, Ada pesen error yang gak jelas lah, dan lah-lah yang lain, ya to...??? Nha trik dan tips kali ini akan mencoba gimana cara untuk mengatasi atau setidaknya mengurangi masalah "lah-lah" yang kadang2 atau sering terjadi tersebut.
Berikut ini beberapa tips untuk edit HTML bogger:

1. Backup Template

Membackup template ini penting karena jika terjadi hal-hal yang tidak dinginkan, misalnya blog jadi rusak maka kita bisa membuatnya seperti sediakala (sebelum rusak) jika kita sebelumnya sudah membackup template. Cara membackup template ini mudah. Cukup klik pada link "Download Full Template" lalu simpan file template di komputer kita. Kalo terjadi kesalahan yang tidak bisa kita atasi, kita tinggal upload aja file template tersebut.

2. Memberi Tanda Centang pada Kotak "Expand Widget Template"

Ini yang kadang2 dilupakan para "editor". Kalau kotak "Expand Widget Templates" tidak dicentang maka kode2 yang dicari kemungkinan tidak ditemukan. Tapi kadang2 hal ini tidak perlu dilakukan tergantung dari petunjuk tutorialnya. Makanya perhatikan baik2 tutorialnya kalo mau Edit HTML blog.

3. Tips Mempermudah Pencarian

Untuk mempermudah pencarian kode yaitu dengan meng-copy dulu kode yang mau dicari kemudian tekan "Ctrl+f" lalu masukkan kode yang dicopy tadi kedalam kotak yg muncul. Kalo misalkan kode yang dicari tidak muncul maka cobalah mencari sebagian dari kode tersebut. Misal mau mencari kode <p><data:post.body/></p> jika tidak ketemu maka cb carilah sebagiannya atau seperti ini data:post.body kalau sudah ketemu maka klik tombol next untuk melihat apakah ada kode lain yang sama untuk memastikan kode yang dikehendaki. Tapi tips ini sepertinya sulit dilakakukan jika menggunakan browser "Chrome" paling mudah jika menggunakan "Mozilla Firefox".

4. Tips Menghadapi Error Yang Muncul

Jika saat menyimpan hasil editan kemudian muncul pesan error, misal seperti ini:
We were unable to save your template
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure.....
Maka hal yang harus kita lakukan adalah berusaha memahami pesan error tersebut. Kemudian kita cek kembali tutorial yang kita baca apakah langkah-langkah yang sudah kita lakukan bener2 sesuai dengan tutorialnya. kalau tidak yakin maka kita bisa mengulangi lagi tutorialnya dari awal dengan mengklik tombol "Clear Edit" terlebih dahulu.

Mungkin untuk masalah mengahadapi berbagai pesan error ini akan kita bahas lebih lanjut diepisode yang lainnya yang lebih spesifik.
Semoga bermanfaat ya wasalam

Cara Pasang Flash di Blog

Untuk memasang flash ke dalam blog cukuplah mudah. Yang kamu perlukan yaitu file flash yang biasanya ber-extensi .swf lalu upload file tersebut ke hosting. misal di geocities.com ato 000webhost ato tempat hosting lainnya. File animasi flash tersebut bisa dijadikan hiasan pada blog ato bisa juga dijadikan hiasan di header sehingga membuat blog menjadi lebih animatif. Untuk memasang flash pada blog caranya sebagai berikut :

1. Login ke blogger kemudian pilih menu "Layout".
2. Kemudian klik link "Add a gadget" dimana akan ditempatkan animasi flash.
3. Pilih "HTML/Javascript" kemudian taruh script berikut :

<embed src="http://blogoholic.info/wellcome.swf" quality="high" bgcolor="white" width="500" height="100" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash"></embed>

Contoh :


* Ganti "http://blogoholic.info/wellcome.swf" dengan alamat file flash kamu yang telah ditaruh di hosting.
* Ganti width="500" height="100 dengan ukuran dari file flashmu

Semoga bermanfaat ya guys

Mengganti "Older Posts" Dengan Angka

Secara umum, navigasi untuk pindah halaman di blogspot biasanya menggunakan link dengan teks "Older Posts (posting lama)" dan "Newer Posts (posting baru)". Beda dengan wordpress yang navigasinya bisa berbentuk angka sehingga bisa memudahkan untuk loncat beberapa halaman ke postingan yg lama maupun baru.
Nha trik kali ini akan menjelaskan bagaimana cara mengganti link "Older Posts (posting lama)" dan "Newer Posts (posting baru)" menjadi angka seperti gambar di bawah ini


1. Langkah awal tentu saja harus menuju ke desain template anda kemudian ke "Edit HTML"
2. setelah itu cari kode ini ]]></b:skin> kalo sudah ketemu taruh script dibawah ini sebelum kode tersebut

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

3. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode tersebut.

<!--Page Navigation Starts-->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
</b:if> </b:if>
<!--Page Navigation Ends -->

Kalau sudah monggo dilihat hasil nya semoga bermanfaat buat anda wasalam