Cara Membuat Widget Label Blog Warna-Warni di Sidebar

Cara Membuat Widget Label Blog Warna-Warni di Sidebar

SETELAH berbagi tentang Widget Popular Posts Warna Warni dan Cara Mempercantik Widget Label, kali ini CB share kode label blog warna-warni. Penampakannya seperti ilustrasi posting ini.

Live Demonya bisa dilihat di sumber kode di bawah ini, yaitu di template blog Blogholic. Lihat sidebar paling bawah di widget Label Cloudnya.

Memasang widget label warna-warni bisa dikategorikan bagian dari memperindah tampilan blog sekaligus menarik pehatian dan ramah pengguna (user friendly). Karena, dengan label warna-warni ini, kategori posting blog kita mudah ditemukan.

Cara Membuat Widget Label Blog Warna-Warni di Sidebar

Langsung saja kita pasang:

1. Template > Edit HTML
2. Copy & Paste Kode CSS Label Cloud berikut ini di atas kode </b:skin> atau </style> 

/* Sidebar Label Cloud */
.sidebar .cloud-label-widget-content {margin:0; padding-left:20px!important;}
.sidebar .label-size a {color:#fff!important;background:#222;padding:8px 22px;margin:0 3px 3px 0;float:left;display:block;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
.sidebar .label-size-1 a {background:#FF8000}
.sidebar .label-size-2 a {background:#D7DF01}
.sidebar .label-size-3 a {background:#B40404}
.sidebar .label-size-4 a {background:#298A08}
.sidebar .label-size-5 a {background:#084B8A}
.label-size-1 a:hover, .label-size-2 a:hover, .label-size-3 a:hover, .label-size-4 a:hover, .label-size-5 a:hover {
background:#2288bb; color:#fff; text-decoration:none}
.sidebar .label-size span {
background:#2288bb;
color:#fff;
padding:8px 22px;
margin:0 0 3px;
clear:both;
float:left;
}
.sidebar .label-size {
position:relative;
text-transform: uppercase;
text-decoration:none;
font-size:16px;
font-family:'Oswald', sans-serif;
color:#fff;
}
.sidebar .label-size a, .sidebar .label-size a:visited {color:#fff;text-decoration: none;}

3. Save Template!

Kini kode CSS untuk Widget Label Blog Warna-Warni sudah terpasang dan akan muncul di Sidebar Blog Anda.

Catatan Penting

1. Warna latar (kode angka warna merah) bisa diubah lagi. Silakan rujuk Kode Warna HTML
2.  Kode di atas untuk menampilkan 5 LABEL saja.

Jika Label Blog Anda banyak, dan biasanya begitu, maka gunakan kode yang di bawah ini --menampilkan hingga 20 Label Warna-Warni.

KODE LABEL WARNA-WARNI BANYAK

/* Sidebar Label Cloud */
.cloud-label-widget-content {text-align: left;} .label-size {background: #83B4D8;display: block;float: left;margin: 0 3px 3px 0;color: #fff;font-family: Oswald, Arial, Sans-Serif;font-size: 11px;text-transform: uppercase;} .label-size:nth-child(1) {background: #F86D9E;} .label-size:nth-child(2) {background: #37C371;} .label-size:nth-child(3) {background: #10BBEA;} .label-size:nth-child(4) {background: #25CBFE;} .label-size:nth-child(5) {background: #963690;} .label-size:nth-child(6) {background: #A3195C;} .label-size:nth-child(7) {background: #545454;} .label-size:nth-child(8) {background: #F2A15F;} .label-size:nth-child(9) {background: #00FF80;} .label-size:nth-child(10) {background: #B7860B;} .label-size:nth-child(11) {background: #99CC33;} .label-size:nth-child(12) {background: #FFFF3D;} .label-size:nth-child(13) {background: #3FDECF;} .label-size:nth-child(14) {background: #FF2F0A;} .label-size:nth-child(15) {background: #E9DB58;} .label-size:nth-child(16) {background: #42FFBD;} .label-size:nth-child(17) {background: #6899ED;} .label-size:nth-child(18) {background: #FF52AE;} .label-size:nth-child(19) {background: #8DBC2F;} .label-size:nth-child(20) {background: #80FF00;} .label-size a, .label-size span { display: inline-block; color: #fff !important; padding: 4px 10px; font-weight: bold; } .label-size:hover { background: #222; } .label-count { white-space: nowrap; padding-right: 3px; margin-left: -3px; background: #333; color: #fff ; } .label-size:hover .label-count, .label-size:focus+.label-count { background-color: #FF6BFF; }

CARA PASANG WIDGET LABEL CLOUD

Langkah berikutnya adalah memasang widgel Label Cloud:
1. Layout > Add a Gadget > Pilih Label

2. Centang "Cloud" seperti ini:

3. Save! Simpan.

Demikian Cara Membuat Widget Label Blog Warna-Warni di Sidebar. Good Luck & Happy Blogging! (www.contohblog.com).*

Cara Mengatasi Error Saat Ganti Template Blog

Cara Mengatasi Error Saat Ganti Template Blog

BANYAK blogger, termasuk CB, kadang mengalami error atau gagal saat upload file untuk mengganti template blog, saat menggunakan cara normal ganti template.

Saat klik Template  ›  Backup/Restore › Upload a template from a file (XML) on your hard drive, tiba-tiba error, ada warning: We were unable to save your template.

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly. XML error message:
Content is not allowed in prolog.

Bagaimana cara mengatasinya?

Cara Mengatasi Error Saat Ganti Template Blog

Penyebab error kemungkinan koneksi internet terputus saat proses uploading, makanya jadi error. Solusinya: Coba Lagi. Ulangi langkah ganti template dari awal.

Jika masih gagal, coba sekali lagi. Jika masih  gagal juga, lakukan langkah berikut ini, dijamin sukses.

Namun, sebelumnya, lihat dulu panduan setting/instalasi templatenya. Biasanya ada di file "Documentaion". Jika tidak ada, maka lakukan langkah berikut ini:

1. Buka file template dengan Notepad
2. Buka Dashboard Blog. Klik "Edit HTML" di Dashboard Blog yang akan diganti template
3. Select All (Ctr+A) › Delet (Hapus Semua Kode Template Lama)
4. Buka lagi File Notepad tadi:
5. Select All (Ctrl+A) › Copy (Ctrl+C)
6. Kembali ke template, lalu Paste (Ctrl+V)
7. Save!

Beres dah!
Beberapa template premium justru cara pasangnya seperti itu, bukan upload.

Berikut ini gambarnya, sebagaimana panduan instal template Flat News di bawah ini

Buka & Copy File Template dengan Notepad

Klik Edit HTML

Paste File Template di Notepad

Demikian Cara Mengatasi Error Saat Ganti Template Blog disertai gambarnya biar jelas dan detail. Good Luck & Happy Blogging! (www.contohblog.com).*

Cara Mendapatkan Uang dari Video Youtube: Monetisasi & AdSense

Cara Mendapatkan Uang dari Video Youtube: Monetisasi & AdSense.

POSTING Cara Mendapatkan Uang dari Video Youtube alias Monetisasi & Google AdSense di Youtube ini lebih merupakan menyimpan catatan atau dokumentasi. 

Siapa tahu catatan bisnis online via Youtube ini berguna juga bagi Anda yang ingin mencoba meraih penghasilan dari Youtube, bukan cuma jadi penonton setia.

Untuk membuat video, saat ini sangat gampang. HP masa kini semuanya dilengkapi kamera foto dan video. Kita juga bisa membuat video melalui, misalnya, Windows Movie Maker.

Kita tidak perlu punya akun Google Adsense dulu untuk menghasilkan uang dari video Youtube. Jika sudah menjadi publisher Google Adsense, kita tinggal mengintegrasikan akunnya dengan iklan Youtube.

Popularitas Youtube

Sebelumnya, mari kita simak kekuatan Youtube sebagai media sosial berbagi video ini. Diperkirakan ada 1 miliar lebih pengguna aktif  bulanan YouTube.

Menurut data Alexa, Youtube merupakan situs terpopuler kedua di dunia setelah Google yang notabene pemilik Youtube. Bahkan, Mushroom Networks, Youtube juga menjadi mesin pencari terbesar kedua di dunia setelah Google --mengalahkan Bing dan Yahoo!

Menurut data eBizMBA, Youtube merupakan situs jejaring sosial terpopuler kedua di dunia setelah Facebook, mengungguli Twitter dan LinkedIn. 

Cara Mendapatkan Uang dari Video Youtube

Untuk memperoleh penghasilan dari Youtube, berikut ini ringkasan langkahnya:

1. Membuat Akun YouTube

Tentu saja harus punya akun Youtube dan promosikan di blog Anda lewat Widget Media Sosial. Untuk membuatnya, jika Anda sudah punya akun Gmail atau Blogger, tinggal buka tab baru dan ketik youtube.com lalu masuk (login/sign in) menggunakan akun gmail Anda saat ini.

2. Upload Video ke YouTube

Setelah memiliki akun Youtube, upload video asli buatan sendiri dan unik. Hindari video yang mengandung konten --misalnya musik-- yang melanggar hak cipta. Jika itu terjadi, bukan saja video Anda tidak bisa dimonetisasi, tapi juga bisa dihapus atau dibanned.

Untuk menghindari pelanggaran hak cipta musik latar (backsound music), kita bisa gunakan Musik Latar Bebas Royalti & Hak Cipta.

3. Daftar AdSense

Lewat Youtube juga kita bisa daftar Google AdSense. Bahkanb, jika video kita banyak yang tonton, views-nya banyak banget, kita akan mendapatkan undangan langsung dari Google Adsense. 

Jika belum mendapatkan undangan tersebut, daftar saja dengan mengikuti panduan ini: Mendaftar ke AdSense melalui YouTube.

Panduan Lengkap Cara Mendapatkan Uang dari Video Youtube

Berikut ini panduan lengkap cara monetisasi video Youtube, langsung dari Panduan Google. Highlightnya: 

Cara terbaik untuk Mendapatkan Uang dari Video Youtube adalah dengan membuat sendiri semua elemen video alias karya sendiri, asli!

1. Cara Mengaktifkan Monetisasi Saluran Youtube

1. Masuk ke akun YouTube
2. Di bagian kanan atas, pilih ikon akun > Creator Studio. 
3. Di menu sebelah kiri, pilih Saluran > Status dan fitur.
4. Di samping "Monetisasi", klik Aktifkan. Anda hanya akan melihat opsi ini jika monetisasi belum dinonaktifkan pada akun.
5. Ikuti langkah-langkah di layar untuk menyetujui perjanjian monetisasi YouTube.
6. Jika akun tidak memenuhi syarat untuk monetisasi, Anda akan melihat pesan yang berbeda. 

2. Monetisasi Video

1. Setelah mengikutsertakan saluran untuk monetisasi, Anda dapat mengaktifkan video yang layak untuk menghasilkan uang.
2. Pastikan video Anda memenuhi kriteria monetisasi video.
3. Tentukan apakah Anda ingin memonetisasi satu video atau lebih dari satu video:
4. Satu video: Ikuti langkah ini untuk mengaktifkan iklan di video yang ingin dimonetisasi.
5. Lebih dari satu video: Ikuti langkah ini untuk memonetisasi beberapa video sekaligus.

Agar dapat mulai menerima pendapatan, ikuti langkah-langkah untuk menautkan akun YouTube dan AdSense.

Mengganti Musik yang Melanggar Hak Cipta

Jika kta telanjur membuat video dengan musik latar yang melanggar hak cipta, maka kita bisa menghapus dan mengubahnya langsung di Youtube dengan cara edit, agar video tersebut bisa dimonetisasi atau menghasilkan uang.

Di daftar video yang kita upload akan link ada catatan pelanggaran, misalnya "Includes copyrighted content" atau "Blocked in Some Countries". Klik link tersebut dan Hapus Musik dan Ganti dengan Music Free Copyrights yang disediakan.

Itu dia catatan atau dokumentasi tentang Cara Mendapatkan Uang dari Video Youtube: Monetisasi & AdSense. Good Luck! (http://www.contohblog.com).*

Daftar Link Download Musik Backsound Gratis Bebas Royalti & Copyright

Daftar Link Download Musik Backsound Gratis Bebas Royalti & Copyright untuk Video Youtube.

VIDEO Youtube dengan backsound musik (lagu) akan lebih enak ditonton.

Untuk monetisasi video atau mendapatkan uang dari video Youtube, kita harus menggunakan musik backsound gratis, free sound, musik instrumen gratis, royalty free music, atau no copyright sounds agar menghindari pelanggaran Hak Cipta musik pada video.

Video yang dikasih backsound musik yang memiliki hak cipta, tidak akan bisa dimonetisasi, bahkan bisa dibanned atau dihapus Youtube. Youtube melarang kita, para Youtuber, menggunakan hal-hal yang melanggar hak cipta. 

Untuk mengatasi audio atau musik latar yang berhak cipta, kita harus gunakan musik yang bebas royalty atau bebas hak cipta. Banyak sekali situs tempat  Download Musik Backsound Gratis Bebas Royalti & Copyright.

Berdasarkan penelusuran, berikut ini Daftar Link Download Musik Backsound Gratis Bebas Royalti & Copyright.

CB tempatkan Ben Sound di urutan pertama karena baru saja menggunakan royalty free music dari sana untuk video Tips SEO Dasar yang ada di bawah posting ini.

Di BenSound banyak pilihan jenis musik, mulai dari pop, jazz, hingga lounge yang dapat didownload gratis bebas hak cipta/royalti dan bebas digunakan sebagai musik latar untuk korporat.

"Bensound's royalty free music: Corporate, Pop, Motivation, Motivational. ... DOWNLOAD. Loungemusic. Could be used as background music for a corporate."

Daftar Link Download Musik Backsound Gratis Bebas Royalti & Copyright

Berikut ini daftar situs penyedia musik gratis untuk backsound video Youtube --bebas royalti & copyright.

1. BenSound 
2. Voices
3. Sound Effect
4. Find Sound
5. Free Sound
6. Event Sound
7. Sound Snap
8. No Copyright Sounds
9. Acoustica

Itu dia Daftar Link Download Musik Backsound Gratis Bebas Royalti & Copyright. Banyak ya? Lebih banyak lagi daftar situs free royalty & no copyright music di bawah ini yang dihimpun dari berbagai sumber:

http://flashkit.com/soundfx/
http://www.audiomicro.com/royalty-free-sound-effects.html
http://www.sfxsource.com/Sound-Effects/
http://www.a1freesoundeffects.com/
http://soundrangers.com/html/free-sound-effects.html
http://www.partnersinrhyme.com/pir/PIRsfx.shtml
http://www.ljudo.com/default.asp?lang=tEnglish&do=it
http://www.splurgo.com/
http://www.bestservice.de/
http://www.stockmusicboutique.com/
http://members.tripod.com/ushk/sounds/sounds.htmlhtml
http://www.prankcallsunlimited.com/
http://www.wavsurfer.com/
http://music-for-video.com/free-sound-effects-for-video-makers.html
http://www.mediacollege.com/downloads/sound-effects/
http://www.3dmmstudio.co.uk/sounds.php
http://www.dueeast.com/watersounds.html
http://www.dramaticpublishing.com/freesoundeffects.php
http://www.vionline.com/sound.html
http://www.freesfx.co.uk/soundeffectcats.html
http://www.soundjay.com/
http://www.therecordist.com/pages/downloads.html
http://www.members.tripod.com/~buggerluggs/ie/wav-dir184.htm
http://amazingsounds.iespana.es/en/
http://www.pachd.com/sounds.html
http://freesoundfiles.tintagel.net/Audio/
http://www.talkingwav.com/
http://www.wav-sounds.com/
http://www.moviesoundclips.net/sound-effects.php
http://www.wavplanet.com/wavs.php?cat=5
http://sounds.wavcentral.com/effects.htm
http://www.freeaudioclips.com/categories.php?cat=10&cat_name=Sound+Effects
http://coolwavs.fortunecity.com/
http://sounds.stoutman.com/index.php
http://members.tripod.com/Thryomanes/AnimalSounds.html
http://littlemusicclub.com/
http://www.zero1media.com/samples.htm
http://www.boogiejack.com/sound_effects.html
http://www.autospeak.com/library.htm
http://www.specialoperations.com/Multimedia/sounds.html
http://www.ilovewavs.com/
http://www.animalpicturesarchive.com/animal/SOUND/
http://www.brandens.net/
http://www.belessdumb.com/snd/index.php
http://downloadsoundeffects.com/freesfx.htm
http://www.hollywoodedge.com/free_downloads.aspx
http://www.alcljudprod.se/english/ljud.php
http://www.pacdv.com/sounds/
http://nature-downloads.naturesounds.ca/
http://www.youtube.com/ByeByeCopyright
http://www.youtube.com/bestmusicforcod
http://www.machinimasound.com
http://www.incompetech.com/music/royalty-free
http://www.audionautix.com
http://www.99sounds.org/free-sound-effects/
http://www.smartsound.com
http://www.danosongs.com
http://www.mobygratis.com/film-music.html
http://www.freesoundtrackmusic.com
http://www.freemusicarchive.org/curator/creative_commons
http://www.partnersinrhyme.com/royaltyfreemusic
http://www.publicdomain4u.com
http://www.musopen.org
http://www.dig.ccmixter.org/free_music
http://www.freeplaymusic.com
http://www.audiomicro.com
http://www.freemusicarchive.org

Wuih... banget banyaknya ya? Good Luck! (http://www.contohblog.com).*

Contoh Video dengan Musik Backsound Gratis Bebas Royalti & Copyright

"Dasar SEO Submit Url & Sitemap ke Google Webmaster Tool"

Reshuffle Kabinet: Penyebab Pencopotan Para Menteri Populer

PEMERINTAH Jokowi-JK melakukan perombakan (reshuffle) kabinet untuk kedua kalinya yang diumumkan Rabu (27/7/2016). Reshuffle Kabinet pertama dilakukan Agustus 2015 dengan merombak enam pos kementerian.

Kali ini, perombakan dilakukan di 12 pos kementerian, dua kali lipat dari reshuffle kabinet tahun lalu.

Banyak kejutan di perombakan kabinet kali ini. Nama-nama kodang seperti Anies Baswedan, Ignasius Jonan, Yuddy Chrisnandi, dan Rizal Ramli diganti atau dicopot dari jabatannya. 

Muncul "analisis politik", apa salah mereka? Setelah baca-baca di Republika Online, Kompas, Detik, dan lainnya, diduga kuat ada pemicu (trigger) yang membuat para menteri "kondang" itu dicopot Jokowi.

Penyebab Anies Baswedan Dipecat

Katanya, Mendikbud Anies Baswedan dicopot karena kinerjanya tidak memenuhi harapan Jokowi. Katanya, Anies tidak melakukan gebrakan yang cepat selama menjabat sebagai Mendikbud.

Namun, menurut pengamat politik M. Qodari, Anies Baswedan dicopot karena terkait dengan Pemilu 2019. Anies disebut berpotensi menjadi penantang para calon presiden di Pilpres 2019. (Bisnis).

Penyebab Ignasius Jonan Dicopot

Pemecatan Menhub Ignasius Jonan diduga karena ia gagal dalam musim mudik lebaran tahun ini, terutama dengan terjadinya kemacetan parah di Exit Tol Brebes (Brexit) yang menelan korban jiwa.

Namun, masih menurut Qodari, Jonan dipecat karena komunikasi politiknya dinilai kurang bagus. Ini juga tercermin dari komentarnya yang dinilai tidak berempati kepada korban macet Brexit. 

Penyebab Rizal Ramli Diganti

Rizal Ramli masuk dalam kabinet saat perombakan kabinet jilid satu. Namun, baru menjabat kurang dari setahun, ia dipecat.

Menurut dugaan, alasan utama Rizal Ramli dipecat karena membatalkan proyek reklamasi di Pulau G yang membuatnya berseteru dengan Gubernur DKI Basuki “Ahok” Tjahaja Purnama.

Penyebab  Yuddy Chrisnandi Diganti

Dugaan tentang sebab pemecatan Yuddy lain lagi. Kabarnya, ia dipecat karena "hal sepele", yaitu menggunakan mobil dinas saat mudik ke Bandung. Nah lho!

Penyebab menteri lain dipecat tidak terlalu menarik dibahas. Soalnya, unsur kepentingan politik lebih kental. Misalnya, dua menteri dari Hanura dipecat untuk memasukkan Ketua Umum Hanura, Wiranto, jadi Menkopolhukam.

Yang lebih menarik lagi, kenapa Mempora Imam Nahrawi tidak kena reshuffle ya? Padahal, jelas, ia tidak suka sepakbola, olahraga terpopuler di Indonesia dan dunia. Karena dialah kompetisi sepakbola tanah air terhenti dan kacau-balau.

Itu saja "ulasan politik" seputar perombakan kabinet. Temanya bukan soal blogging yang menjadi niche blog CB. Sesekali boleh toh posting di luar niche blog? Selain menambah database tulisan kategori atau label Tulisan Lepas. 

Good Luck and Happy Blogging! (http://www.contohblog.com).*

Logo Resmi HUT Ke-71 RI 2016 - Download CorelDraw

Logo Resmi HUT Ke-71 Kemerdekaan RI 2016 - Download CorelDraw

TIAP tanggal 17 Agustus bangsa Indonesia merayakan Hari Ulang Tahun Kemerdekaan Republik Indonesia (HUT RI). Tiap tahun logo resmi HUT RI berubah.

Logo HUT RI tahun 2016 ini atau HUT Ke-71 RI sudah dirilis dan filenya bisa didownload di situs resmi pemerintah.

Logo Peringatan Hari Ulang Tahun (HUT) ke-71 Kemerdekaan Republik Indonesia secara resmi dirilis pemerintah melalui Kementerian Sekretariat Negara (Kemensetneg).

Rilis logo 71 Tahun Indonesia Merdeka secara resmi tertuang dalam surat Sekretaris Kementerian Sekretariat Negara yang ditandatangani Sekretaris Setneg Setya Utama tanggal 25 Mei 2016.

Kita bisa mengakses dan mendownload logo resmi HUT RI tersebut di http://www.setneg.go.id. Link download lengkapnya --file JPG dan file CorelDraw-- ada di bawah posting ini.

Makna Logo HUT Ke-71 RI

Di laman psmk.kemdikbud.go.id disebutkan, Logo HUT ke-71 RI mempunyai konsep bentuk kerja nyata yang berkesinambungan. Karena itu, visual 71 tahun Indonesia Merdeka memiliki bentuk yang berkelanjutan dari logo 70 Tahun Indonesia Merdeka.

Pada logo 71 tahun ini digambarkan dua setengah lingkaran yang mengilustrasikan bilah baling-baling yang dinamis selalu berputar mendorong pesat ke depan. Hal ini menunjukan komitmen pemerintah untuk kerja nyata dalam memajukan Indonesia.

Angka satu yang menembus bidang lingkaran mengarah ke kanan atas merupakan ajakan bagi seluruh lapisan masyarakat agar ber-“satu”, bahu membahu bekerja menembus segala rintangan.

Mirip Lencana Divisi Infantri Amerika

Dilansir Republika Online dan berbagai media lain, logo resmi HUT Ke-71 RI untuk 17 Agustus 2016 ini mirip dengan gambar lencana Divisi Infantri ke-71 Amerika Serikat (AS).

Pada logo peringatan ulang tahun ke-71 RI, angka 7 dan 1 ditampilkan bersisian. Bentuknya mirip dengan angka yang sama pada gambar lencana Divisi Infantri ke-71 AS. Keduanya sama-sama menunjukkan angka 7 dan angka 1 serong ke kanan.

Bedanya, pada logo resmi dari pemerintah RI, hanya ada dua warna yakni merah dan putih, dengan kata-kata “Indonesia Kerja Nyata” pada pojok kanan atas. Angka 7 dan angka 1 berwarna putih. Lingkarannya tampil bergeser, sehingga tak utuh bulat.

Pada gambar lencana milik militer AS itu, angka 7 dan angka 1 berwarna biru. Keduanya terletak di dalam lingkaran penuh bulat berwarna merah dengan latar belakang warna putih.

Mneurut laman Wikipedia, 71st Infantry Divison (United States) merupakan cabang dari militer AS yang aktif pada dua periode, yakni 1943-1946 dan 1954-1956. Kesatuan yang memiliki nama panggilan “Si Lingkaran Merah” itu pernah aktif dalam gelanggang Perang Dunia Kedua.

Kedua gambar itu mirip hanya kebetulan atau memang desainer logo HUT ke-71 RI menyontek logo infantri Amerika itu? Semoga hanya kebetulan. 

Link Download Logo Resmi HUT Ke-71 RI 2016

1. Gambar Logo JPG: Link Download LOGO HUT R1 2016

2. Link Download Format Vector - CorelDraw CDR

3. Link Download Logo HUT ke-71 RI CDR Lainnya

Cara Mudah Memasang Tombol Back to Top Fast Loading & Responsive

Cara Mudah Membuat / Memasang Tombol Back to Top Fast Loading & Responsive di Blogger.

TOMBOL Back to Top / Scroll to Top atau Kembali ke Atas adalah semacam menu navigasi yang memudahkan pengunjung untuk kembali ke bagian atas halaman blog secara cepat, tanpa perlu scroll mouse atau "usap-usap" screen.

Jika halaman discroll ke bawah, tombol Back to Top ini baru muncul. Begitu diklik, maka halaman yang sedang dibuka akan otomatis bergerak ke bagian teratas.

Contohnya ada di sebelah kanan bawah halaman blog CB ini.

Banyak sekali tips cara membuat atau memasang tombol Back to Top ini. CB juga kalo tidak salah sudah beberapa kali share tips dan kodenya.

Namun, kali ini mempertegas dan memberi pilihan terbaik kode Back to Top yang SEO Friendly, User Friendly, Fast Loading, dan Responsive. Kodenya dari Dynamic Drive.

Cara memasangnya juga gak ribet, tidak perlu edit HTML, namun hanya dengan menambahkan widget di bagian Layout (Tata Letak). Ini yang membuat tombol Back to Top menjadi ringan.

Cara Termudah Pasang Tombol Back to Top

1. Di dashboard blog Anda, klik Layout > Add a Gadget > Pilih HTML/JavaScript
2. Judul Kosongkan!
3. Copas kode berikut ini di kolom Content:

<script type="text/javascript" >
var scrolltotop={
    setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 200]},
    controlHTML: '<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6ijGU-b5rKeg2XHOoq0hwmDYNGXTNQ22fCiK3UHy6fHIz97IzEbJdkawvVlAByZjhlqvE2Q7hHJBAEGXNHRF9BIc-zaxl7bjwImkM0yEWnuCQACFZW2kGM82oeWqzyqf7xAeH-stKkpk/s50/back+to+top+button.gif" />',
    controlattrs: {offsetx:5, offsety:5},
    anchorkeyword: '#top',
    state: {isvisible:false, shouldvisible:false},
    scrollup:function(){
        if (!this.cssfixedsupport)
            this.$control.css({opacity:0})
        var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
        if (typeof dest=="string" && jQuery('#'+dest).length==1)
            dest=jQuery('#'+dest).offset().top
        else
            dest=0
        this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
    },
    keepfixed:function(){
        var $window=jQuery(window)
        var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
        var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
        this.$control.css({left:controlx+'px', top:controly+'px'})
    },
    togglecontrol:function(){
        var scrolltop=jQuery(window).scrollTop()
        if (!this.cssfixedsupport)
            this.keepfixed()
        this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
        if (this.state.shouldvisible && !this.state.isvisible){
            this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
            this.state.isvisible=true
        }
        else if (this.state.shouldvisible==false && this.state.isvisible){
            this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
            this.state.isvisible=false
        }
    },
 
    init:function(){
        jQuery(document).ready(function($){
            var mainobj=scrolltotop
            var iebrws=document.all
            mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
            mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
            mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
                .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
                .attr({title:'Scroll Back to Top'})
                .click(function(){mainobj.scrollup(); return false})
                .appendTo('body')
            if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //khusus versi IE6 ke bawah untuk loose check, juga untuk melihat apakah control mengandung teks
                mainobj.$control.css({width:mainobj.$control.width()}) //IE6- perlu diset witdh yang jelas agar kontainer text terbentuk dengan rapi
            mainobj.togglecontrol()
            $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
                mainobj.scrollup()
                return false
            })
            $(window).bind('scroll resize', function(e){
                mainobj.togglecontrol()
            })
        })
    }
}
scrolltotop.init()
</script>

4. Anda bisa ganti icon panah atau gambar back to top-nya di bagian URL Gambar yang warna merah. Koleksi gambar panahnya bisa dipilih di Gambar Tombol Back to Top Blogger.

5. Save!
6. Pindahkan widget di sideba blog yang baru terpasang itu ke bagian paling bawah!
7. Save Arrangement!

Silakan cek, buka blog Anda, refresh (F5). Jika tidak muncul, kemungkinan besar template blog Anda belum dipasang link ke kode jQuery. Silakan pasang jQuery. Umumnya template blog seo friendly terbaru sudah dipasang jQuery.

Demikian Cara Mudah Memasang Tombol Back to Top Fast Loading & Responsive. Good Luck & Happy Blogging! (http://www.contohblog.com).*

Cara Mengatasi H1 Zero that is Really Bad di Chkme

Cara Mengatasi H1 Zero that is Really Bad di Chkme sangat mudah, yaitu tinggal menambahkan kode <H1> dan </h1> di kode header image (kode gambar logo) di template, agar skor seonya 100%.

Silakan Anda cek skor SEO blog Anda di Chkme. Jika kode header image-nya belum dioptimisasi, kemungkinan skor seo-nya tidak akan sampai 100% dan ada keterangan "Really Bad" atau "Benar-benar buruk".

Skor SEO di Chkme memang bukan segalanya. Namun, setidaknya dengan skor seo sempurna hingga 100%, maka standar seo blogging sudah terpenuhi.

Kita tinggal fokus ke Konten Berkualitas. Postingan yang bagus didukung desain template seo friendly akan menentukan kesuksesan blogging: banyak pengunjung, menjadi publisher Google AdSense, dan menghasilkan uang.

Cara Mengatasi H1 Zero that is Really Bad di Chkme

Jika saat dicek skor seo blog Anda di Chkme ada peringatan error seperti gambar di bawah ini, maka lanjutkan dengan tips mengatasinya.

Berikut ini solusi masalah H1 Zero di Chkme:

1. Template > Edit HTML
2. Cari kode seperti di bawah ini:

<!--Show the image only-->
      <div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
         <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
        </a>   

2. Tambahkan kode <h1> dan </h1> sehingga menjadi seperti ini.

   <!--Show the image only-->
      <div id='header-inner'>
        <a expr:href='data:blog.homepageUrl' style='display: block'>
          <h1><img expr:alt='data:title' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' style='display: block'/></h1>
        </a>

 

3. Save Template!

Jika sudah beres, cek kembali blog Anda di Chkme, maka akan menjadi seperti ini:

Silakan cek skor seonya. Dipastikan ada peningkatan, kalaupun belum 100%. Jika belum 100%, maka ikuti panduan atau catatan dari Chkme untuk memperbaikinya.

Salah satu penyebab skor seo tidak sempurna biasanya ada kode <iframe> dan tidak ada Alt Text di gambar (image description).

Apa itu Chkme?

Chkme atau Check Me adalah situs untuk mengecek kualitas SEO blog kita. Saat melakukan cek di Chkme, Anda akan tahu berapa persen Skor SEO serta apa saja yang mempengaruhi keseoan template blog yang kita gunakan. Good Luck & Happy Blogging! (http://www.contohblog.com).*

Cara Membuat Widget Popular Posts Jadi Warna-Warni

Cara Membuat Widget Popular Posts di Sidebar Blog Jadi Warna-Warni

SEJUMLAH template blog menggunakan Widget Popular Posts di Sidebar Warna-Warni. Ada merah, kuning, hijau, di langit yang biru kayak lagu pelangi-pelangi. Ada merah, kuning, kelabu, merah muda, dan biru sepreti di lagu balonku.

Mau? Gampang. Intip aja kodenya dengan klik kanan Widget Popular Posts Warna-Warni di blog mana saja, lalu klik "inspect element" ada deh.

Terbaik, klik kanan halaman blognya, klik "View Source Code", lalu Ctrl+F dan ketik PopularPosts. langsung kelihatan kodenya, tinggal Copas saja.

Contoh tampilan Widget Popular Posts Warna-Warni seperti dalam ilustrasi gambar posting ini.

Cara Edit Widget Popular Posts Jadi Warna-Warni

Brikut ini cara pasang Widget Popular Posts Warna-Warni yang pernah CB pasang di widget popular post Template Simple CB, namun dilepas karena terasa "lebay" dan mirip iklan obat kuat :)

1. Template > Edit HTML

2. Simpan kode berikut ini diatas kode ]]></b:skin> atau </style> 

/*Custom Popular Post*/
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0 0;padding:0 0;list-style:none;border:none;background:none;outline:none}
.PopularPosts ul{margin:.5em 0;list-style:none;color:black;counter-reset:num}
.PopularPosts ul li{background-color:#eee;margin:0 0 0 0!important;padding:.5em 1.5em .5em .5em!important;counter-increment:num;position:relative}
.PopularPosts ul li a{color:#fff!important}
.PopularPosts ul li a:hover{color:#2c3e50!important}
.PopularPosts ul li .item-title a,.PopularPosts ul li a{font-weight:bold;color:inherit;text-decoration:none;font-size:14px}
.PopularPosts ul li:nth-child(1){background-color:#f1c40f;}
.PopularPosts ul li:nth-child(2){background-color:#f39c12;}
.PopularPosts ul li:nth-child(3){background-color:#2ecc71;}
.PopularPosts ul li:nth-child(4){background-color:#27ae60;}
.PopularPosts ul li:nth-child(5){background-color:#e67e22;}
.PopularPosts ul li:nth-child(6){background-color:#d35400;}
.PopularPosts ul li:nth-child(7){background-color:#3498db;}
.PopularPosts ul li:nth-child(8){background-color:#2980b9;}
.PopularPosts ul li:nth-child(9){background-color:#ea6153;}
.PopularPosts ul li:nth-child(10){background-color:#c0392b;}
.PopularPosts .item-thumbnail{margin:0 0 0 0}
.PopularPosts .item-snippet{font-size:11px}

Note:

Anda bisa ganti warnanya sesuka Anda di bagian kode background-color (Lihat: Kode Warna HTML).

3. Save Template!

Setting Popular Posts

Sekarang ke bagian Layout (Tata Letak).

1. Klik "Edit" di Widget Popular Posts yang sudah dipasang. Kalo belum dipasang, ya.. pasang dulu dong!

2. Pilih angka atau jumlah popular post yang mau ditampilkan

3. Jangan centang apa pun di bangain "Show". Lepas semua centang di bagian image dan snippet seperti dalam gambar berikut ini:

4. Save!

Demikian Cara Membuat Widget Popular Posts Warna-Warni di Sidebar Blog. Good Lukc & Happy Blogging! (http://www.contohblog.com).*

Cara Mengatasi Related Post Undefined - Tidak Muncul di Blog

Cara Mengatasi Related Post Undefined (Tidak Muncul) di Blog

BEBERAPA blogger mengalami masalah Related Posts atau Artikel Terkait yang tidak muncul. Solusi ringkasnya adalah pastikan SEMUA posting memiliki Label.

Jika semua posting sudah diberi Label, namun tak muncul juga, kemungkinan masalahnya ada pada Format Waktu & Tanggal (Timestamp) yang tidak sama. 

Lakukan setting waktu dengan format yang sama, baik di Setting > format Timestamp maupun di widget Blog Posts, seperti pada gambar di bawah ini:

Penyebab Related Post tidak Muncul (Undefined)

1. Tidak Ada Posting dengan Label yang Sama
2. Postingan Tidak Ada Label
3. Format Tanggal / Waktu Tidak Sama
4. Link Kode Script di Hosting Lain Mati
5. Tidak dipasang kode widget Related Posts

Solusi 1 : Tidak Ada Posting dengan Label yang Sama

Pastikan minimal ada 5 posting dengan label yang sama. Perhatikan cara penulisan labelnya juga harus sama, misalnya News (N besar) atau news (n kecil). Huruf besar/kecil berpengaruh terhadap related posts.

Solusi 2 : Tidak Ada Posting dengan Label yang Sama

Pastikan SEMUA Posting Dikasih Labels. Saat menulis posting, Klik menu "Labels" di sidebar kanan, dan masukkan nama Label, misalnya: Desain, Media Sosial, Tips SEO 

Maka posting dengan Label yang sama, akan muncul di Related Posts.

Solusi 3 : Format Tanggal/Waktu Tidak Sama

Lakukan Setting Format Tanggal sebagaimana dua gambar paling atas. Bagian format Timestamp silakan pilih atau SAMAKAN format tanggal yang sesuai dengan settingan template anda! Misalnya: July 18, 2016

Solusi 4 : Link Kode Script di Hosting Lain Mati

Ini banyak terjadi di template blog yang menggunakan kode Related Post yang dihosting di Google Code yang sudah dihentikan Google. 

Misalnya, link seperti "http://dte-project.googlecode.com/svn/trunk/related-post/related-post.min.js" sudah tidak berfungsi.

Solusinya, ganti kode related postnya dengan link yang masih berfungsi atau kode yang tidak dihosting di tempat lain --semua kode langsung dipasang di template.

Solusi 5 : Kode Widget Related Posts Tidak Dipasang 

Gimana mau muncul entry terkait jika tidak dipasang kodenya? Template bawaan blogger, misalnya, kan tidak dilengkapi widget related post. Maka, solusinya, ya.... pasang dong! 

Silakan terapkan Cara Memasang Related Post di Blogger.

Jika semua masalah dan solusi di atas sudah diterapkan, tapi masih Related Post Undefined masih ada alias Tulisan Terkait masih Tidak Muncul juga, maka itu namanya T.E.R.L.A.L.U.

Solusinya, Ganti Template aja dengan Template SEO Friendly yang lebih OK. Good Luck & Happy Blogging! (www.contohblog.com).*