CARA FLEXI: Search results for Cara Membuat Popular Post Di Blog

CARA MEMBUAT POPULAR POST BLOG SEDERHANA TAPI KEREN

Oleh Anonymous pada tanggal October 29, 2018

Cara Membuat Popular Post Blog Sederhana Tapi Keren - Widget popular post bawaan standar blogger dari sebagian orang tampil kurang menarik, nah dalam kesempatan kali ini saya akan share mengenai bagaimana menciptakan widget popular post menjadi sederhana tetapi tampil menarik, berikut merupakan tuorial cara membuat widget popular post blog secara sederhana tetapi keren:

1. Log in ke akun blogger sobat
2. Klik tata letak/ masukkan widget popular post
3. Pada pengaturan popular post hilangkan image pada thumbnail dan snippet.
4. Simpan kemudian lanjutkan ke tamplate dan edit HTML
5. Cari kode berikut ]]> lalu tambahkan kode berikut ini tepat diatas kode yang aku sebutkan diatas.

/*--- Genera Popular Posts --- */
    .popular-posts ulpadding-left:0px;
    .popular-posts ul li
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJaJIDvvWExzVZH9VJBx3yZRfFBh8qt1ilpLMyPWU3RcBnKF-TBdzzazNfDPsZpg7KIkekOA6ZhSe0LcHNqf6Bbbm1qavWYzOoXoP-I9TzQmzKousCP30z4f5OtEM82CTPxjTu-YxQQT4u/s400/33.gif") no-repeat scroll 5px 8px rgb(255, 255, 255);
    list-style-type: none;
    margin: 0px 0px 5px;
    padding: 5px 5px 5px 20px !Important;
    border: 1px solid #dddddd;
    border-radius: 10px 10px 10px 10px;

    .popular-posts ul li:hover
    border:1px solid #666666;

    .popular-posts ul li a:hover
    text-decoration:none;

6. Klik pratinjau apabila tidak terjadi eror klik simpan.
Baca juga cara menciptakan bermacam-macam populer post lainnya.

CARA MEMBUAT WIDGET SLIDER OTOMATIS RECENT POST

Oleh Anonymous pada tanggal October 29, 2018

Cara Membuat Widget Slider Otomatis Recent Post - Widget recent post bermanfaat buat menampilkan post artikel terbaru di blog, menggunakan tambahan widget ini pengguna atau user akan gampang mencari post artikel modern yg anda publikasikan. Dengan begitu para user akan mudah menerima keterangan update yang mereka cari. Setelah kemarin saya share mengenai cara menciptakan beragam widget popular post menarik kali ini aku akan share mengenai cara membuat widget recent post slider otomatis di blog. Dengan tambahan widget ini pula secara tidak eksklusif akan berpengaruh terhadap SEO blog yaitu akan mengurangi tingkat bounce rate blog selain juga mempercantik tampilan blog.
Cara Membuat Recent Post Slider Otomatis pada Blog
Cara menciptakan widget slider recent post ini pula sangat gampang, anda tidak perlu mengubah struktur kode html template. Yang anda perlukan hanya menambahkan kode widget pada blog, maka recent post tadi akan ada di blog anda.caranya adalah sebagai berikut:
1. Masuk akun Blogger anda
2. Klik tata letak kemudian masukkan widget HTML/ Javascript
3. Tambahkan Kode pada bawah ini pada dalamnya:

makeSlider(
url: "//caraflexi.blogspot.com" // Add your blog URL
);

Note: Ganti yang aku tandai menggunakan warna merah dengan alamat url Blog anda. Apabila anda benar melakukannya maka tampilan widget tadi akan terlihat misalnya dibawah ini:

CARA INSTALL GOOGLE FONT KE DALAM TEMPLATE TUTORIAL BLOG

Oleh Cara Flexi pada tanggal October 30, 2018

