Postingan

Menampilkan postingan dengan label Desain Blog

Cara Pasang Daftar Posting Terbaru (Recent Post) di Sidebar Blog

Gambar
Cara Pasang Daftar Posting Terbaru (Recent Post) Simple & plus Gambar Thumbnail di Sidebar Blogger. DAFTAR Posting Terbaru (Recent Post, Latest Posts, Artikel Terbaru, Entry Terbaru) merupakan salah satu widget yang wajib dipasang di blog , untuk navigasi sekaligus link internal agar meningkatkan pageviews. Cara menampilkan widget posting terbaru bisa menggunakan widget bawaan blogger, yaitub Feed. Cara memasangnya: Klik Layout (Tata Letak) > Add a Gadget > pilih Feed Masukkan alamat blog Anda. Klik "Continue" Ubah judul widget menjadi "Recent Posts" atau "Posting Terbaru" Jika cara tersebut tidak berhasil, cara lain memasang widget recent post Simple di Sidebar Blog adalah sebagai berikut. Cara Pasang Daftar Posting Terbaru (Recent Post) Simple di Sidebar Blog Daftar Posting Terbaru ini, seperti gambar di atas, akan otomatis muncul di halaman dalam saja, karena halaman depan sudah tampil, jadi tidak ada judul posting terbaru double. Kode CSS Re...

Notifikasi Komentar Kembali Muncul di Dashboard Blogger

Gambar
SETELAH mengubah tampilan dashboard , lalu mengubah nama menu template menjadi theme (tema) , hari ini (20/3/2-17) Google Blogger menambah fitur baru berupa notifikasi komentar yang harus dimoderasi atau diapprove dan tidak Fitur ini sebenarnya mengembalikan fitur di dashboard lama. Rupanya banyak masukan kepada blogger untuk memunculkan kembali notifikasi komentar yang masuk, terutama bagi blogger yang punya blog banyak seperti CB. Ini penampian notifikasi komentar. Notifikasi Komentar yang Kembali Muncul di Dashboard Blogger tentu saja kabar baik dan menggembirakan bagi CB dan Anda yang punya banyak blog. Secara, sejak ada perubahan dashboard, kita harus mengecek satu per satu blog kita, untuk melihat ada tidaknya komentar yang masuk. Kini, blogger sudah mengembalikan fitur tersebut, berupa icon comments dengan title text "comments awaiting  moderation" seperti dulu, namun dengan tampilan seperti dalam gambar di atas. Semoga ke depan blogger lebih baik dan kita yakin teru...

Blogger Mengubah Menu Template Jadi Theme (Tema)

Gambar
Blogger Mengubah Menu Template Jadi Theme (Tema). Semua istilah TEMPLATE diubah menjadi TEMA. SAYA tidak menemukan menu/link Template , di mana ya? Demikian pertanyaan yang muncul dari blogger baru yang belum tahu atau belum ngeh  ada perubahan nama Template menjadi Theme (Tema) di Dashboard Blogger. Soalnya, kebanyakan tips desain blog ada perintah "Klik Template > Edit HTML" untuk mengubah atau memasukan kode ke dalam template blog. Demikian pula saat akan Mengganti Template Blog  dan menonaktifkan template mobile bawaan blogger menjadi Tema > Pilih Tema Seluler -- tadinya Template > Pilih Template Seluler. Seingat CB, perubahan nama menu Template menjadi Theme di dashboard baru terjadi awal Maret 2017. Laman Bantuan Blogger juga sudah menggunakan kata tema . Setting untuk Template/Tema Blogger Responsive. Bagi Anda yang sudah bepengalaman di dunia blogging, khususnya yang pernah atau masih ngeblog di WordPress , tentu saja perubahan ini bukan hal yang mengagetka...

2 Menu Navigasi Blog Responsive Dropdown + Media Sosial Tanpa Javascript

Gambar
2 Menu Navigasi Blog Responsive Dropdown + Media Sosial Tanpa Javascript. Fast Loading! Berikut ini kode 2 Menu Navigasi Blog Responsive Dropdown + Media Sosial Tanpa Javascript. Yang satu topbar menu atau menu di atas header. Satunya lagi Main Menu yaitu menu utama di bawah header. Kedua kode menu navigasi buat blogger yang responsive plus dropdown plus link media sosial ini tanpa javascript sehingga ringan, fast loading, tidak membebani loading blog, dan anti-error. Cocok dipasang di template blogger biasa ataupun jenis template blog AMP . Top Menu dan Main Menu Responsive Dropdown plus Media Sosial Link yang menggunakan Javascript sudah dishare di posting sebelumnya: Dua Menu Responsive Blogger . KODE MENU TOP / TOPBAR MENU CSS Top Menu Blogger Simpan di atas kode ]]></b:skin> #menutop{width:100%;margin:0 auto;height:45px;background:#fff;border:1px solid #e9e9e9;max-width:950px;z-index:9999} #menutop ul,#menutop li{margin:0;padding:0;list-style:none;} #menutop ul{...

