New813 "Newbie"

Membuat Pointer (Cursor) Berekor Bintang

2010-07-01T21:49:00.001+07:00

Membuat POINTER (*tanda panah/cursor) berekor? Maksud saya bukan "ekor" kaya bangsa kambing atau binatang lain loh, tapi pointer yang diikuti bintang yang bertaburan. Saat pointer digerakkan, dibelakangnya akan terlihat bintang-bintang bertaburan mengiringi arah gerakan pointer. Bagi anda yang ingin mempercantik tampilan situs, anda bisa mencoba trik yang satu ini. Warnanyapun bervariasi, anda tinggal menyesuaikan saja dengan tampilan situs pribadi anda.
Caranya sebagai berikut:
1. Seperti biasa, silahkan login ke blogger
2. Pilih Tata Letak, kemudian Tambah Gadget dan pilih HTML/Javascript
3. Masukkan script dibawah ini, kemudian simpan.

Warna HIJAU

Warna PUTIH

Warna UNGU

Warna MERAH

Semoga bermanfaat...
source: epg-studio

Memasang Back to Top Button

2010-06-30T22:24:00.001+07:00

Back to Top (kembali ke atas), saya yakin anda sering menemui "button/tombol" navigasi ini pada situs-situs yang sering anda kunjungi. Dengan menggunakan tombol ini anda tidak perlu susah payah untuk kembali ke halaman bagian atas dengan menggunakan "scroll mouse", cukup hanya dengan meng-klik tombol ini saja (lihat footer bagian kanan halaman ini). Jika halaman yang anda buka memiliki artikel yang panjang, tentu akan sedikit "melelahkan" ketika anda ingin kembali ke halaman bagian atas dengan menggunakan scroll mouse anda. Sudah jelas bukan apa fungsi tombol navigasi "Back to Top"? Nah, berikut ini adalah cara pemasangan tombol navigasi Back to Top pada blogspot.
1. Login ke blogger
2. Masuk ke Tata Letak, kemudian Edit HTML
3. Beri tanda centang pada kotak Expand Template Widget
4. Langkah selanjutnya silahkan cari kode </b:section> (cari yang paling bawah)
Tips: untuk memudahkan pencarian kode, tekan F3 atau Ctrl+F lalu masukkan kode </b:section> pada "field" dibawah sebelah kiri.
5. Copy kode dibawah ini dan letakkan dibawah kode yang diatas tadi.

<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://g.imagehost.org/0373/arrow_up_green.png'/></a>

Tampilan gambar akan telihat seperti ini
6. Simpan template anda dan cek hasilnya.
Silahkan anda ganti tulisan Back to Top (warna orange) dengan tulisan anda, dan jika anda ingin memasang gambar anda sendiri silahkan ganti alamat gambar (warna biru) dengan alamat URL gambar anda. Angka 5 (warna merah) adalah posisi gambar, silahkan atur sesuai keinginan anda.
Semoga bermanfaat..

Cara Mempercantik Blog dengan MARQUEE (text berjalan)

2010-06-30T01:55:00.004+07:00

MARQUEE atau yang biasa dikenal sebagai "Text Berjalan" merupakan salah satu cara untuk mempercantik tampilan sebuah situs. Anda dapat menyampaikan salam selamat datang ataupun bentuk pesan yang lain, misalnya saja membuat "Strip Iklan". Biasanya, pengunjung cenderung mengamati "sesuatu yang bergerak", entah itu yang berbentuk banner flash ataupun tulisan. Dan untuk mengatur gerakan, ruang gerak dan sebagainya tinggal menyisipkan perintah-perintah saja. Cara membuat marquee yang paling sederhana adalah seperti dibawah ini:

<marquee>INI DASAR MEMBUAT MARQUEE</marquee>
dan hasilnya seperti ini:

DASAR MEMBUAT MARQUEE