Font atau alfabet yang dipakai dalam sebuah laman web sangat mempengaruhi tingkat ke popularan situs web tadi, penggunaan jenis font dan besar kecil ukuran font yg kurang tepat dapat membuat minat pembaca hilang secara datang-tiba. Ideal nya ukuran font yg membuat nyaman pembaca adalah 15px hingga 16 px, sedangkan jenis font yang ideal untuk situs web/blog merupakan open sans, arial reguler, raleway dan masih banyak lagi, tetapi pada dasarnya pilih lah font yg generik dan rapi, sebagai akibatnya nir mengejutkan mata pembaca.
Bagaimana cara membarui jenis huruf (font) dalam template blog?
Login ke blogger, klik template > klick tingkat lanjut, kamu bisa memilih font header, font page atau content yang telah tersedia disitu. Namun aku nir membahas itu lebih jauh karena aku rasa semua paham bila memilih font dari pengaturan template. Tapi bagaimana jika ternyata kita tidak menemukan jenis font yg sesuai dengan yang kita inginkan pada pengaturan template, maka solusi nya kita bisa menggunakan google font menggunakan cara menginstal nya di template blog kita. Ada banyak jenis-jenis font yang cantik pada google font, mungkin ratusan atau 300 jenis font bahkan mungkin lebih dari itu, aku nir pernah menghitung nya.

Cara Memilih dan Mengambil Google Font

Kunjungi //fonts.google.com buat menentukan font
Setelah menemukan jenis font yg sempurna, klick indikasi +,
Setting sedikit panda ventilasi yg ada misalnya gambar pada bawah ini.

Keterangan Gambar:

Pada tab costumize pilih regular 400 dan bold 700, itu adalah merupakan ukuran ketebalan font font-weight: nilai_font; yang paling umum, perhatikan jua indikator hijau dalam gambar, itu adalah tanda aman atau nilai kecepatan loading (pemuatan font) tadi. Bila kita menentukan 3 berukuran ketebalan font misal 400,700, serta 800 maka indikator hijau umumnya berubah jadi kuning atau merah, memberi tanda bahwa menentukan 3 ukuran font akan membuat loading (pemuatan) font lebih berat.
Tab-Embed, Copy ke 2 kode yg di berikan google font, simpan pada notepad atau catatan buat ad interim.

Cara Memasang Google Font ke Template Blog

Login ke Dashboard Blogger > klick Template > Edit Html
Cari kode epilog tag-heading yaitu dan pastekan kode google font tepat pada atas lalu save template.
Lihat contoh pada bawah ini.

Catatan: proses pemasangan google font ini belum terselesaikan, apabila pada waktu menyimpan template ternyata template kita nir mampu menyimpan kode google font tersebut, karena format template berbeda menggunakan kode google font, maka ubahlah kode google font tadi menjadi seperti ini dia.
Perhatikan disparitas nya ada dalam indikasi kutip satu ' serta pertanda kutip dua " serta bagian ujung kode yaitu />.
Simpan kembali kode google font sempurna pada atas tag , bila template permanen tidak mampu menyimpan nya maka parse kode google font tadi klik disini buat memparse. Script apapun jikalau sudah pada parse insya allah masuk ke template blog apapun.
Setelah kode tersebut disimpan di pada area heading tag template, maka langkah selanjut-nya memasang css google font (kode yang ke 2) yaitu ().
Masukkan kode css google tepat pada atas kode ]]> dengan format misalnya di bawah ini.

p

}

Huruf "p" berarti paragraf, maka css di atas meminta "tampilkan seluruh paragaf text dengn font raleway". Sedangkan fungsi sans-serif; adalah font cadangan, bila jaringan internet sedang tidak mengagumkan maka font raleway akan pada gantikan dengan sans-serif untuk pemuatan (loading) yang lebih singkat.
Selain menggunakan format misalnya di atas, css google font juga bisa pada pasang menggunakan format seperti model berikut ini.

.post-body

}

.post-body merupakan id halaman artikel, jadi seluruh yg di pada laman artikel akan dimuat menggunakan tampilan huruf (font) raleway. Supaya artikel ini lebih panjang lagi, maka aku kasi contoh lagi yaitu memasang css google font menggunakan format misalnya ini dia.