Menghapus "Diberdayakan oleh Blogger" Melanggar Aturan Google?

Gambar
Apakah Menghapus "Diberdayakan oleh Blogger" - Powered b Blogger Melanggar Aturan Google? ADA pertanyaan "menggelik" dari blogger newbie: apakah Menghapus Atribusi "Diberdayakan oleh Blogger" (Powered by Blogger) di Footer Blog Melanggar Aturan Google? Jawabannya, tidak melanggar atau bukan pelanggaran. Alasannya, seperti diobrolkan para blogger di Product Forum Google , soal atribusi Powered by Blogger atau Diberdayakan oleh Blogger itu sama sekali tidak disebutkan dalam Kebijakan Konten ataupun kebijalan blogger lainnya. Yang tidak boleh itu menghapus Credit Link desainer template gratis, karena melanggar hak cipta, dan bisa diadukan oleh sang desainer ke DMCA Google . Yang juga tidak boleh dilakukan antara lain Copy Paste tanpa menyebutkan sumbernya. Banyak lho postingan CB yang dicopas blogger lain, tapi kalo menyebutkan sumber, tidak masalah. Google, dikabarkan The Verge , menerima puluhan juta permintaan penghapusan konten yang melanggar hak cipta...

Cara Memasang Kode CSS, HTM, dan Javascript di Template Blogger

Gambar
Cara Memasang Kode CSS, HTM, dan Javascript di Template Blogger. POSTING ini panduan untuk pemula dalam memasang kode-kode yang membangun template blogger, yakni CSS, HTML, dan Javascript. JavaScript (JS) adalah bahasa pemrograman tingkat tinggi dan dinamis. JavaScript populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera. KodeJavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT. CSS adalah singkatan dari Cascading Style Sheets. CSS adalah sebuah dokumen yang digunakan untuk mendesain atau mengatur tampilan tata letak sebuah halaman web/blog kita. HTML adalah singkatan dari HyperText Markup Language. HTML adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terinteger...

Masih Banyak Blogger Menampilkan Teks Tulisan Rata Kiri-Kanan (Justify)

Gambar
Format teks perataan “rata kiri kanan” (justify) menyalahi standar penulisan di website. Harusnya rata kiri (align-left). MASIH banyak blogger yang menampilkan teks tulisan (posting) dengan text-align rata kiri-kanan ( justify/justified ). Padahal, salah satu ciri format posting blog yang baik itu rata kiri. CB sudah bahas soal ini di Gunakan Rata Kiri di Posting Blog Anda . Memang, rata kiri-kanan membuat tampilan teks tulisan menjadi rapi. Tapi, rata kiri-kanan itu bukan standar penulisan di website. Word Wide Web Concortium (W3C) sudah lama menegaskan, standar penulisan di website, media online, atau situs web itu rata kiri. Lihat saja format teks di Facebook, Twitter, atau di media-media online seperti CNN, BBC, Detik, Kompas, Republika, atau bahkan Google sendiri di halaman hasil pencariannya menggunakan rata kiri. Alasan utama penulisan teks atau posting blog harus rata kiri adalah karena rata kiri ( align left ) lebih mudah dipindai ( scannable ) dan mudah dibaca ( readable )....

Mengatasi Ringkasan Auto Readmore yang Tidak Muncul

Gambar
Mengatasi Ringkasan Auto Readmore yang Tidak Muncul di Halaman Depan Blog. BARUSAN , sebelum menulis posting ini, CB lagu desain template baru. Tiba-tiba ringkasan posting halaman depan (auto readmore) tidak muncul. CB cek blog lain, ada yang masih muncul, ada yang tidak muncul alias hilang. Eh... blog CB ini juga mengalami nasib yang sama!  Ringkasan Auto Readmore Tidak Muncul.* Ringkasan Auto Readmore Muncul Normal.* Ternyata, blog lain, misalnya blog Masyadi dan blog Kang Mousir, juga mengalami nasib yang sama, yaitu  ringkasannya kosong alias tidak muncul, hanya judul doang, seperti dalam screenshot berikut ini. Apa pasal? Ternyata, masalahnya adalah kode snippet bawaan blogger yang entah sedang error atau memang sudah tidak berfungsi mulai hari ini, Kamis (16/2/2017), yaitu kode  <data:post.snippet/>  Jadi, semua blog yang menggunakan Auto Readmore tanpa JavaScript akan mengalami hal yang sama, setidaknya saat CB cek sebelum menulis posting ini. Beri...

