tips mengedit kode html di blogger

Bagi para pemula blogger kayak saya yang memulai semua dari enul, Belajar blog yang cukup bikin otak bureng mata pening adalah kala mengedit kode HTML. Dalam mengedit kode HTML dibutuhkan ketelitian dan kehati-hatian yang disertai kesabaran. Tapi sebenarnya jika memang sungguh-sungguh edit kode HTML itu bukanlah hal yang meyeramkan melainkan menyenangkan. Tapi bagi saya kode HTML teteplah jadi momox, sebagai orang awam saya kadang bisa dengan mudah edit kode HTML tapi juga kadang pakek lama, berikut adalah Tip-Trik Edit kode HTML yang saya kira aman dan mudah untuk acara edit HTML.


1. Back-up dulu sebelum mengedit .


Sebelum mengedit template Anda, Anda mungkin ingin menyimpan sebuah salinan dari template tersebut.download template lengkap Tulisan ini mengingatkan kita agar mengkopi dulu sebelum mengedit anda bisa mengkopi dengan dengan mendownloadnya atau mengkopi secara manual dengan crtl+A klik kanan copy paste di notepate ato di word. Hal ini di maksudkan untuk berjaga- jaga dan siaga dalam menghindarkan diri dari hal-hal yang tidak diinginkan. Misalnya saja terjadi keerroran yang luar biasa dan anda pun kualahan untuk memperbaikinya, maka sate saja soallnya kita dah punya copianya jadi tinggal pasang aja dah beres seperti sedia kala.


2. Contreng pada bagian Expand Template Widget


Jika anda hendak membuat read more atau yang lainya, sebelum mengedit HTML anda perlu mencontreng kotak Expand template widget agar anda bisa mendapati kode-kode yang hendak anda ganti. Jika anda tidak mencontreng terlebih dulu mustahil anda bisa menemukan kode yang anda cari.


3.Gunakan menu edit kemudian pilih sub menu find on this page atau gunakan tombol ctrl+F dan masukan kode yang ingin di cari, cara ini adalah cara mempermudah dan mempercepat pencarian kode yang anda cari.


4. Jika proses edit anda bermasalah alias error maka pahami kesalahan anda dan perbaiki kesalahan tersebut, setiap ada kesalahan edit HTML dah pasti ada peringatan kesalahan bukan? Dari situ anda bisa tau letak kesalahan anda.


5. Jika memang sudah berusaha tapi tetap tak kunjung berhasil, janganlah terburu-buru putus asa tetaplah berusaha hingga keberhasilan benar-benar nyata.


Tip-trik edit kode HTML dari seorang awam mungkin cukup lima saja untuk tip yang lain silahkan cari referensi yang lain agar nuansa pengetahuan andapun juga semakin luas. Semoga yang sedikit dari orang awam ini bisa bermanfaat bagi yang membutuhkan saja. Postingan Tip- Trik Edit kode HTML ini saya masukan dalam label belajar blog bukan dalam label tip-trik ngeblog sampek puol karena ini saya anggap bagaian dari utak-utik blog.

Read More

Cara mengedit blogspot/blogger template agar SEO Friendly

Cara mengedit Blogspot agar SEO Friendly - Sepertinya juragan lagi tergila-gila buat belajar tentang SEO. Jadi kali ini postingnya juga masih tentang Tips SEO ( Search engine optimization ) * bener gak yah tulisannya hhe * . Postingan kali adalah kumpulan dari semua cara yang juragan ketahui tentang men-SEO-kan template blogger / blogspot kita. Jadi kalo ada yang kurang silahkan sobat-sobat blogger tambahkan ilmu yang sobat miliki melalui kolom komentar. Tutorial step by step mengedit template blogger / blogspot agar SEO Friendly ini adalah hanya salah satu cara untuk meningkatkan SERP ( apa itu SERP dapat sobat baca disini ). Nah dari pada sobat ketiduran ngedengerin ocehannya juragan yang gak jelas, lebih baik kita langsung membahas step by step Complete SEO Guide untuk blogger templates :

1. Page Title
Biasanya format page title dari blogger kan seperti ini : JUDUL BLOG : JUDUL POSTING, nah agar blog kita lebih disukai oleh google sehingga ujung-ujungnya blog kita jadi rame, kita harus merubah format page title standart itu menjadi seperti ini : JUDUL POSTING | JUDUL BLOG. Caranya cari kode berikut di EDIT HTML ( cara mudahnya di Mozilla tekan ctrl +f lalu copy paste kode dibawah ini):



Kalo udah dapet kodenya hapus n ganti dengan kode berikut ini :







Atau sobat juga bisa tambahin beberapa kata kunci ( keyword ) :







Ganti kode "kata kunci" dengan keyword yang sobat incar. Setelah semua selesai jangan lupa di save template

2. Meta keyword dan deskripsi
Suatu mesin pencari seperti google sangat menyukai sebuah website / blog yang jelas tema dan isi content-nya. Jadi , sobat harus nambahin suatu tag yang namanya meta tag. Caranya adalah dengan menambahkan kode berikut ini sebelum kode