.post-body,.post-tittle,.popular-post {

}

Css tersebut ialah meminta judul artikel, page artikel, serta post popular di tampilkan dengan jenis alfabet raleway.
Catatan Penting:
.post-body, .post-tittle, serta .popular-post adalah "id" element yg generik pada template blogger, tapi apabila template anda tidak memakai "id" seperti itu, maka engkau mampu lakukan inspect element buat mengetahui "id" setiap element template anda, awali menggunakan memberi tanda titik di belakang id dan pisahkan id dengan pertanda koma, seperti terlihat pada contoh css diatas, relatif sekian penerangan saya tentang cara memasang google font ke template blogger.

6 CARA MEMBUAT WIDGET SEARCH BOX KEREN DI BLOG

Oleh Anonymous pada tanggal October 29, 2018

6 Cara Membuat Widget Search Box Keren di Blog - Tutorial kali ini merupakan lanjutan menurut artikel kemarin mengenai cara membuat search bog keren, kali ini saya mau menambahkan lagi cara membuat 6 search box keren lainnya. Namun sebelum melanjutkan silahkan baca artikel lain saya cara menciptakan bermacam macam popular post blog keren terlebih dahulu. Lalu pertanyaannya pentingkah search blog ini dipasang di blog anda? Tentu saja poly sekali manfaat yg mampu anda dapatkan buat memasang search blog ini pada blog anda, search blog ini memudahkan para pembaca blog anda menjadi widget navigasi atau membantu para pembaca blog buat mengeksplor atau mencari artikel yg diinginkan para pembaca. Dengan demikian para pembaca gampang menemukan artikel atau yg berkaitan dengan frasa kata yang mereka inginkan di blog anda tanpa berpindah ke blog lain.
Cara Membuat 7 search box keren pada Blog
Cara membuatnya cukup mudah kok, anda hanya menambahkan widget misalnya biasa atau seperti langkah yang akan saya sebutkan dibawah ini:

Masuk Akun blog anda
Masuk tata letak lalu masukkan widget HTML/ Javascript
Masukan kode yang aku berikan ini.
Simpan

nb: Hasilnya sanggup dilihat dicek seperti dibawah ini.
Search Box no1

Search Box no2

Search Box no3

Search Box no4

Search Box no5

Search Box no6

CARA MENGHIAS LABEL BLOG

Oleh Anonymous pada tanggal October 29, 2018

Nah kali ini aku akan share tentang bagaimana menghias atau custom label bawaan blogger supaya menjadi lebih menarik dan tentunya sanggup anda rubah misalnya yang anda inginkan. Tutorial ini menghias label seperti yang pada blog ini namun anda mampu merubah kode CSS seperti yg anda inginkan.
1. Log in Blogger klik tata letak dan masukkan widget.
2. Tambahkan popular post (Ingat buat menciptakan pengaturan cloud di popular post bukan baris).
3. Setelah semua beres masuk ke pengaturan template serta edit HTML.
4. Cari kode berikut ]]> dan letakan kode CSS berikut ini diatas kode tersebut:

.label a
    padding: 5px;
    background: #359bed;
    color: #fff!Important;
    text-decoration: none;
    border: none !Important;
    float: left;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 14px;
}

.label a:hover
    color: #fff !Important;
    background: #000000;

5. Klik pratinjau bila nir terjadi eror klik simpan maka hasilnya akan seperti dibawah ini:

Atau anda bisa mengganti kode CSS beliau atas menggunakan kode misalnya dibawah ini:

.label a
padding-left: 20px;
background: #000;
padding: 0 20px;
color: #fff!Important;
border-radius: 100px;
-moz-border-radius: 100px;
height: 32px;
line-height: 32px;
text-transform: uppercase;
text-decoration: none;
border: none !Important;
-webkit-transition: all .3s ease-in-out !Important;
t: 30pxt: 30px;
float: left;
margin-left: 5px;
margin-top: 5px;
font-size: 14px;
}