Dan untuk MENGATUR KECEPATAN MARQUEE, tinggal menambahkan kode
[ scrollamount="ANGKA" ] *ex: angka 3.
<marquee scrollamount="3">CONTOH KECEPATAN MARQUEE</marquee>

CONTOH KECEPATAN MARQUEE

Perhatikan kecepatan text dan bandingkan dengan marquee diatas, hasilnya marquee bergerak sedikit lebih lambat. Ganti angka untuk menyesuaikan kecepatan yang anda inginkan.
Selanjutnya MENENTUKAN ARAH MARQUEE
Contoh:

BERGERAK KE KANAN >>---->

Tambahkan perintah [ direction="RIGHT" ] marquee bergerak ke kanan

<----<< BERGERAK KE KIRI

Tambahkan perintah [ direction="LEFT" ] marquee bergerak ke kiri

BERGERAK KE BAWAH

Tambahkan perintah [ direction="DOWN" ] marquee bergerak ke bawah

BERGERAK KE ATAS

Tambahkan perintah [ direction="UP" ] marquee bergerak ke atas
Selanjutnya MEMBATASI RUANG GERAK MARQUEE dengan menambahkan perintah
[ behavior="alternate" ]
Contoh:

EH.. KEPENTOK

EH.. KEPENTOK LAGI

Bandingkan dengan contoh marquee yang diatas tadi, marquee masih bisa bergerak bebas seolah-olah menembus tembok.
Selanjutnya MENENTUKAN AREA MARQUEE dengan menambahkan perintah
[ height="ANGKA" width="ANGKA%" ]

AREA MARQUEE
AREA MARQUEE | STOP!! DILARANG JALAN TERUS!!

MENYISIPKAN EMOTICON PADA MARQUEE
Untuk menyisipkan emoticon anda tinggal menambahkan kode
Contoh:

<marquee>MAAF, SAYA CAPEK. BESOK LAGI YA..<img src="http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif"/></marquee>

Hasilnya:

MAAF, SAYA CAPEK. BESOK LAGI YA..

Mudah bukan? Silahkan bereksperimen dengan mengkombinasikan perintah-perintah seperti contoh diatas tadi. Semoga bermanfaat, salam blogger Newbie

Code Encrypter "Pengaman Kode"

2010-06-29T02:22:00.005+07:00

Gambar 1
Pernah melihat Script atau Kode acak seperti pada gambar diatas? Bingung ya? Bentuk script pada gambar 1 sebenarnya adalah script yang sudah di enkripsi menggunakan Code Encrypter dari situsnya evrsoft.com.
Sedangkan Enkripsi sendiri ialah proses mengacak data, hal ini dilakukan agar kode tersebut tidak dapat dibaca oleh pihak lain. Menurut kambing.ui.ac.id, tempat dimana saya mencari arti enkripsi yang sebenarnya, gambaran sederhana tentang enkripsi misalnya mengganti huruf a dengan n, b dengan m dan seterusnya. Model penggantian huruf sebagai bentuk enkripsi sederhana ini sekarang tidak dipergunakan secara serius dalam penyembunyian data. ROT-13 adalah program yang masih suka dipergunakan. Intinya adalah mengubah huruf menjadi 23 huruf didepannya. Misalnya b menjadi o, begitu seterusnya.
Jika anda penasaran ingin mencobanya, silahkan kunjungi situs evrsoft.com dan langkah-langkahnya sebagai berikut:
1. Masukkan kode atau script yang akan di enkripsi. Lihat gambar 2

Gambar 2
2. Klik "Encrypt" (tunggu proses) kemudian klik "OK" pada papan pemberitahuan bahwa proses enkripsi sudah selesai (gambar 3)

Gambar 3
Sampai disini proses sudah selesai. Dan jika anda ingin mengembalikan pada keadaan semula, klik "Source"
Semoga bermanfaat, salam blogger new813

Loading Page Berat? Masalahkah?

2010-06-28T03:46:00.002+07:00

