Mengatur

Tampilan Blogspot
Pada bab ini, akan dibahas mengenai pengaturan tampilan blog.
Terutama menggunakan gambar favicon, mengatur NavBar, dan
mengatur elemen Blogger. Khusus tampilan template blog, baru
akan dibahas pada Bab 3.

2.1 Favicon
Favicon merupakan ikon (icon) yang muncul pada web browser
ketika pengunjung membuka halaman blog kita. Secara default, blog
yang dibuat dengan Blogger akan menampilkan logo
pada bagian
favicon.

Praktek: Mengubah Favicon

Anda harus menyiapkan file gambar yang akan digunakan sebagai
favicon. Tips: Sebaiknya, atur dulu besar ukuran file gambar agar
proses upload dapat berlangsung dengan cepat.
11

BukuPintarBlogspot
1. Buka website TinyPic yang beralamat di www.tinypic.com. Pilih
dulu file gambar yang akan di-upload dengan klik tombol
Browse.

2. Klik file gambar lalu klik tombol Open.

3. Tentukan konfigurasi upload lalu klik tombol UPLOAD NOW!.

12

Bab2MengaturTampilanBlogspot

4. Salin kode yang dibutuhkan. Caranya, seleksi kode di bawah

HTML for Websites. Klik kanan dan pilih menu Copy.

5. Buka bagian kustomisasi blog. Klik tab Tata Letak lalu tab Edit
HTML (Tata Letak > Edit HTML).

6. Tambahkan kode di bagian bawah </head>. Untuk itu, lakukan

pencarian dengan memilih menu Edit > Find. Ketikkan </head>
lalu klik tombol Next.
13

BukuPintarBlogspot

7. Tepat di bagian bawah </head>, ketikkan kode:

<linkhref='rel='shortcuticon'/>
Tempelkan (paste) kode dari TinyPic di langkah keempat. Ambil
bagian alamat URL gambar saja, yaitu kode setelah img src=.
Pada contoh ini, kode dari TinyPic adalah seperti berikut:
<ahref="http://tinypic.com"target="_blank"><img
src="http://i41.tinypic.com/x3hm4k.gif"border="0"
alt="ImageandvideohostingbyTinyPic"></a>
Maka
kode
yang
digunakan
adalah:
http://i41.tinypic.com/x3hm4k.gif. Tempatkan kode setelah link
href=. Maka hasil akhirnya adalah:
<linkhref='http://i41.tinypic.com/x3hm4k.gif'
rel='shortcuticon'/>
Anda dapat menyalin kode akhir dari bonus CD buku dengan
membuka file \Kode\favicon.txt.
8. Simpan kode yang telah diedit dengan klik tombol SIMPAN
TEMPLATE.

9. Lihat hasilnya pada halaman blog.

14

Bab2MengaturTampilanBlogspot

2.2 NavBar
Navbar merupakan singkatan dari Navigation Bar, artinya balok
navigasi. NavBar merupakan bagian navigasi yang terletak di bagian
atas halaman Blogger. Gunanya untuk memudahkan pemilik dan
pengunjung blog jika ingin melakukan tugas (task) tertentu berkaitan
dengan navigasi blog.

2.2.1 Mengenal NavBar

NavBar pada Blogger muncul secara default pada bagian atas dari
setiap halaman Blogger. Dengan menggunakan NavBar, Anda dapat
melakukan tugas-tugas secara cepat. Seperti masuk ke dalam
Blogger, melakukan pencarian blog, menjadi pengikut blog, berbagi
informasi tentang posting blog, navigasi ke blog lain, membuat entri
(posting) baru, kustomisasi blog, dan keluar dari akun blog (sign
out).
Keterangan: Tombol dan fitur dalam NavBar

: membawa Anda kembali ke situs www.blogger.com.

CARI BLOG INI: melakukan pencarian pada isi
blog yang sedang dikunjungi. Nantinya, hasil pencarian akan
tampil pada halaman blog tersebut.
Misalnya Penulis melakukan pencarian kata sekolahan pada
blog. Maka tinggal diketikkan lalu klik tombol .

Setelah itu, hasilnya akan ditampilkan langsung pada halaman

