Pengikut

Blogsome : Add Header

Trik memasang header memang laris untuk menyiasati tampilan blog secara instan. Bila di blogger kita sudah sempat membahasnya (baik dengan mode layout maupun template) maka akan lebih adil lagi bila pengguna blogsome juga diberi kesempatan yang sama. Cara ini juga tak menutup kemungkinan bisa digunakan pengguna wordpress di hostingan sendiri maupun yang sudha terinstal di komputer lokal, mengingat platform yang digunakan juga masih sama. Hanya yang digunakan disini adalah blogsome dengan platform wordpress lama.

Untuk pengguna Blogsome silahkan masuk log dengan membuka alamat URL blognya dan capai tautan login dibagian sidebar. Tautan ini biasanya beralamat di http://namablog.blogsome.com/wp-login.php. Atau untuk yang menginstal di komputer lokal akan beralamat di http://localhost/wp-admin.php.

Sesaat setelah berhasil masuk ke dashboard, hal yang pertama perlu kita siapkan adalah menyiapkan gambar untuk dipasang di bagian header. Ingat kan, kita akan memasang gambar sebagai header. Jadi syarat utama ini harus kita siapkan sebelumnya. Khusus untuk pengguna blogsome file gambar yang diperkenankan diunggah (upload) adalah jenis gambar berekstensi jpg, jpeg, gif dan png dan ukuranya tak lebih dari 300kb.

Bila gambar dalam keadaan siap dan siaga untuk diunggah, tuju bagian Upload.
Cari file gambar dibagian Browse, isi kolom Description bila perlu (kosongpun tak mengapa). Bila ada pilihan ciptakan thumbnail (Create Thumbnail), pilih No thanks(ini artinya kita mengabaikan pilihan, sekali lagi tak masalah). Setelah selesai akan ada konformasi File Uploaded! Your file headerku.jpg was uploaded successfully! Here's the code to display it: %lt;img src='/images/headerku.jpg' alt='' />. Salin alamat file ini.

Untuk menayangkan gambar sebagai header kita perlu mengedit bagian CSS. Tuju tab Manage dan pilih subtab Files, gulung ke bawah hingga menenujab opsi Site Style Sheet.Klik. Cari bagian #Header seperti berikut pada theme :

#header {
background: #3C5FA1;
border-bottom: double 3px #CFDEE1;
border-left: solid 1px #CFDEE1;
border-right: solid 1px #CFDEE1;
border-top: solid 1px #CFDEE1;
font: italic normal 40px Georgia,'Times New Roman', Times, serif;
margin: 0;
padding: 15px 10px 15px 60px;
}

tambahkan salinan alamat file tadi pada bagian CSS background-image: url(/images/headerku.jpg);
hingga lengkapnya menjadi :

#header {
background: #3C5FA1;
background-image: url(/images/headerku.jpg);
border-bottom: double 3px #CFDEE1;
border-left: solid 1px #CFDEE1;
border-right: solid 1px #CFDEE1;
border-top: solid 1px #CFDEE1;
font: italic normal 40px Georgia,'Times New Roman', Times, serif;
margin: 0;
padding: 15px 10px 15px 60px;
}
terakhir klik button update template!


Selesai.

Dan sebenarnya header kita sudah terpasang. Hanya saja blogsome perlu beberapa saat untuk membarui halaman CSSnya. Untuk itu ada baiknya pula kita buka alamat URL blog tadi di jendela perambah lainnya. Atau lebih baik lagi bila bisa dicek di komputer lain untuk mendapatkan cache terbaru. Ini terjadi karena Blogsome hanya menyediakan 5 kali suntingan pada tiap halaman. Jadi bisa dimaklumi bila gambar header tak langsung muncul saat kita klik tautan untuk View Blog.


Kabarkan ke teman blog ini

Free Tell-a-Friend by Bravenet.com

2 komentar:

  1. Anonim10:15 AM

    aku nyoba ganti header dengan ngikutin cara2 yang tertulis d sini mas, tapi gagal maning gagal maning =(

    apa karena layout satu dengan yang lain beda code ya mas??

    BalasHapus
  2. pro mei : code masing-masing layout memang beda, namun secara umum span atau class header digunakan. jadi cara boleh dibilang hampir sama.

    BalasHapus

Kamu bisa dapetin ilustrasi wajah yang sesuai dengan wajah kamu di moselo.com/Bikingemeys. Jangan lupa ada promo jika pesan dari aplikasinya langsung.

Postingan Populer