Terinspirasi dari "blog walking" ke salah satu blog teman yang "maaf..." loading page-nya berat banget, sampai capek nunggunya.. Nyerah deh kalo suruh nunggu kelamaan Sebenarnya apa sih Loading Page? Menurut versi saya, loading page adalah waktu yang dibutuhkan browser (Mozilla, Internet Explorer, Opera dll) untuk membuka sebuah halaman secara menyeluruh / full page (kalau keliru mohon dibetulkan). Contoh faktor yang mempengaruhi loading page adalah pemasangan file gambar dengan ukuran pixel yang besar dan dengan kapasitas yang banyak dan juga pemasangan widget flash yang berlebihan. Sebenarnya hal semacam ini dapat dihindari dengan meng-convert file gambar terlebih dahulu sebelum di upload, satu hal yang "kemungkinan besar" diabaikan si empunya situs. Namun jika loading page menjadi terasa berat disebabkan oleh koneksi yang "angin-anginan", itu sebuah pengecualian loh..
Sebenarnya "menjadi masalah atau tidak-nya" loading page tergantung pada diri masing-masing. Namun jika hal ini dibiarkan terus menerus tentu akan mempengaruhi jumlah pengunjung situs itu sendiri, dan akhirnya PageRank-pun menurun. Saya yakin, tak ada seorang blogger-pun yang rela ditinggalkan pengunjungnya, apalagi saya yang masih minim pengunjung... (sering main kesini dunk...)
Diakui atau tidak, kredibilitas dan eksistensi sebuah situs juga ditentukan oleh jumlah pengunjung bukan? Dan solusinya adalah... (menurut saya lagi)
1. Convert (kecilkan) ukuran (pixel) gambar yang akan di upload
2. Gunakan widget hanya yang diperlukan, jangan berlebihan
3. Gunakan script yang dapat menyembunyikan dan memunculkan file gambar ataupun widget, contoh: menggunakan Spoiler (lihat Buku Tamu situs ini) dsb..
Nah, sekarang tugas anda adalah memberikan komentar tentang Loading Page di situs ini. Kalo terasa berat (bukan karena koneksi) mohon beritahu saya ya... tengkiu..
Lumayan jelas bukan? Semoga bermanfaat, salam Blogger New813

Cara Menambah Emoticon Y!Mesenger pada Shoutbox

2010-06-27T19:54:00.001+07:00

Pada posting terdahulu sempat saya bahas "Cara Membuat Buku Tamu", dan pada posting kali ini saya akan membahas "cara menambah emoticon Y!Mesenger pada shoutbox" seperti yang pernah saya janjikan minggu lalu. Sebenarnya untuk menambahkan emoticon pada shoutbox tidaklah rumit dan tidak butuh waktu lama. Namun saya rasa tak ada salahnya apabila kali ini saya membahasnya khusus untuk anda yang belum mengetahui caranya, siapa tahu anda memang sedang "bosan" dengan emoticon yang hanya itu-itu saja. Pada emoticon standar shoutmix, anda tak akan menemukan kopi, berdoa, berguling dsb. Nah, jika anda menggunakan shoutmix sebagai "Buku Tamu" dan ingin menambahkan emoticon Y!Messenger pada buku tamu anda, langkah-langkahnya sebagai berikut:
1. Silahkan kunjungi www.shoutmix.com dan login dengan ID shoutmix anda
2. Pada tab menu Display, pilih smiley (lihat gambar 1)

3. Masukkan URL emoticon yang ingin anda tambahkan, kemudian klik Add

3. Jika sudah selesai klik Save Setting, selesai..
Untuk URL emoticon silahkan kunjungi situsnya di id.messenger.yahoo.com Semoga bermanfaat, salam Blogger New813

LinkWithin, Blogger Widget pendongkrak Page View

2010-06-27T05:58:00.001+07:00