web browser.

Ikuti: digunakan untuk mengikuti perkembangan isi blog sehingga kita diberi tahu jika ada posting-posting yang baru
dengan lebih mudah. Jika link Ikuti diklik, akan muncul tampilan
untuk mengatur bagaimana cara mengikuti blog. Link ini hanya
muncul jika Anda sedang melakukan login ke dalam akun blog.
15

BukuPintarBlogspot
Anda dapat mengikuti blog dengan dua cara, yaitu secara umum
dan secara anonim.

Ikuti secara anonim, artinya Anda tidak akan muncul sebagai pengikut pada blog tersebut. Anda dapat mengikuti
perkembangan blog terbaru karena posting-posting terbaru
akan ditampilkan di dalam kustomisasi Blogger (Dasbor)
sebagai Daftar Bacaan.

Ikuti secara umum, artinya Anda akan ditampilkan dalam

blog yang Anda ikuti sebagai Pengikut. Dengan demikian,
pembaca blog yang lain akan tahu bahwa Anda mengikut
blog tersebut.

Daftar pengikut ditampilkan pada gadget Pengikut (Follower)

Untuk berhenti mengikuti blog, Anda tinggal mengklik lagi link
Ikuti pada NavBar. Setelah itu, klik tombol BERHENTI
MENGIKUTI.

16

Berbagi: Anda dapat menggunakan fitur ini untuk memberi tahu

teman-teman Anda tentang isi blog. Pada saat buku ini ditulis,

Bab2MengaturTampilanBlogspot
berbagi (sharing) dapat dilakukan menggunakan akun Twitter,
Facebook, Google Buzz, dan Google Reader.

Pilih cara berbagi yang akan dilakukan

Contoh jika berbagi (sharing) menggunakan akun Facebook

Laporkan Penyalahgunaan: melaporkan ke pihak blogger.com

bahwa blog yang sedang kita buka telah disalahgunakan oleh
pemiliknya. Penyalahgunaan bisa berupa masalah hak cipta,
kebencian terhadap agama, ras, dan lain-lain.

17

BukuPintarBlogspot

Melaporkan penyalahgunaan blog ke pihak Blogger.com

Blog Berikut: membawa Anda kepada blog orang lain secara

acak, terutama blog yang baru saja diperbarui (update) isinya
(content).

sunnidul@gmail.com: jika telah login, akun (account) juga akan

ditampilkan pada NavBar dengan nama tampilan alamat email
yang dipakai. Tulisan ini berguna untuk memberikan informasi
bahwa Anda sedang login dengan alamat email yang ditampilkan
tersebut. Jika Anda tidak sedang login, maka tulisan yang muncul adalah Buat Blog.

Posting Baru: membuat posting baru untuk blog. Hanya muncul

jika Anda sedang login ke dalam Blogger.

Kustomisasi, melakukan kustomisasi (pengaturan) konfigurasi

Blog melalui Dasbor. Hanya muncul jika Anda sedang login ke
dalam Blogger.

18

Bab2MengaturTampilanBlogspot

Keluar: Klik untuk melakukan logout (sign out) atau keluar ke

dalam akun Blogger. Jika Anda belum melakukan login, maka
tulisan yang muncul bukan Keluar tetapi Masuk. Anda dapat
mengklik link Masuk untuk ke dalam akun Blogger. Sign out
diperlukan agar akun Anda tetap aman dan tidak diutak-atik oleh
orang lain, meskipun Anda tidak sedang berada di depan komputer.

2.2.2 Modifikasi Tampilan NavBar

Navbar pada Blogger dapat diubah dengan cara mengganti desain
dan warnanya. Sebaiknya Anda memilih NavBar sesuai dengan
warna dan tampilan desain blog yang Anda miliki.
Praktek: Mengganti NavBar
1. Pastikan Anda sudah masuk ke dalam bagian Kustomisasi Blog
(Dasbor). Setelah itu, klik tab Tata Letak lalu klik tab Elemen
Laman (Tata Letak > Elemen Laman).

2. Pada bagian NavBar, klik link Edit.

