Desain Blog Mudah

Gadget/Widget Tab Blogger (Blogspot) sangat berguna untuk mempercantik tampilan blog yaitu untuk menyatukan tata letak beberapa gadget/widget menjadi satu lokasi dengan navigasi menu tab horizontal. Hal ini dapat meringkas tampilan beberapa gadget/widget blog/website menjadi satu gadget/widget dengan menu tab horizontal. Berikut ialah langkah-langkah membuat gadget/widget menu tab blogger (blogspot) : Buka dashboard blogger (blogspot). Pilih menu tata letak ( layout ). Buat gadget/widget html baru dan letakkan di atas gadget/widget yang akan disembunyikan/diringkas dalam menu tab. Masukkan kode berikut pada gadget/widget html yang baru dibuat : <style type='text/css'>.tabber{padding:0!important;border:0 solid #bbb}.tabber h2{float:left;margin:0 1px 0 0;font-size:12px;padding:3px 5px;border:1px solid #bbb;margin-bottom:-1px;overflow:hidden;position:relative;background:#f5f5f5;cursor:pointer;-moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}html .tabber h2.active{ba...

Daftar isi otomatis akordion berdasar label merupakan tampilan daftar isi blog/website yang indah dan dinamis untuk ditampilkan. Untuk membuatnya, maka berikut ialah langkah-langkahnya : Masuk halaman dashboard blogger (blogspot). Pilih menu template. Pilih edit html. Pastikan blog/website sudah terdapat kode untuk memuat jQuery dengan cara mencari (tekan Ctrl + F pada teks kode html) kode berikut di elemen html blog/website : <script src='//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'/> Jika belum terdapat kode di atas pada elemen html blog/website, maka masukkan kode di atas sebelum kode </head> html. Klik simpan ( save ). Pilih menu halaman dan buat halaman statis ( blank page ) baru. Beri judul halaman statis blog/website. Pilih tab html dan masukkan kode berikut : <style type="text/css">#daftar-isi{background-color:#333;border:2px solid #fafafa;color:#fff;margin-bottom:10px;-webkit-box-shadow:0 1px 2px #000;-moz-box-shadow:0 1px ...

Daftar isi otomatis berguna untuk membuat sitemap (peta situs) maupun arsip blog berdasarkan label. Daftar isi otomatis berdasarkan label blogger (blogspot) juga menambahkan keterangan bilmana suatu artikel merupakan artikel baru, sehingga memudahkan pembaca/pengunjung mengetahui artikel terbaru blog/website. Langkah-langkah membuat daftar isi otomatis berdasar label blogger (blogspot) antara lain : Buka dashboard blogger (blogspot). Kopi kode berikut : <script src="https://sites.google.com/site/vikrymadzblogspotcom/vikrymadz/daftarisi.js"></script><script src="http:// desainblogmudah.blogspot.com /feeds/posts/default?max-results=99999&alt=json-in-script&callback=loadtoc"></script> Paste kode di atas pada widget/gadget maupun halaman statis blog/website. Sesuaikan kode berwarna kuning di atas dengan url domain blog/website. Klik simpan ( save/publish ). Muat ulang halaman blog/website. Selesai.

Link Langganan Entri Atom biasanya terdapat di bawah halaman isi artikel yang berfungsi untuk memudahkan pembaca/pengunjung berlangganan artikel dari blog/website. Untuk menghilangkan link langganan entri atom, maka berikut ialah langkah-langkahnya : Masuk ke dashboard blogger. Pilih menu template. Pilih edit html. Letakkan kursor pada kode teks html. Cari (tekan Ctrl + F) kode berikut :     <!-- navigation -->     <b:include name='nextprev'/>     <!-- feed links -->     <b:include name='feedLinks'/> Hapus kode berwarna kuning di atas (kode  <b:include name='feedLinks'/>). Klik simpan ( save ). Muat ulang halaman artikel blog/website. Selesai.

Jika halaman pada suatu blog/website sangatlah panjang, maka ada baiknya untuk memasang tombol kembali ke atas ( back to top ) untuk memudahkan navigasi pengunjung/pembaca blog/website kembali ke tampilan halaman atas blog/website. Tombol kembali ke atas ( back to top ) berada pada lapisan ( layer ) paling atas tampilan blog/website dan bergerak mengikuti tampilan/kursor halaman yang sedang dibaca pengunjung blog/website. Apabila tombol kembali di atas ( back to top ) di-klik di tampilan halaman blog/website mana saja, maka tampilan halaman blog/website akan bergulir menuju tampilan halaman blog/website paling atas (tampilan awal saat membuka halaman blog/website). Langkah-langkah untuk membuat tombol kembali ke atas ( back to top ) antara lain : Buka halaman dashboard blogger (blogspot). Pilih menu tata letak ( layout ). Tambahkan widget/gadget html baru (atau bisa digabungkan dengan widget/gadget html yang sudah ada yang disukai). Kopikan kode berikut pada widget/gadget html : <a ...

Tombol facebook follow, twitter, google plus dan pinterest berfungsi untuk menyediakan fasilitas bagi pembaca/pengunjung blog/website untuk mengikuti ( follow ) blog/website melalui social media populer di atas. Hal di atas bermanfaat utnuk memperluas/memopulerkan blog/website di social media. Untuk membuat tombol facebook follow, twitter, google plus dan pinterest horizontal segaris, maka langkah-langkahnya ialah sebagai berikut : Buka dashboard blogger (blogspot). Pilih menu template. Pilih edit html. Letakkan kursor pada teks kode html. Cari (tekan Ctrl + F) kode berikut : </body> Pastikan sudah terdapat kode berikut sebelum kode </body> : <script async='true' src='//connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/><script async='true' src='//platform.twitter.com/widgets.js' type='text/javascript'/><script async='true' src='//assets.pinterest.com/js/pinit.js' type='text/j...

Daftar artikel terkait di bawah halaman artikel blog/website berguna untuk navigasi halaman-halaman artikel terkait dengan halaman artikel yang sedang dibuka pembaca blog/website setelah selesai membaca seluruh isi artikel yang dibuka pembaca blog/website. Daftar artikel terkait di bawah halaman artikel bertujuan untuk membuat betah pembaca pada blog/website yang dibuka sehingga pembaca blog/website tertarik untuk membuka halaman-halaman artikel lainnya yang terkait dengan halaman artikel yang sedang dibuka pembaca blog/website. Daftar artikel terkait di bawah halaman artikel juga betujuan untuk menaikkan durasi waktu kunjungan rata-rata pembaca di blog sehingga hal tersebut juga turut menaikkan ranking halaman artikel blog/website pada mesin pencarian. Selain itu, daftar artikel terkait di bawah halaman artikel juga dimaksudkan untuk menurunkan bounce rate (rasio pentalan) yaitu rasio dimana pengunjung blog/website langsung menutup halaman artikel yang telah dibaca tanpa membuka hala...

Tombol facebook share, facebook like, facebook send, Twitter Tweet, Google Plus dan Pin it Pinterest dalam suatu blog/website berguna/berfungsi untuk memudahkan pemilik blog/website maupun pembaca membagikan artikel yang direkomendasikan (disukai) pada blog/website. Tombol facebook share, facebook like, facebook send, Twitter Tweet, Google Plus dan Pin it Pinterest juga berfungsi untuk memperluas penyebaran link kita di media sosial sehingga dapat menaikkan ranking blog/website dikarenakan memperoleh banyak backlink / inbound link (link dari website lain menuju blog/website penulis) dari website papan atas (website pagerank tinggi) sehingga menaikkan ranking pencarian blog/website pada mesin pencarian. Lalu bagaimanakah menambah/membuat facebook share, facebook like, facebook send, Twitter Tweet, Google Plus dan Pin it Pinterest pada blog/website? Berikut ialah langkah-langkahnya : Buka dashboard blogger (blogspot). Pilih menu template. Pilih edit html. Cari (tekan Ctrl + F) kode ber...

Navigasi breadcrumb ialah navigasi halaman blog yang biasanya dipasang di bawah ataupun di atas judul artikel blog yang berfungsi untuk menunjukkan direktori (alamat) dimana halaman artikel disimpan. Cara (langkah-langkah) membuat navigasi breadcrumb antara lain : Buka halaman dashboard blogger (blogspot). Pilih template. Pilih edit html. Cari (tekan Ctrl + F) kode berikut : <b:includable id='post' var='post'> Kemudian cari lagi (tekan Ctrl + F) di bawah kode di atas, kode berikut :  <div class='post-header'>     <div class='post-header-line-1'/>     </div> Ubah kode di atas menjadi kode berikut :  <div class='post-header'>     <div class='post-header-line-1'>     <b:if cond='data:blog.homepageUrl == data:blog.url'><b:else/><b:if cond='data:blog.pageType == &quot;item&quot;'><div class='breadcrumbs'><a expr:href='data:blog.homepageUrl...

Judul halaman merupakan salah satu parameter mesin pencarian dalam menampilkan hasil pencarian berdasar kata kunci pencarian. Mesin pencari akan mencari judul yang paling relevan dengan kata kunci pencarian. Maka dari itu, pemilihan judul halaman blog menjadi faktor penting yang perlu diperhatikan dalam optimasi mesin pencarian. Terdapat beberapa macam format judul halaman blog, di antaranya ialah judul halaman saat di halaman utama ( homepage ) dan juga judul halaman ketika ada di halaman artikel. Sedangkan gambar di bawah ialah contoh judul halaman artikel suatu blog yang belum dioptimasi untuk kata kunci pencarian 'hide and minimize of image'. Optimasi judul halaman artikel blog secara dinamis untuk mesin pencarian : Contoh gambar di atas ialah contoh halaman artikel blog yang sudah dioptimasi untuk mesin pencarian. Format-format judul halaman artikel yang dapat dijadikan sebagai optimasi mesin pencarian antara lain : "Judul Artikel | Nama Blog" "Judul Artikel...

Favicon ialah sebuah ikon dari sebuag blog (website). Ikon ini akan selalu tampil di tab browser setiap halaman blog yang dibuka. Jika belum diganti, favicon blogger (blogspot) ialah ikon google blogger. Untuk mengganti Favicon, berikut ialah langkah-langkahnya : Buka dashboard blogger (blogspot). Buka menu tata letak (layout). Buka tata letak favicon blogger (blogspot). Pilih icon yang akan diunggah. Pilih simpan ( save ). Tinjau ulang tampilan halaman. Selesai.