Menu Bulatan Di Blogger




Pada tutorial kali ini saya akan menerakkan bagaimana untuk menerapkan menu bulatan pada blog anda.Untuk melihat demonya bolehlah klik dibawah dan jika berkenan bolehlah terus ikuti langkah2 dibawah dengan berhati-hati supaya x terlepas ^ _ ^


Bagaimana Untuk Tambah Menu Bulatan


Langkah 1) Dari Blogger Dashboard, pergi Templates and klik pada Edit HTML
                     (Jangan lupa Download Copy of your template dahulu )



Langkah  2) Cari kode dibawah ini .
                      (Klik Ctrl dan F untuk bar carian untuk membantu mencari kode)
]]></b:skin>



                     Selepas itu copy kode dibawah dan pastekan di atas kode yang anda cari tadi .


.hapus:after {visibility: hidden;display: block;font-size: 0;line-height: 0;content: " ";clear: both;height: 0;width: 0;}.hapus { display: inline-block; }* html .hapus { height: 1%; }.hapus { display: block; }ul.system-menu {margin: 0 auto 10px;padding: 0;position: relative;-moz-user-select: none;-webkit-user-select: none;user-select: none;width: 390px}ul.system-menu li {list-style-type: none;margin: 0 5px 0 0;padding: 0;float: left;position: relative;width: 70px;height: 80px;-moz-transition: all 500ms linear;-o-transition: all 500ms linear;-webkit-transition: all 500ms linear;transition: all 500ms linear}ul.system-menu li a {position: absolute;margin: -30px 0 0 -43%;text-decoration: none;font: bold 13px/40px Arial, sans-serif;padding: 0;background: #21D319;color: transparent;-moz-border-radius: 100px;-webkit-border-radius: 100px;border-radius: 100px;display: block;width: 50px;height: 50px;text-align: center;top: 45%;left: 50%;outline: none;border: 5px inset #F8FBFC;-moz-box-shadow: 0 0 10px 4px #5E5E5E, inset 0 0 20px rgba(0, 0, 0, 0.52);-webkit-box-shadow: 0 0 10px 4px #5E5E5E, inset 0 0 20px rgba(0, 0, 0, 0.52);box-shadow: 0 0 10px 4px #5E5E5E, inset 0 0 20px rgba(0, 0, 0, 0.52);-moz-transition: all 100ms linear;-o-transition: all 100ms linear;-webkit-transition: all 100ms linear;transition: all 100ms linear}ul.system-menu li a:hover {line-height: 130px;color: #000;border-color: #C5B386;background: #FAC800;-moz-transition-delay: 0.5s;-o-transition-delay: 0.5s;-webkit-transition-delay: 0.5s;transition-delay: 0.5s}ul.system-menu li span.pembuka {position: absolute;left: 50%;margin: 0 0 0 -29%;top: 11px;width: 25px;height: 30px;background: #949596;-moz-box-shadow: 3px -3px 0 0 #ECECEC;-webkit-box-shadow: 3px -3px 0 0 #ECECEC;box-shadow: 3px -3px 0 0 #ECECEC}ul.system-menu li span.satu, ul.system-menu li span.dua, ul.system-menu li span.tiga {position: absolute;background: #F0F0F0;padding: 2px;width: 15px;left: 3px}ul.system-menu li span.satu {top: 5px}ul.system-menu li span.dua {top: 13px}ul.system-menu li span.tiga {top: 22px}.empat, .lima, .enam {position: absolute}.empat {border: 15px solid;border-color: transparent transparent #EEE transparent;top: -7px;left: 10px}.lima {padding: 4px;background: #EEE;height: 5px;top: 22px;left: 14px}.enam {padding: 4px;background: #EEE;height: 5px;top: 22px;left: 28px}.abot, .abit {position: absolute;left: 15px}.abot {width: 20px;height: 20px;background: #EEE;top: 20%;-moz-border-radius: 100px;-webkit-border-radius: 100px;border-radius: 100px}.abit {border: 10px solid;border-color: transparent transparent #EEE transparent;top: 33%}.a, .b, .c, .d {position: absolute;padding: 5px;background: #FFF7F7;top: 26%}.a {left: 25px;background: #39FF13}.b {top: 27px;left: 13px;background: #0070FF}.c {left: 25px;top: 27px;background: #FFE000}.d {left: 13px}.e, .f {position: absolute}.e {width: 15px;height: 17px;background: rgb(171, 185, 163);top: 35%;left: 32%;border: 2px solid rgb(255, 255, 255)}.f {border: 10px solid;border-color: transparent transparent rgb(255, 255, 255) transparent;top: -2px;left: 30%}ul.system-menu:hover li:not(:hover) {-moz-transform: rotate(360deg) scale(0.7);-ms-transform: rotate(360deg) scale(0.7);-o-transform: rotate(360deg) scale(0.7);-webkit-transform: rotate(360deg) scale(0.7);transform: rotate(360deg) scale(0.7)}



Langkah 3) Dari Blogger Dashboard, pergi Layout and klik pada Add a Gadget link