.label a:hover
color: #000 !Important;
background: #ff0;
}

Maka hasilnya akan misalnya dibawah ini:

CARA MEMBUAT POPS UP FACEBOOK LIKE DI BLOGGER MENGGUNAKAN JQUERY

Oleh Anonymous pada tanggal October 29, 2018

Cara Membuat Pops Up Facebook Like pada Blogger Menggunakan Jquery - Pada kesempatan kali ini aku akan share mengenai cara membuat widget like Pops up Facebook. Widget ini bisa dijadikan patokan seberapa banyak pengguna Facebook yang menyukai tautan menurut blog anda, selain itu jua bisa menambah blog semakin manis. Setelah kemarin aku posting tentang cara membuat widget pops up langganan email yang cara pembuatannya hampir sama, pembuatan widget inipun terbilang gampang. Saya akan mengungkapkan secara jelas cara membuat widget like facebook ini. Apabila anda melakukan semua langkah yang saya share dengan benar maka tampilan widget tersebut akan misalnya gambar dibawah ini:

Baca Juga widget artikel terkait lainnya:
- Membuat navigasi no urut halaman
- Membuat search box keren
- Membuat Widget Paypal Donation
- Membuat widget Pagerank
- Membuat beragam popular post
- Membuat widget Alexa rank terbaru
- Membuat Menubar Navigasi tanpa edit HTML
- Membuat Floating RSS langganan Email
Cara Membuat FB fans like pops up pada Blogger
1. Masuk ke akun Dashboard Blogger anda>> Template >> Edit HTML
2. Cari kode head> di template anda buat lebih mempermudah lakukan pencarian dengan klik Ctrl+ F
3. Paste kode ini dia sebelum / pada atas kode head> yang saya sebutkan diatas

    jQuery(document).ready(function()
    if (document.cookie.indexOf('visited=true') == -1)
    var setDays = 1000*60*60*24*7;
    var expires = new Date((new Date()).valueOf() + setDays);
    document.cookie = "visited=true;expires=" + expires.toutCString();
    $.colorbox(width:"400px", height:"430px", inline:true, href:"#facebook-popup");
    );

Catatan: * 7 Menetapkan nilai ini akan mensugesti refresh. Menetapkan LikeBox buat muncul sekali pada pengunjung dan LikeBox akan ada lagi selesainya 1 minggu adlah hal yg lebih baik. Gunakan pengaturan default misalnya yang aku tulis diatas.
4. Sekarang Cari ]]> b: skin>
5. Paste kode berikut sebelum css di atas ]]> b: skin>