Lalu ? ya di save aja

3. memasang Breadcrumbs.
Breadcrumbs adalah menu navigasi yang ada diatas sebuah posting atau artikel. Contohnya bisa dilihat diblog-nya juragan ini. Cara pasangnya juga sudah banyak dibahas di blog-blog guru blogging. Silahkan sobat cari di google dengan kata kunci “ cara membuat menu breadcrumbs”.

4. memasang Related Post.
Related post sangat bagus untuk SEO maupun buat pengunjung. Jadi pasang related post di blog sobat. Caranya sudah banyak dibahas di blog-blog para guru blogging. Silahkan sobat cari di google dengan kata kunci “ cara membuat related post di blogger”.

5. Mematikan setting archive ( arsip )
Lho ? buat apa juragan ? begini nih, seperti yang juragan bilang tadikan kalo google sangat membenci dengan yang namanya duplicate content. Jadi ketika kita mengaktifkan opsi arsip, misalnya kejadiannya seperti ini :
sobat membuat sebuah blog di blogger.com. lalu membuat 3 posting, 1 buah setiap hari. Maka di halaman utama atau homepage sobat akan ada 3 posting dan sebuah link arsip seperti ini, http://BLOGSOBAT.blogspot.com/2007_03_01_archive.html, pada halaman arsip tersebut akan memunculkan 3 posting yang sama dengan yang di munculkan oleh homepage.
Intinya, 2 buah link yang menuju 2 halaman yang berbeda tapi memiliki isi konten yang sama. Bagi search engine apa lagi google ini adalah masalah serius. Oleh karena itu kita sebaiknya me-non-aktifkan opsi arsip, caranya : setelah login klik tab setting >> Archiving >> pada bagian Archiving frequency ubah menjadi no archive. >> selesai simpan setting.

Atau jika tidak ingin menonaktifkan fungsi arsip, silahkan letakkan kode berikut dibawah kode :



6. Menambahkan kode ‘rel=canonical’
Gunanya kita menambahkan ‘rel=canonical’ adalah untuk menghindari konten ganda, karena seperti para master of SEO bilang bahwa google sangat tidak dapat mentolerir sebuah duplicate content ( *jadi buat yang kerjanya Cuma bisa copas hati-hati nih sebelum didepak dari gugel..xixixi*). Cara nya di edit html tambahkan kode berikut setelah kode



Save template dan selesai

7. Tag Heading
Google sangat menyukai sebuah tulisan atau judul dengan tag H1. Oleh karena itu ubahlah ukuran judul posting sobat dengan tag H1. Caranya cari kode berikut :

Kode yang dicetak tebal(warna orange) dihapus dan ubah dari h3(atau pada beberapa template menggunakan h2) menjadi h1. Setelah itu tambahkan kode berikut sebelum kode ]]>

h1.post-title, .post h1 #Blog1 h1, #Blog2 h1 { font-size:1.5em; }

Nah, jadi Cuma segitu yang juragan tau tentang bagaimana men-edit blogger template kita biar jadi lebih SEO Friendly. Silahkan dicoba , oia ampir lupa, lebih bagus lagi jika blog sobat dipasang read more nya. Tapi tidak juragan bahas karena rata-rata blogger sudah memasang read more-nya. Hmm, yang masih kurang ngerti silahkan Tanya melalui kolom komentar. Terima kasih sebelum dan sesudahnya.

Read More

Ciri-ciri website/blog yang disukai oleh google.

Belajar SEO blogspot - Tujuan utama seorang blogger sejati membuat blog sebenarnya dan seharusnya tentu agar disukai dan diminati para pengunjung. Akan tetapi seiring dengan kemajuan dunia pemblogger-an di Indonesia semakin banyak orang-orang dari yang master maupun hingga kaum awam memulai karirnya menjadi seorang blogger. Dan efeknya semakin banyaknya blog-blog yang bermunculan. Blog-blog tersebut hampir 80 % kualitas nya tidak kalah satu sama lainnya. Sedangkan 20 %nya lagi adalah blog-blog dummy yang tugasnya sebagai blog pendukung blog utama seorang blogger. Tidak heran, omnya para blogger/webmaster jadi pusing. Ya,om google , sadar atau tidak mulai kehilangan kualitasnya sebagai pusat pencarian terlengkap. Contohnya ketika kita mencari kata kunci “jurus SEO” ,bukannya mendapat sebuah website yang memberikan sebuah informasi yang kita butuhkan tetapi malah memunculkan blog-blog para peserta kontes SEO Indonesia yang akhir-akhir ini marak diselenggarakan.

Oleh karena itu, juragan pikir perlu juga kalo kita seharusnya mengetahui ciri-ciri blog yang disukai oleh google, agar tujuan utama kita sebagai blogger dan google sebagai mesin pencari untuk memberikan sebuah informasi yang benar-benar berguna untuk pengunjung atau visitor yang ribuan.