Langkah  2) In the pop-up window, pilih  HTML/JavaScript widget



Langkah 3) Copy-paste kode dibawah ini

<ul class='system-menu hapus'>
<li><a href="#">
<span class='empat'></span>
<span class='lima'></span>
<span class='enam'></span>Depan</a></li>
<li><a href="#"><span class='pembuka'>
<span class='satu'></span>
<span class='dua'></span>
<span class='tiga'></span></span>Artikel</a></li>
<li><a href="#"><span class='abot'></span><span class='abit'></span>Tentang</a></li>
<li><a href="#">
<span class='a'></span>
<span class='b'></span>
<span class='c'></span>
<span class='d'></span>Kategori</a></li>
<li><a href="#"><span class='e'></span><span class='f'></span>Coretan</a></li>
</ul>

Nota: Tukar # dengan URL page blog yang anda ingin letakkan anda

Artikel ini hanyalah simpanan cache dari url asal penulis yang berkebarangkalian sudah terlalu lama atau sudah dibuang :

https://www.belajarblogs.com/2016/06/menu-bulatan-di-blogger.html

Kempen Promosi dan Iklan
Kami memerlukan jasa baik anda untuk menyokong kempen pengiklanan dalam website kami. Serba sedikit anda telah membantu kami untuk mengekalkan servis percuma aggregating ini kepada semua.

Anda juga boleh memberikan sumbangan anda kepada kami dengan menghubungi kami di sini
Berapakah Income Blogger Sepenuh Masa

Berapakah Income Blogger Sepenuh Masa

papar berkaitan - pada 15/7/2021 - jumlah : 379 hits
AssalamualaikumBismillahHai hari kita tulis topik yang hangat sikit Agak lama juga aku fikir nak buat tajuk ni ka atau tidak Ada orang dia tak suka berkongsi tentang income sebab terlalu privacy Nak tunjuk nanti katanya kita riak pula tak t...
3 Seo Blog Paling Dasar Di Setting Dashboard Blogger Terbaru

3 Seo Blog Paling Dasar Di Setting Dashboard Blogger Terbaru

papar berkaitan - pada 11/7/2021 - jumlah : 268 hits
NGEBLOG bukan hanya membuat konten tapi juga menerapkan optimalisasi mesin telusur yang disebut SEO Berikut ini cara setting SEO blog paling dasar untuk blogger pemula Setelah Anda membuat blog di Blogger sebaiknya jangan lewatkan menerapka...
Kerabu Lockdown Ulam Raja Menu Simple Buat Korang Tak Henti Makan

Kerabu Lockdown Ulam Raja Menu Simple Buat Korang Tak Henti Makan

papar berkaitan - pada 28/6/2021 - jumlah : 279 hits
Lidah terasa nak jamah kerabu Menu kerabu ni memang boleh kecur liur dibuatnya Tak lalu makan pun jadi bertambah bila dihidang kerabu ikan goreng dan nasi panas Hari ni kita buat kerabu ulam raja Gerenti korang makan banyak nanti Kerabu Ula...
Resepi Grilled Lamb Shoulder Pilihan Menu Kegemaran Dania Dan Keluarga Sa

Resepi Grilled Lamb Shoulder Pilihan Menu Kegemaran Dania Dan Keluarga Sa

papar berkaitan - pada 28/6/2021 - jumlah : 264 hits
AssalamualaikumHi korang Suka lamb grill Tak kisah la bahagian kambing yang mana ianya tetap menjadi pujaan di mana mana Kalau makan kat restoran restoran ternama memang mahal la harganya kan kalau nak makan puas kena la buat sendiri Kambin...
Menu Makanan Penunjang Imun Tubuh Bagi Lansia