/* Colorbox Core Style: The following CSS is consistent between example themes and should not be altered. */
#colorbox, #cboxOverlay, #cboxWrapper position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden;
#cboxOverlay position: fixed; width: 100%; height: 100%;
#cboxMiddleLeft, #cboxBottomLeft clear: left; #cboxContent position: relative;
#cboxLoadedContent overflow: auto; -webkit-overflow-scrolling: touch;
#cboxTitle margin: 0;
#cboxLoadingOverlay, #cboxLoadingGraphic position: absolute; top: 0; left: 0; width: 100%; height: 100%;
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow cursor: pointer; .cboxPhoto float: left; margin: auto; border: 0; display: block; max-width: none; -ms-interpolation-mode: bicubic; .cboxIframe width: 100%; height: 100%; display: block; border: 0;
#colorbox, #cboxContent, #cboxLoadedContent box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box;
/* User Style: Change the following styles to modify the appearance of Colorbox. They are ordered and tabbed in a way that represents the nesting of the generated HTML. */
#cboxOverlay background: #000;
#colorbox outline: 0; #cboxContent margin-top: 20px; background: #000;
.cboxIframe background: #fff; #cboxError padding: 50px; border: 1px solid #ccc;
#cboxLoadedContent border: 5px solid #123D60; background: #fff; box-shadow: 3px 3px 3px #fff; #cboxTitle position: absolute; top: -20px; left: 0; color: #ccc;
#cboxCurrent position: absolute; top: -20px; right: 0px; color: #ccc;
#cboxLoadingGraphic background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPJzv20nJ-YUkX6xW0ajzgfZgzqHpkmDyA3Kyc-YYK9RDpRXCsxlhhG9_XXoUU9wre2byLwrRZkelLGseXqoXYM7jR3Me0Gt0psoo2b3iAz1dfHIba5oJaUsQXni9oFpcza7JYQI1lXeAY/s32/loading.gif) no-repeat center center;
/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose border: 0; padding: 0; margin: 0; overflow: visible; width: auto; background: none;
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active outline: none;
#cboxSlideshow position: absolute; top: -20px; right: 90px; color: #fff;
#cboxPrevious position: absolute; top: 50%; left: 5px; margin-top: -32px; background: url(//sites.google.com/site/techprevue/home/controls.png) no-repeat top left; width: 28px; height: 65px; text-indent: -9999px;
#cboxPrevious:hover background-position: bottom left; #cboxNext position: absolute; top: 50%; right: 5px; margin-top: -32px; background: u(//sites.google.com/site/techprevue/home/controls.png) no-repeat top right; width: 28px; height: 65px; text-indent: -9999px;
#cboxNext:hover background-position: bottom right; #cboxClose position: absolute; top: 5px; right: 5px; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXpuz137Ot1QheAx2rKNGtF0jdZGBTEzKf-RQEJFCPgM_RMevseoGpLgKMIZFxmyO96FRU7evORM4-d82jZhqjn_Okt1ruD2n8aiQfhfDpYyZ6AnOiETCEkf8dvW5Gi_VrK1WoaOL1-vUD/s130/controls.png) no-repeat top center; width: 38px; height: 19px; text-indent: -9999px;
#cboxClose:hover background-position: bottom center;

6. Simpan template Anda dan tinggal dua langkah terakhir! Kunjungi blog Anda untuk melihatnya bekerja sempurna.
7. Temukan kode berikut body>
8. Paste kode berikut sebelum tag body>

Receive All Free Updates Via Facebook.

Ganti Sharetipsdancara menggunakan facebook fan halaman nama pengguna.
9. Simpan template Anda

SYARAT SYARAT MENJADI PUBLISHER ADSENSE PENAMPIL IKLAN OLEH GOOGLE

Oleh Cara Flexi pada tanggal October 30, 2018

Google adsense adalah perusahaan iklan milik google merupakan perusahaan iklan terbesar pada dunia internet, mungkin juga google adsense adalah perusahaan iklan terbesar pada global ketika ini. Ada jutaan orang bahkan lebih ingin ikut berpartisipasi Menjadi publisher/ penampil iklan Google. Sebagian besar dari mereka nir tertutup kemungkinan akan menerima kesempatan menjadi penampil iklan google serta mulai menerima penghasilan. Dan tidak menutup kemungkinan pula bagi pendatang baru seperti saya.