3. Maka akan muncul jendela (window) baru. Pilih salah satu warna
NavBar yang cocok dengan desain blog Anda. Setelah itu, klik
tombol SIMPAN. Pada contoh ini, Penulis mengganti NavBar
Biru dengan NavBar Cahaya Transparan.

19

BukuPintarBlogspot

2.2.3 Menghilangkan NavBar

Meskipun NavBar dapat membantu untuk menjelajahi blog, ada
beberapa pemilik blog yang lebih memilih untuk menyembunyikan
NavBar tersebut. Tujuannya untuk membuat blog mereka benarbenar unik dan tidak terlihat seperti blog yang dibuat dengan
Blogger.
Praktek: Menghilangkan NavBar Blogger
1. Masuk ke dalam kustomisasi Blogger lalu klik tab Tata Letak >
Edit HTML.

20

Bab2MengaturTampilanBlogspot

2. Cari kode untuk keterangan template blog. Setelah itu, ketikkan

kode berikut di bagian bawah kode tersebut.
#navbariframe{
display:none!important;
}
Anda dapat menyalinnya dari file teks pada bonus CD buku.
Caranya, buka file \Kode\NavBar-hilang.txt.

3. Setelah itu, masukkan kode (lakukan copy-paste isi file

\Kode\NavBar-hilang.txt) tepat di bawah keterangan template
blog atau setelah kode </title>.

BloggerTemplateStyle
Name:Denim
Designer:DarrenDelaye
URL:www.DarrenDelaye.com
Date:11Jul2006

*/

#navbariframe{
display:none!important;
}
4. Simpan template yang sudah diedit dengan klik tombol SIMPAN
TEMPLATE.

21

BukuPintarBlogspot

5. Jika kode berhasil disimpan, akan muncul pesan Perubahan

Anda telah disimpan. Klik link Lihat Blog.

6. Perhatikan bahwa NavBar berhasil disingkirkan dari halaman

blog.

Jika Anda ingin mengembalikan lagi NavBar, hilangkan kode yang

ditulis sebelumnya.

2.3 Mengatur Elemen Blogger

Jika halaman blog diibaratkan seperti sebuah bangunan, maka
tampilan blog dapat dilihat sebagai susunan elemen-elemen laman
yang disebut dengan gadget atau widget.
Anda dapat menentukan elemen apa saja yang akan digunakan atau
tidak digunakan dalam blog Anda. Elemen-elemen laman blog ini

22

Bab2MengaturTampilanBlogspot
akan ditampilkan sesuai dengan strukturnya yang dapat diatur
melalui tata letak (layout) blog.

2.3.1 Tata Letak Elemen Laman

Tata letak berfungsi untuk mengatur struktur tampilan blog. Caranya
dengan menambah gadget, menghilangkan gadget, ataupun mengatur letak gadget.
Praktek: Memindahkan elemen Blogger
1. Masuk ke dalam kustomisasi blog lalu klik tab Tata Letak lalu
Elemen Laman.

2. Di bawah ini tampilan awal tata letak blog.

3. Klik dan geser (drag and drop) elemen Pengikut dari bagian
kanan ke bagian tengah atas.

23

BukuPintarBlogspot
4. Gambar di bawah ini adalah tata letak blog setelah elemen
Pengikut dipindahkan. Simpan konfigurasi yang baru dengan klik
tombol SIMPAN.

5. Anda dapat melihat tampilan blog sesudah elemen Pengikut

dipindahkan.

Sesudah elemen Pengikut (Followers) dipindahkan

2.3.2 Menambahkan Gadget

Gadget (widget) merupakan komponen (aksesori) blog yang digunakan untuk keperluan tertentu. Ada gadget yang digunakan untuk
mengolah polling, menampilkan slide gambar, menampilkan daftar
link, dan masih banyak lagi jenis gadget yang lain.
Tentu saja kita harus pandai-pandai memilih gadget yang akan
digunakan untuk blog. Jika terlalu banyak gadget, blog Anda akan
terlihat terlalu ramai. Bandwidth juga lebih besar sehingga blog baru
terbuka setelah cukup lama melakukan loading. Sedangkan jika
terlalu minimalis, bisa jadi blog Anda akan terlihat kurang menarik.