Menu Makanan Penunjang Imun Tubuh Bagi Lansia

papar berkaitan - pada 4/7/2021 - jumlah : 292 hits
Usia membuat tubuh semakin lemah dan kinerja sistem kekebalan tubuh juga semakin berkurang Namun kesehatan menjadi salah satu hal yang tidak bisa ditawar Karena itu penting bagi lansia untuk memenuhi menu harian agar bisa tetap memiliki day...
Kari Merah Thai Ikan Jenahak Menu Untuk Lunch

Kari Merah Thai Ikan Jenahak Menu Untuk Lunch

papar berkaitan - pada 3/7/2021 - jumlah : 556 hits
KARI MERAH THAI IKAN JENAHAK MENU UNTUK LUNCHBuka peti ais lihat apa ada didalamnya Haaa ada sekor ikan jenahak rupanya Lepas la lauk untuk makan tengahari esok ye
Jatuh Bangun Sebagai Seorang Blogger

Jatuh Bangun Sebagai Seorang Blogger

papar berkaitan - pada 10/7/2021 - jumlah : 237 hits
Awak tau tak mengapa kerjaya blogger masih lagi relevan sehingga kini Antara sebabnya adalah kerana kebanyakan orang akan membuat carian di Google Search berkaitan perkara yang ingin mereka rujuk jadi pada masa inilah kekuatan blogger dapat...
Blogger Borneo Ikut Jadwal Vaksin Covid 19 Di Kubu Raya Desa Teluk Kapuas

Blogger Borneo Ikut Jadwal Vaksin Covid 19 Di Kubu Raya Desa Teluk Kapuas

papar berkaitan - pada 8/7/2021 - jumlah : 288 hits
Jadwal Vaksin Covid 19 di Kubu Raya Ayo Vaksin Desa Teluk Kapuas mengadakan vaksin Covid 19 pada hari Rabu 7 Juli 2021 dari jam 8 pagi sampai selesai Lokasi Gedung Olah Raga Samping Kantor Desa Cukup bawa fotokopi E KTP Anda sudah bisa mend...
Google Analytic Rujukan Blogger Maksima Blog Anda

Google Analytic Rujukan Blogger Maksima Blog Anda

papar berkaitan - pada 1/7/2021 - jumlah : 220 hits
Assalamualaikum dan selamat petang kepada semua sahabat sahabat blogger Naim doakan semua sihat sihat sentiasa Bersama keluarga tercinta di rumah masing masing Sebenarnya kekeringan idea punca utama agar malas menulis tetapi malas kena sing...
Makan Steamboat Dapat Henna Free

15 Kafe Di Johor Bahru Instagrammble Muslim Friendly

Suspek Buruan Kes Samun Toreh Dicekup

Sarawak And Malaysia Can T Afford Escalating O G Disputes

Antara Projek Pungguk Rindu Bulan Tilapia M Sia Pro Hamas

Isu Calon Perdana Menteri Kembali Menjadi Tegang Di Kalangan Pemimpin Pn

Worldcoin Dan Ai

Isu Papan Tanda Aneh Dan Pelik Menteri Wilayah Masih Diam


echo '';
Memahami Fasa Renjatan Elektrik Yang Selamat dan Berbahaya Untuk Manusia

Info Dan Sinopsis Drama Berepisod Lara Kasih Slot Samarinda TV3

Senarai Lagu Tugasan Konsert Minggu 2 Gegar Vaganza 2024 Musim 11

Keputusan Markah Peserta Konsert Minggu 1 Gegar Vaganza 2024 Musim 11

Senarai Lagu Tugasan Konsert Minggu 1 Gegar Vaganza 2024 Musim 11


Elak Kenyataan Merugikan Kerajaan Perpaduan Pemuda Umno Wp

Winstar Tingkatkan Kapasiti Untuk Ambil Peluang Peralihan Tenaga Solar

Belum Ambil Spm Pelajar Melayu Cemerlang Di Sjkc Sudah Dirisik Universiti

Konsep Malaysia Madani Memacu Perkhidmatan Awam

Gegar Vaganza 11 Keputusan Konsert Pertama Dan Senarai Lagu Minggu Ke 2

Resepi Spaghetti Seafood Marinara