Sebelumnya Coba untuk melihat jejak orang orang yg sudah berhasil pada google adsense. Anda bisa melihat video you tube menggunakan kata kunci "Gajian Adsense" output yang di terima tergolong menggiurkan tergantung ke tekunan anda pada bekerja sama dengan google adsense. Sebenarnya buat mendapatkan akun google adsense sangat gampang bila melalui situs youtube pada banding melalui situs web/blog.
Dengan meng upload beberapa video original atau rekaman pribadi kita sudah dapat berpartisipsai dengan periklanan google. Google adsense hanya butuh waktu 48 jam/ dua hari untuk menyetujui monetize situs youtube anda. Kebanyakan akan di terima karna google kekurangan youtuber untuk menempatkan iklan. Oke kita kembali ke Syarat syarat menjadi publisher adsense, Iklan oleh Google dengan situs web/blog.
Saya memilih situs web / Blog untuk berpartisipsai dengan iklan google lantaran murah, murah yg saya maksud merupakan tidak menggunakan kuota internet yg extra untuk mengupload/menulis artikel, di banding menggunakan mengupload video. Alasan lainnya saya bukan editor video handal dan saya tidak punya ilham poly dengan video. Selain itu aktivitas blogger bisa di lakukan menggunakan memakai smartphone Simak syarat yang harus kita patuhi buat mendapatkan akun adsense.
Usia minimal 18 tahun
Seperti yang tercantum dalam Persyaratan serta Ketentuan Adsense, Google hanya dapat menerima permohonan menurut pemohon yg berusia lebih berdasarkan 18 tahun.
Memiliki situs web
Anda wajib memiliki situs web/Blog agar dapat berpartisipasi. Baca Cara Membuat Blog/Website lihat pula Panduan Video membuat Blog
Situs Anda telah aktif selama setidaknya enam bulan
Ini merupkan kondisi yg telah pada menetapkan sang google kemungkinan nir berubah. Di beberapa negara, termasuk China dan India, Google mewajibkan situs Anda telah aktif selama setidaknya enam bulan sebelum situs akan dipertimbangkan. Google mengambil langkah ini buat memastikan mutu jaringan iklan kami serta melindungi kepentingan pengiklan serta penayang yg terdapat.
Terakhir Situs/Blog mematuhi kebijakan program Google

Tidak hasil Copy paste
Tidak menampilkan konten Dewasa (porno)
Tidak melanggar copyright orang lain.
Tidak melanggar UU ITE

Tambahan Berdasarkan pengalaman saya

Situs/Blog menampilkan konten bermanfaat
Setiap artikel minimal memiliki 300 kata serta nir poly Gambar
Memiliki statistik organik
Lalu lintas yg Cukup baik.

Untuk mendapatkan statistik organik saya mempunyai thema blog yang bisa membantu buat mendapatkan statistik organik, mampu download disini Geratis template tadi tergolong simple serta mempunyai beberapa widget krusial, bisa menampilkan lebih poly post.
Saya tidak mengetahui secara persis apa itu statistik organik namun aku mencerna ini menjadi page view alami, Contoh beberapa Waktu lalu saya menulis satu artikel ketika aku publikasikan artikel tadi hanya mempunyai view 200 tetapi view blog aku mencapai 2000 view, merupakan ketika orang membaca artikel yang baru aku terbitkan mereka tidak pribadi pergi dan membaca artikel yg lainnya berdasarkan blog saya. Itu sebabnya saya menyarankan buat menulis konten yg bermanfaat.
Kita dapat menggunakan Label dan thema buat menciptakan pembaca tidak bosan di situs /Blog kita.
Label di gunakan buat mengelompokkan beberapa artikel agar waktu seseorang mencari mengenai Listrik orang tersebut menerima artikel listrik nir hanya satu, melainkan lima atau 20 artikel. Apabila seorang mencari Wisata, kumpulkan artikel wisata yg anda punya dengan tag label wisata. Serta thema menjadi pendorong buat menampilkan konten anda lebih poly menggunakan widget, Random Post, Recent post, Popular Post atau pula Post by tag label misalnya yg saya terapkan pada HOME atau Beranda situs blog aku ini.
Terakhir Aktive kan Translite Bahasa ke bahasa inggis di pengaturan Di blog anda Untuk menerima lalu lintas yang relatif baik supaya blog anda lulus seleksi google adsense, Lalulintas pengunjung yg lebih dari 11 (sebelas) negara aku fikir telah cukup baik buat mendaftar google adsense. Sekian semoga berguna. #Mendaftar #Adsense

CARA MUDAH MEMBUAT MENU NAVIGASI KEREN TANPA EDIT HTML

Oleh Anonymous pada tanggal October 29, 2018