Cara Membuat Navigasi Menu Responsive Keren untuk Blogger

Gambar
Cara Membuat Navigasi Menu Responsive Keren untuk Blogger . KALI ini CB share lagi Cara Membuat Navigasi Menu Responsive Keren untuk Blogger, melengkapi tips desain blog sebelumnya tentang Navigasi Menu Mobile-Friendly . Tampilannya seperti gambar di bawah ini. Keren 'kan? Demo selengkapnya bisa dicek di sumber . Langkah pertama ada masuk dulu ke kode xml template blog Anda: Template > Edit HTML. Setelah itu pasang kedua kelompok kode navigasi menu responsive untuk bloggr berikut ini. KODE CSS & JAVASCRIPT   MENU RESPONSIVE Simpan di atas kode  </head> <style> @import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro); #cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a, #cssmenu #menu-button {   margin: 0;   padding: 0;   border: 0;   list-style: none;   line-height: 1;   display: block;   position: relative;   -webkit-box-sizing: border-box;   -moz-box-sizing: border-box;   box-sizin...

Pengertian Template Blog Responsive - Mobile Friendly

Gambar
Pengertian Template Blog Responsive - Mobile Friendly - Ramah Perangkat Mobil alias HP/Smartphone. Template blog saya sudah responsive belum? Blog saya sudah responsive? Demikian pertanyaan yang muncul dari blogger "newbie", setidaknya blogger yang belum paham atau belum tahu apa arti sebenarnya template responsif. Template blog responsive adalah desain tampilan blog yang ukurannya mengikuti lebar dan tinggi perangkat ( device ) yang digunakan untuk membukanya, dalam hal ini perangkat mobile (mobile devices) alias SmartPhone aka HandPhone (HP). Template, blog, atau website responsive disebut juga situs yang ramah mobil ( mobile-friendly ). Responsive menjadi salah satu faktor SEO penting sehingga blog disukai mesin pencari ( seo friendly ) dan disukai pengguna ( user friendly ). Cara Mengetahui Template Blog Responsive Google sudah menyediakan halaman khusus untuk mengecek apakah blog atau website kita responsive apa belum, yaitu Mobile-friendly test . Buka link tersebut, mas...

7 Tips for Making Your Website Friendlier to Smartphone Users

Gambar
7 Tips For Making Your Website Friendlier To Smartphone Users . Guest Post by  David Wicks. WHAT do you do when looking for an item or an unknown location? You Google, right? Just like you do, there are a billion other people around the world who Google for information on products and services and almost all these online searches are done using smartphones and/or tablets. You know what this means; for your practice to be read and for you to generate convertible leads, your website must be responsive to these different devices.  The leading search engine, Google has even mentioned that mobile readiness or responsiveness of a website is important in ranking. Therefore, your site should be navigable and easily accessible on a mobile phone. 7 Tips for Making Your Website Friendlier to Smartphone Users Desktops have been outstripped by mobile devices and you should implement the following strategies for your site to be reached: 1. Use simple content Bulky content is agonizing ...

Cara Memasang Featured Posts Image Slider Otomatis Responsive di Blogger

Gambar
Cara Memasang Featured Posts Image Slider Otomatis Responsive di Blogger . WIDGET Featured Posts Image Slider atau slider berisi featured post plus gambar responsive (mobile-friendly) ini cocok untuk blog toko online ( Lihat DEMO ). Misalnya, untuk menampilkan promo, diskon, atau produk unggulan. Featured Post Image ini bisa menampilkan posting per label/kategori, juga posting terbaru. Berikut ini fiturnya Featured posts slider is an advanced widget equipped with these features: Author Avatar - Unique! Displays recent posts dynamically inside Slider. - Unique! Displays recent posts from a specific category/label. Slider with two animations: Slide & Fade - Unique! Clickable Comments Count Custom Date Format Clickable Animated Featured Image Thumbnails Option to increase or decrease Image Resolution for quality- Unique! Support for Third-party Images and YouTube Video thumbnails - Unique! Title Length is adjustable Cara Memasang Featured Posts Image Slider Otomatis Responsive di Blo...