Hampir subuh dan niatnya pengen langsung tidur, istirahat yang "telat". Iseng-iseng googling nyari bahan pembahasan buat besok, eh malah dibikin penasaran sama "Blogger Widget" yang satu ini. Maklumlah, namanya juga "blogger newbie" jadinya dikit-dikit pengen tahu dan langsung dicobain. Nama widget ini "LinkWithin", dan cara instalasinyapun sangat mudah, hanya tinggal masukkan script, beres. Menurut pendapat saya, fungsi dan cara kerja LinkWithin hampir sama dengan Related Post by Categories. Yang membedakan adalah LinkWithin ikut menyertakan "thumnail" yang ada pada posting dan cara memunculkannyapun tidak berdasarkan kategori posting yang sama (acak) seperti terlihat pada gambar 1.

gambar 1

Jika anda juga ingin menggunakan widget ini? Silahkan kunjungi situs resminya di www.linkwithin.com. Dan langkah-langkahnya kurang lebih sebagai berikut:
1. Isi semua field yang tersedia dengan data anda, setelah itu klik "Get Widget"

gambar 2

2. Langkah selanjutnya klik hiperlink "Install Widget". Anda akan dihadapkan pada tampilan seperti gambar 3, lalu klik "ADD WIDGET"

gambar 3

3. Drag (geser) widget LinkWithin dan letakkan dibawah form posting

gambar 4

4. Klik "Save"

5. Proses instalasi widget LinkWithin selesai, silahkan lihat hasilnya.
Related Post ala LinkWithin tentu saja dapat membantu meningkatkan Page View situs, dimana pengunjung akan disuguhi dengan beberapa judul posting yang acak (didalam settingan-nya anda dapat menampilkan 3-5 post) dan diharapkan pengunjung juga akan membuka-buka halaman lain yang dimunculkan oleh widget ini. Anda suka widget ini? Silahkan saja dipasang. Semoga bermanfaat, salam Blogger New813

Cara Membuat Posting Berkaitan (Related Post by Categories)

2010-06-27T03:31:00.000+07:00

Maksud dari dibuatnya "Posting Berkaitan/Related Post by Categories" kurang lebihnya yaitu untuk memudahkan pengunjung situs dalam pencarian artikel/posting yang diinginkan. Ibaratnya seperti ini. Anggap saja situs adalah sebuah toko, maka related post adalah sebuah etalase yang berfungsi untuk memajang barang dagangan. Setiap pengunjung membaca sebuah artikel pada sebuah situs, dan pada situs tersebut terdapat posting dengan "kategori yang berkaitan" maka dibawah posting tersebut akan "dipajang" atau dimunculkan judul-judul posting yang lain (silahkan lihat gambar). Tentu saja hal ini akan membuat si pengunjung mudah dalam menemukan apa yang dicarinya tanpa harus membuka-buka posting satu demi satu. Jika anda ingin membuat related post by categories pada situs anda, silahkan ikuti langkah-langkahnya sebagai berikut:

1. Masuk ke blogger anda
2. Pilih Tata Letak kemudian Edit HTML
3. Beri tanda "tik" atau centang pada kotak "Expand Template Widget"
4. Untuk menghindari kegagalan, silahkan back up template terlebih dahulu dengan meng-klik "Download Template Lengkap" atau meng-copy seluruh kode pada template anda dan menyimpannya kedalam "notepad"
5. Cari kode <data:post.body/>
Jika anda menggunakan fasilitas "Readmore", biasanya terdapat 2 kode. Pilih yang diatas.
Tips:
*Untuk memudahkan pencarian, tekan F3 atau Ctrl+F pada keyboard anda lalu copy kode tadi dan masukkan pada kolom pencarian. Hasil temuan akan tampak dengan "highlight" berwarna hijau.
6. Jika sudah ketemu, copy kode berikut dan paste-kan dibawah kode yang tadi anda cari.

b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='widget-content'>
<h3>Related Post by Categories</h3>
<div id='data2007'/> 
<script type='text/javascript'>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>