Cara Mudah Membuat Menu Navigasi Keren Tanpa Edit HTML - Menu naviagasi merupakan menubar yg umumnya ditempatkan pada bawah header blog yg bermanfaat buat mengarahkan pembaca juga pengunjung blog menuju link yang mereka cari. Apabila selama ini banyak para blogger yg kesulitan buat cara membuatnya kali ini saya akan share tentang bagaimana cara membuat pilihan menu navigasi keren tanpa editing HTML. Dengan cara ini para blogger pemula yang belum mengetahui cara editing HTML yang memang membutuhkan ketelitian dapat membuat pilihan menu navigasi mereka dengan lebih menarik dan lebih mudah.
Menubar navigasi atau menu bar umumnya terdiri menurut beberapa tab. "Di dalam" masing-masing tab tadi berisi link yang menuju laman posting, page tidak aktif, laman label, ke website lain dll. Sebenarnya membuat tab pilihan menu nir begitu sulit. Pada dasarnya intinya sama yaitu membuat pilihan menu yang berisi beberapa link menggunakan beberapa styling dibubuhi buat daya tarik visual. Sementara link yg disusun secara vertikal, tab navigasi umumnya disusun secara horizontal.
Dalam tutorial ini kita akan menginstal bar sempurna di bawah header, loka spesial atau generik buat navigasi bar. Bar akan dibubuhi sebagai gadget melalui halaman Elemen Halaman. Keuntungan memakai gadget adalah bahwa bila Anda ingin menghapusnya nanti, hal itu dapat dilakukan menggunakan gampang tanpa mengedit HTML. Tetapi, buat melakukan itu, template wajib mempunyai tautan Gadget atau widget wadah yang aku akan menyebutnya, pada lokasi eksklusif.
Baca Juga widget artikel terkait lainnya:
- Membuat navigasi no urut halaman
- Membuat search box keren
- Membuat Widget Paypal Donation
- Membuat widget Pagerank
- Membuat bermacam-macam popular post
- Membuat widget Alexa rank terbaru
Membuat Menu Navigasi Untuk Blogger

1 Masuk ke akun Dashboard Blogger Anda >> Layout >> serta klik pada tambahkan gadget (tempatkan di bawah header seperti Screen Shot dibawah ini.)
2. Klik Tambah Gadget.
3. Gulir ke bawah Tambahkan Gadget dan pilih HTML / JavaScript.
4. Biarkan kotak judul kosong.
5. Copy serta paste kode HTML di bawah ini ke dalam kotak konten.

   height:50px;
   width:960px;
   line-height:50px;
   list-style:none;
   margin-top:10px;
   font-size:14px;

   font-weight:bold;
   overflow:hidden;
}
#tab_menu li
   float:left;
   border-right:1px solid #FFA722;
   border-left:1px solid #CC5200;
}
#tab_menu li:first-child
   border-left:none;
}
#tab_menu li:last-child
   border-right:none;
}
#tab_menu li a
   text-decoration:none;
   float:left;
   display:block;
   height:50px;
   padding:0 20px;
   color:#FFF;
}
#tab_menu li a.current, #tab_menu li a:hover, #tab_menu li a.tool:hover
   color:#622900;
   text-shadow:1px 1px 0px #E8964B;
}
#tab_menu li a.tool
   color:#000;
   text-shadow:1px 1px 0px #E8964B;
}

6. Ganti "#" menggunakan URL halaman tujuan Anda.
7. Anda bisa menerima URL dari page dengan menyalin isi alamat / URL bar browser Anda sementara Anda berada pada halaman tersebut.
8. Untuk menampilkan semua posting pada bawah label (kategori), Anda perlu link ke laman label.
9. Untuk mengganti lebar lebar pilihan menu edit: 960px.
Nah anda mampu menggantinya sesuka hati anda, atau anda sanggup mengubah background rona pada menu navigasi dengan mengubah link url background diatas yg saya tandai dengan warna merah menggunakan link url background dibawah ini, atau anda lebih senang untuk memakai rona lain, silahkan anda lihat kode rona html yang telah aku sediakan.
1.menu_bg_1

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUXZgXnrJhutnZJtcG-he9Wga18mfQiRG8ZlerP6IhywvlzFnd8t4p1YTiLbSsLAWFOujw0On8iZOQ3BrQolEelj74aVhh4l92hxSD7QqrzwPecHSG8Ij6vJfi0SWagUMH_Js-t1quQeNJ/s1600/menu_bg_1.png