Berikut point-point yang harus diperhatikan agar blog-blog sobat juragan bisa lebih akrab ama si om, sukur-sukur bisa sampe di angkat jadi ponakannya. Hhe *tapi juragan lebih pingin diangkat jadi mantunya aja sich..xixixi *

1. Blog dengan susunan dan link teks yang jelas. Setiap halaman haruslah dapat dicapai paling sedikit dengan satu link teks yang statis.
2. Blog yang menawarkan site map kepada pengunjung dengan link yang langsung menuju kebagian penting dari blog sobat. Apabila dalam sitemap terdapat lebih dari 100 link, sebaiknya sobat pisahkan site map ke halaman yang berbeda.
3. Blog yang berisi informasi yang berguna, padat dan jelas serta secara akurat bisa menggambarkan konten website.
4. Carilah kata kunci yang memang banyak dicari orang lain.
5. Harus menggunakan teks, bukan gambar,jika ingin menampilkan nama,menjelaskan konten atau link. Google tidak akan mengenali teks yang ada dalam gambar.
6. Pastikan judul tag dan atribut yang sobat gunakan benar-benar akurat dan menggambarkan isi blog.
7. Rajin memerikasa apakah ada link yang mati atau kode HTML yang salah.
8. Apabila sobat menggunakan halaman dinamis (seperti URL yang mengandung tanda”?”),berhati-hatilah karena tidak setiap search engine dapat mengindeks halaman dinamis. Usahakan untuk membuat parameter sesingkat mungkin dan sedikit saja.
9.Pastikan jumlah link di blog/ atau website sobat dalam jumlah yang rasional.
semoga artikel kali ini bermanfaat bagi juragan sendiri dan kita semua, teruslah belajar untuk menjadi lebih baik lagi, dukungan pengunjung blog ini bagi juragan yang sedang belajar SEO blogspot ini agar menjadi lebih maik lagi dalam menulis artikel-artikel yang bermanfaat kepada sobat-sobat blogger. terima kasih.

Read More

Menambah Link Menu Blog

Memberi menu pada blog akan menampilkan performa blog terutama untuk navigasi yaitu berpindah dari satu bagian ke bagian lain dalam blog, biasanya satu bagian harus di-link dari halaman utama supaya pengunjung blog lebih mudah menemukan sesuatu yang dicari.

Tutorial kali ini akan menyajikan tombol teks sederhana yang biasanya diletakkan pada bagian header blog dan pada bagian akhir Anda bisa membuat tombol berbasis grafis.


Umpamanya saya akan menambahkan tombol "Home", "About" dan "Contack" pada bagian header blog (sebetulnya kita bisa memindahkan posisi ini dalam blog sesuai selera kita)

1. Siapkan link menu untuk ketiga menu diatas, contoh :
Home
About
Contack

kemudian dari masing-masing link yang sudah disiapkan, tambahkan "Class" menu (tombol menu) untuk setiap link sehingga menjadi

Home
About
Contack

2. Buka blog menggunakan nama 'user' dan 'password'
3. Masuk ke 'Tata Letak > Edit Html'
4. Masukkan kode dibawah ini sebelum kode


a.button1 {
background: #ff0000;
padding: 5px;
color: #ffffff;
}



Maksud Kode CSS diatas adalah : 1. Mendefinisikan Class Button 1 untuk tombol 'Home', 2. #ff0000 = menggunakan warna merah (RGB) dengan kode warna Hex, 3. Padding 5px adalah jarak antar menu (Home dan About) adalah 5 pixel, 4. color:#ffffff = menggunakan warna putih untuk teks pada menu.

untuk tombol berikutnya gunakan id class button seperti berikut ini :


a.button2 {
background: #ff0000;
padding: 5px;
color: #ffffff;
}

a.button3 {
background: #ff0000;
padding: 5px;
color: #ffffff;
}

Simpan atau klik "Terbitkan Entri", sampai disini hasilnya sudah bisa dilihat.

Kalo kita perhatikan, dari menu yang sudah dibuat jika di klik akan menuju ke link yang ditentukan namun ketika mouse mengenai daerah menu tersebut tidak ada efek dari perubahan gambar menu (biasanya pola warna/gambar), hanya icon mouse saja yang berubah menjadi icon mouse "Klik".

"Mouseover" adalah istilah untuk "event" atau kejadian pada saat mouse melintasi area tertentu (dalam hal ini tombol menu) dan area tersebut berubah warna atau berganti gambar. kita bisa memodifikasi warna saat mouse melintasi.

tambahkan kode berikut ini :


a.button1:hover {
background: #cccccc;
color: #ffffff;
}


Kode tersebut menunjukkan bahwa "button1" (yaitu home) akan berubah warna ketika mouse melintas dengan warna latar belakang "#cccccc" dan warna teks "#ffffff"

untuk dua kode berikutnya bisa ditambahkan seperti mendefinisikan button diatas, namun jika ketiga tombol tersebut penampilannya sama bisa dipersingkat menjadi :


a.button1:hover, a.button2:hover, a.button3:hover {
background: #cccccc;
color: #ffffff;
}

Read More