7. Ganti tulisan berwarna merah dengan kata-kata yang anda sukai kemudian "simpan template".
8. Selesai
Hasilnya kurang lebih akan terlihat pada gambar (sesuai dengan kategori artikel posting anda)

**Jika kode diatas "belum berhasil", coba gunakan alternatif kode dibawah ini:

<b:if cond='data:blog.pageType == "item"'> 
 <div class='similiar'> 
 <div class='widget-content'> 
 <h3>Related Post by Categories</h3> 
 <div id='data2007'/> 
 <script type='text/javascript'> 
 
 var homeUrl3 = "<data:blog.homepageUrl/>"; 
 var maxNumberOfPostsPerLabel = 4; 
 var maxNumberOfLabels = 10; 
 
 maxNumberOfPostsPerLabel = 100; 
 maxNumberOfLabels = 3; 
 
 
 function listEntries10(json) { 
 var ul = document.createElement('ul'); 
 var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ? 
 json.feed.entry.length : maxNumberOfPostsPerLabel; 
 for (var i = 0; i < maxPosts; i++) { 
 var entry = json.feed.entry[i]; 
 var alturl; 
 
 for (var k = 0; k < entry.link.length; k++) { 
 if (entry.link[k].rel == 'alternate') { 
 alturl = entry.link[k].href; 
 break; 
 } 
 } 
 var li = document.createElement('li'); 
 var a = document.createElement('a'); 
 a.href = alturl; 
 
 if(a.href!=location.href) { 
 var txt = document.createTextNode(entry.title.$t); 
 a.appendChild(txt); 
 li.appendChild(a); 
 ul.appendChild(li); 
 } 
 } 
 for (var l = 0; l < json.feed.link.length; l++) { 
 if (json.feed.link[l].rel == 'alternate') { 
 var raw = json.feed.link[l].href; 
 var label = raw.substr(homeUrl3.length+13); 
 var k; 
 for (k=0; k<20; k++) label = label.replace("%20", " "); 
 var txt = document.createTextNode(label); 
 var h = document.createElement('b'); 
 h.appendChild(txt); 
 var div1 = document.createElement('div'); 
 div1.appendChild(h); 
 div1.appendChild(ul); 
 document.getElementById('data2007').appendChild(div1); 
 } 
 } 
 } 
 function search10(query, label) { 
 
 var script = document.createElement('script'); 
 script.setAttribute('src', query + 'feeds/posts/default/-/' 
 + label + 
 '?alt=json-in-script&callback=listEntries10'); 
 script.setAttribute('type', 'text/javascript'); 
 document.documentElement.firstChild.appendChild(script); 
 } 
 
 var labelArray = new Array(); 
 var numLabel = 0; 
 
 <b:loop values='data:posts' var='post'> 
 <b:loop values='data:post.labels' var='label'> 
 textLabel = "<data:label.name/>"; 
 
 var test = 0; 
 for (var i = 0; i < labelArray.length; i++) 
 if (labelArray[i] == textLabel) test = 1; 
 if (test == 0) { 
 labelArray.push(textLabel); 
 var maxLabels = (labelArray.length <= maxNumberOfLabels) ? 
 labelArray.length : maxNumberOfLabels; 
 if (numLabel < maxLabels) { 
 search10(homeUrl3, textLabel); 
 numLabel++; 
 } 
 } 
 </b:loop> 
 </b:loop> 
 </script> 
 </div> 
 
 </div> 
</b:if> 

Semoga bermanfaat.. Salam Blogger New813

Cara Atasi Kode HTML Error (Tidak Well-Formed)?

2010-06-25T22:34:00.000+07:00