2 menu_bg_2

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7-aTCNn5PD2axMJ1uhcZ206GctTsUmRYQbtTqUz9eSHjDzwP_UhrhnqATuDxQn2v3bynnXUu9Vu16AcTuwQZN7ji-E1PxuQ71LJ6t_xX2DeuWDLPzjY1oKI7cEoqpm0MRXRAv6mo4Q2ns/s1600/menu_bg_2.png

3 menu_bg_3

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1DLCgxPJ3FJiUhvedGognFP26-hCzpA-eXgwtoTBJjp4lySlsZUNWCcMOAfmQcpceyNERXvfS8HkNYTxuqihHfkM6RyRsuVsmSGPg_asLUhbXM5NYutqvo96bmoASOcJ-D8CGqwM03PCU/s1600/menu_bg_3.png

4. Menu_bg_4

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLPKn4qb8xcDh1DrxkFb6kK2CZwktXHj4vEZhZyZ1PhnCPUHHEgrPJ3BgLF7wEzp_bVkiQHcZQlN-vvVDs6q5s8co3D-yc9CmBe0IeLKNyrKIrj0sF7-WecFe1aqVlP_-Ku6cvVggCfnWD/s1600/menu_bg_4.png

5. Menu_bg_5

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTjJKS_9Paaf2RSADCHd64ow28_3qG9qGz1Nrlq5SM5CQiJzd-vXvIQGnza0YXlCp7Cd45HdbjwFyHCftypjUx00-lvX9CX0ep00H4thTOaYL97LYLXgBxHoEXejBNABHqCzvR5LGxN5xy/s1600/menu_bg_5.png

6 menu_bg_6

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKG_xG2kIw_sXsoRE088Trw54LWwRXSZ9aX1Ip8GmOvTIoqxWYpUQB-a3eLAJsUs29FklWwC-9r1ss_2hmaeRVk2mh22YL1fjnot5LGaBo1qymYFIpZKRgCBPaFaHn97v_V_y596AjpTMw/s1600/menu_bg_6.png

7 menu_bg_7

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwuBLsX5G1JDe-ChVxKHVA0zh4Ui0pkRR652kPn36eSoPVORZfxsP85ECMFGhdipWL0dYRTxQpj31UbIcL-vGyV6pQGXMrjy1lPHVHWdlMuitFEpoyOrQfQuCD9evE60Vxg8lg-amoPMrv/s1600/menu_bg_7.png

8 menu_bg_8

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_igvfJqeRFYspcbVyU_9jV5D5Guby6dqROxQHd-bE5hbPQ7iIN_71xoyFzKf8p07EXuFxuFbsf7WSsQtLMSR74ATLJ4_Wi-mI_QG1q2wX9JPl0Yp1PeV07Q0JWzpqPCfgFLW_6YCkxOd3/s1600/menu_bg_8.png

9. Menu_bg_9

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivUnQEHmusOBpSNKvLutBpT66Dls5hyiYhOaclYUSg5Opp_i-n9IafSNtcp-KRJdF5y8C0gAIgcO0HePbCAEaqm9wZKe608K7O11K1km2haHgp0Vac-nLQg5dOSR5lyB4q0CG24qT2iRlw/s1600/menu_bg_9.png

10 menu_bg_10

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRkCVcKhza-7oen9SzKmMjmf0iBCAPVMv9-hpmiubFAE6ZoB_Iz_ZSdUtbgvwG_cg0iu73itXQKoXEU-7WsYhCXVRCMkYR67iVHsHLxJL7W5xN9OPsftsad8SuktzQsvgZXRhDc0Ac-UPU/s1600/menu_bg_10.png