Postingan

Menampilkan postingan dengan label Desain Blog

Menghilangkan Navbar Blogger (Blogspot)

Gambar
Navbar pada blogger (blogspot) ialah baris navigasi blog yang terletak melayang pada tampilan halaman blog paling atas dan selalu tampil di setiap membuka halaman blog blogger (blogspot). Kadang tampilan seperti ini tidak diinginkan dalam mendesain sebuah blog. Maka untuk menghilangkannya navbar blogger (blogspot), berikut ini ialah langkah-langkahnya : Masuk ke halaman dashboard blogger (blogspot). Kemudian pilih menu tata letak (layout). Lanjutkan dengan memilih elemen Navbar pada tata letak halaman blog. Pilih pengaturan navbar menjadi " Off ". Klik simpan ( save ). Tinjau ulang tampilan halaman blog. Selesai.

Menampilkan File Google Drive Pada Blog / Website

Gambar
Google Drive sangat berguna apabila sebuah website/blog ingin menampilkan ( embed ) sebuah/beberapa file dalam artikel/halaman website/blog untuk dibaca ataupun dilihat/diunduh oleh pengunjung website/blog. Langkah pertama yang dilakukan ialah dengan menggugah ( upload ) file yang akan dibagi ( share ) ke Google Drive. Sebagai informasi, Google Drive mengakomodasi file apa saja selama tidak mengandung virus. Langkah selanjutnya ialah sebagai berikut : Pilih (centang) file yang akan dibagi ( share ) dalam Google Drive, kemudian klik pilihan menu More --> Share --> Share . Kemudian akan muncul pengaturan berbagi file dan link berbagi ( share ) sebagai berikut : Kemudian ubah akses file Google Drive di atas menjadi public Sehingga menjadi seperti ini, kemudian kopi link yang disediakan Google Drive. Untuk menampilkan ( embed ) file Google Drive : Perhatikan link yang telah dikopi : https://drive.google.com/file/d/0B-wrkvPrI0SQM1RiandKXzVuM2M/edit?usp=sharing Untuk menampilkan ( em

Membuat Link Download Google Drive Pada Blog / Website

Gambar
Google Drive sangat berguna apabila sebuah website/blog ingin membagikan ( share ) sebuah/beberapa file dalam artikel/halaman website/blog untuk diunduh/di- download pengunjung website/blog. Langkah pertama yang dilakukan ialah dengan menggugah ( upload ) file yang akan dibagi ( share ) ke Google Drive. Google Drive mengakomodasi file apa saja selama tidak mengandung virus. Kemudian langkah selanjutnya ialah dengan mengubah pengaturan berbagi ( share ) file dalam Google Drive sebagai berikut : Pilih (centang) file yang akan dibagi ( share ) dalam Google Drive, kemudian klik pilihan menu More --> Share --> Share . Kemudian akan muncul pengaturan berbagi file dan link berbagi ( share ) sebagai berikut : Kemudian ubah akses file Google Drive di atas menjadi public . Sehingga menjadi seperti ini, kemudian kopi link yang disediakan Google Drive. Untuk membuat link download dari google drive : Perhatikan link yang telah dikopi : https://drive.google.com/file/d/ 0B-wrkvPrI0SQM1RiandK

Membuat Gadget/Widget Menu Tab Blogger (Blogspot)

Gambar
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

Membuat Daftar Isi Otomatis Akordion Berdasar Label Blogger (Blogspot)

Gambar
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

Membuat Daftar Isi Otomatis Berdasar Label Blogger (Blogspot)

Gambar
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.

Menghilangkan Link Langganan Entry Atom Blogger (Blogspot)

Gambar
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.

Membuat Tombol Kembali Ke Atas Melayang di Pojok Kanan Bawah Blogger (Blogspot)

Gambar
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

Membuat Tombol Facebook follow, Twitter, G+, Pinterest Horizontal Segaris Blogger (Blogspot)

Gambar
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

Membuat Daftar Artikel Terkait di Bawah Halaman Artikel Blogger (Blogspot)

Gambar
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

Membuat Tombol Facebook like, Twitter, G+, Pinterest Horizontal Segaris Blogger (Blogspot)

Gambar
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

Membuat Navigasi Breadcrumb Blogger (Blogspot)

Gambar
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&

Membuat Judul Halaman Blog Dinamis Blogger (Blogspot) Untuk Optimasi Mesin Pencarian

Gambar
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

Mengganti Favicon Blogger (Blogspot)

Gambar
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.