Untuk posting kali ini saya ajak anda untuk sedikit membahas tentang kode HTML yang error saat dilakukan editing atau "tidak well-formed" atau tidak dapat disimpan (diparse). Jika anda suka berkreasi dan bereksperimen dengan halaman situs blog anda, tentu saja setiap saat anda akan berhadapan dengan banyaknya kode-kode HTML atau Javascript, terutama pada kotak editor seperti yang terlihat pada gambar dibawah. Khusus bagi anda yang masih awam dengan kode HTML, mari kita belajar sama-sama. Pada intinya dalam peng-edit-an kode HTML memanglah harus cermat dan hati-hati. Jika kode HTML yang diedit kurang "satu tanda" saja, bisa dipastikan kode HTML tak akan dapat berfungsi dengan baik, bahkan tidak dapat disimpan dalam template anda alias tidak well-formed. Lalu bagaimana cara mengatasinya?

Baiklah, mari kita mulai.
Kode yang paling pokok dalam pengeditan kurang lebihnya adalah < , >, " , ' , $ . Dan jika anda mengalami "kode error" saat melakukan peng-edit-an, coba perhatikan kode-kode yang saya tulis diatas tadi. Coba anda ganti kode < dengan & lt; (tanpa spasi) - > dengan & gt; (tanpa spasi) - " dengan ' atau sebaliknya dan $ dengan & amp; (tanpa spasi). Jika format kode anda sudah benar namun masih saja ditolak (tidak bisa disimpan), silahkan rubah kode yang ingin anda masukkan (edit) dengan menggunakan encode / decode HTML online, KLIK disini.

Anda tinggal memasukkan kode-kode HTML anda, kemudian klik "ENCODE". Copy kode yang sudah dirubah dan silahkan masukkan kembali kode anda. Semoga bermanfaat..

Cara Membuat "Buku Tamu" pada Blogger

2010-06-25T06:45:00.000+07:00

Sudah tahu kan apa yang dimaksud dengan "Buku Tamu" pada posting ini? Yups, ShoutBox (kotak untuk berteriak). Lalu apakah sebuah situs / weblog harus dipasang Buku Tamu / ShoutBox? Jawabannya ~~"tidak harus"~~. Pada dasarnya shoutbox berfungsi sebagai "ruang diskusi / ngobrol untuk pengunjung situs" (selain forum), namun begitu memasang widget inipun bukanlah sebuah keharusan, semua terserah si empu-nya situs. Hanya saja terkadang para blogger mania lebih merasa "kerasan ngobrol" jika disediakan tempat tersendiri, seperti shoutbox ini misalnya. Dan endingnya situs jadi ramai dunk karena pada suka ngobrol di shoutbox. Oya, bentuk dan emoticon ataupun smiley yang dipakai juga beda-beda loh. Kalo gak percaya cobain aja semuanya. Contoh shoutbox yang sering digunakan adalah ShoutMix, Oggix, Cbox dll. Dan kamu juga bisa menambah emoticon yang kamu sukai (dibahas lain kali ya)
Untuk memasang pada sidebar, caranya seperti berikut:
1. Daftar dulu ke website penyedia shoutbox, lalu setting sesuai keinginan kamu. Jangan lupa copy kode Javascript-nya.
2. Login ke "Blogger"
3. Masuk ke "Tata Letak"
4. Klik "Tambah Gadget"
5. Pilih "HTML / Javascript" lalu masukkan kode Javascript yang sudah kamu copy tadi
6. Simpan dan sesuaikan tata letak shoutbox seperti keinginanmu.
Untuk membuat shoutbox, kamu tinggal klik aja link-link diatas tadi, selesai. Salam New813

Cara Mengganti Favicon pada Blogspot

2010-06-25T05:27:00.000+07:00

Mengganti favicon? Apa maksudnya?
Begini! Favicon (Favorite Icon) adalah gambar yang biasa kamu lihat dibrowser. Pada situs berbasis blogspot, favicon standart default (bawaan) akan terlihat seperti ini pada browser kamu, betul kan. Berbeda dengan Wordpress yang bisa membuat favicon tanpa mengutak atik kode HTML/Javascript, maka pada blogger kamu harus mengutak atiknya. Tenang saja, gak sulit kok. Kamu cukup menambah sedikit kode diantara kode-kode yang ada pada template blogspotmu, dan itu tidak membutuhkan waktu lama. Caranya begini.