24

Bab2MengaturTampilanBlogspot
Praktek: Memasang Gadget Baru (Polling)
1. Masuk ke dalam tab Tata Letak > Elemen Laman.
2. Klik link Tambah Gadget di mana Anda akan memasukkan
gadget. Pada contoh ini, Penulis akan membuat gadget polling di
bagian kanan.

3. Pada gadget Polling, klik tombol

dalam blog.

untuk menambahkannya ke

4. Tuliskan polling (survei) yang akan Anda buat.

Ketikkan pertanyaan dan pilihan-pilihan jawaban yang akan
digunakan pada polling. Secara default, polling akan aktif selama
seminggu (7 hari). Anda dapat mengaturnya dengan mengubah
Tanggal dan waktu penutupan jajak pendapat. Setelah itu, klik
tombol SIMPAN.

25

BukuPintarBlogspot

5. Maka akan muncul gadget baru di bagian kanan atas blog.

Gadget baru (Polling) dilihat pada bagian kustomisasi blog

Gadget baru (Polling) dilihat pada halaman blog

26

Bab2MengaturTampilanBlogspot
6. Buka halaman blog lalu coba gunakan polling untuk mengetesnya.

2.3.3 Menemukan Gadget yang Sesuai

Dalam Blogger sendiri, terdapat banyak jenis gadget yang dapat
Anda tambahkan. Saking banyaknya, Anda pasti akan kesulitan
sendiri jika harus melihat atau mencoba gadget satu per satu. Untuk
mengatasinya, Anda dapat memanfaatkan fasilitas pencarian gadget.
Praktek: Pencarian Gadget
1. Pada contoh ini, akan dilakukan pencarian dan pemasangan
gadget di bagian bawah. Untuk itu, buka tab Tata Letak >
Elemen Laman. Klik link Tambah Gadget.

27

BukuPintarBlogspot
2. Koleksi gadget pada Blogger dikategorikan menjadi empat
kriteria, yaitu Dasar-Dasar, Unggulan, Paling Populer, dan
Gadget Lainnya.
Kategori
DasarDasar
Unggulan
PalingPopuler
GadgetLainnya

Keterangan
Gadgetdasaryangdibutuhkanpemilikblogberbagai
kalangan
Gadgetyangdiunggulkandanbergunauntukblog
tertentu
Gadgetyangpalingpopuler(banyakdigunakan)
Gadgetlainselainketigakategoridiatas

3. Selain dengan melihat-lihat gadget apa saja yang ada dalam

setiap kategori, Anda juga dapat mencarinya sendiri. Caranya,
ketikkan melalui kotak pencarian, misalnya facebook, lalu klik
tombol .

4. Maka semua gadget yang berhubungan dengan Facebook akan

ditampilkan. Pada contoh ini Penulis tertarik dengan gadget
Sociable. Untuk itu, klik tombol
pada gadget Sociable untuk
menambahkan gadget tersebut ke dalam blog.

28

Bab2MengaturTampilanBlogspot

5. Atur konfigurasi situs apa saja yang akan digunakan. Setelah itu,
klik tombol SIMPAN untuk menggunakannya di dalam blog.

6. Maka, di bagian bawah halaman blog akan muncul kumpulan

situs Sociable yang dapat digunakan untuk membagi (sharing)
informasi dari posting blog. Pada contoh ini, Penulis ingin
membagikan posting ke dalam Facebook. Untuk itu, klik tombol
.

7. Anda dapat menulis komentar lalu klik pada tombol Share.

29

BukuPintarBlogspot

2.3.4 Menghapus Gadget dari Blog

Gadget yang dipasang dapat dihapus kembali.
Praktek: Menghapus Gadget Blogger
1. Buka kustomisasi blog lalu klik tab Tata Letak > Elemen Laman.

2. Selanjutnya, klik link Edit pada elemen yang akan dihapus.

Misalnya elemen Sociable.

3. Klik tombol HAPUS.

4. Klik tombol OK pada halaman jendela konfirmasi. Maka gadget

akan dihapus dari halaman blog.

30