1. Pertama-tama siapkan dulu gambar yang kamu inginkan untuk mengganti favicon-mu
2. Simpan gambar pada hosting penyimpanan file gambar gratis. Kalau kamu belum punya, silahkan daftar di Photobucket atau Tinypic
3. Langkah selanjutnya masuk ke Dasbor - Tata Letak kemudian klik "Edit HTML" dan beri tanda centang pada "Expand Template Widget".
4. Kemudian cari kode

<head>
<b:include data='blog' name='all-head-content'/>

5. Letakkan kode berikut dibawahnya

<link href='http://alamat_gambar_yang_sudah_kamu_simpan' rel='shortcut icon'/>

6. Ganti link berwarna merah demgan link URL penyimpanan gambar kamu
7. Simpan template dan... abrakadabraa.. gambarnya sudah berubah tuh!

TIPS:
Untuk memudahkan pencarian kode HTML pada template, klik "F3" pada keyboard atau tekan bersamaan "Ctrl+F". Jika takut gagal, download template kamu dengan meng-klik tulisan "Download Template Lengkap".
Selesai. Selamat bermain-main dengan favicon kamu. Salam New813

Cara Membuat Toolbar Cantik ala Wibiya

2010-06-25T01:22:00.000+07:00

Kamu masih tergolong "newbie" dalam hal blogging? Pengen bikin tollbar buat mempercantik situs weblog tapi gak paham dengan kode HTML/Javascript dan belum ngerti caranya gimana? Gak usah bingung apalagi pusing, biar kamu gak paham bahasa HTML/Javascript, kamu tetep bisa bikin toolbar cantik kok. Contohnya tuh liat sendiri di bagian footer situs ini. Bagaimana menurut pendapatmu? Cantik bukan? Nah, jika kamu menginginkan toolbar seperti dibawah, silahkan kunjungi www.wibiya.com dan buat toolbar untuk weblog-mu semudah kamu membuat akun email ataupun membuat facebook, lalu ikuti langkah-langkahnya sebagai berikut:

1. Klik Get It Now (button warna hijau)

2. Isikan data-data kamu pada "field" / kolom yang tersedia. Pada field "Site Language" isikan dengan "bahasa Indonesia" (jika weblog kamu menggunakan bahasa Indonesia, biarkan jika menggunakan bahasa Inggris) kemudian klik "Next"

3. Pada bagian ini kamu diminta untuk memilih warna toolbar, sesuaikan dengan template yang kamu gunakan dan "KLIK" pada warna yang kamu inginkan.

Jika ingin merubah "icon", klik "change" pada "Website Icon" dan upload gambar kamu (jpg,png,gif. Max 30K). Sampai disini apa ada yang mau bertanya? Tunjuk jari tinggi-tinggi ya..

4. Selanjutnya pilih aplikasi yang kamu inginkan, tentu saja kamu harus memiliki aplikasi yang akan dipasang. Contoh: Twitter, Facebook, translator, dll kemudian klik "Next"

5. Lalu akan muncul "field pop up" dari aplikasi yang kamu pilih tadi. Isikan data sesuai perintah. Setelah selesai klik "Done"

6. Proses pembuatan selesai. Pilih dimana kamu ingin menginstal toolbar baru hadiah dari "wibiya" ini sesuai platform yang kamu gunakan (blogger, wordpress, joomla, typed dsb) kemudian klik "Done"

7. Proses selanjutnya adalah bagian terakhir dari langkah-langkah diatas, yaitu menambahkan "widget" atau toolbar baru kamu ke situs atau weblog-mu sendiri. "Klik menambah widget"

8. Kembali ke halaman situs kamu dan lihat perbedaannya. Toolbar sudah terpasang dengan manis di situs kesayangan kamu, seneng kan..
OK deh, soal toolbar sudah beres.. besok bahas yang lain ya. Salam New813