Cara Membuat Navigasi Menu di Footer Blog - Hallo guys,mimin mau share nih Tutorial Blog di Blogrenanda, Pada sharing Tutorial Blog kali ini yang berjudul Cara Membuat Navigasi Menu di Footer Blog, saya telah menyediakan Tutorial Blog lengkap seperti Cara Membuat Navigasi Menu di Footer Blog . mudah-mudahan isi postingan tutorial yang mimin tulis ini dapat anda pahami. okelah, ini dia tutorialnya.

Cara Membuat Navigasi Menu di Footer Blog

BARANGKALI Anda berminat menambah navigasi menu di bagian footer atau bagian paling bawah halaman blog Anda.

Fungsinya sama dengan navigasi menu di atas header (top menu) atau navigasi menu di bawah header (main menu), yaitu menampilkan link ke halaman statis, tautan ke halaman label (posting per label), atau link eksternal.

Contoh atau demonya bisa dilihat di CB Blogger Lab bagian bawah. Ini penampakannya:

Mau bikin? Berikut ini kode dan cara memasangnya.

Cara Membuat Navigasi Menu di Footer Blog

1. Template > Edit HTML
2. Pasang Kode CSS Navigasi Menu Footer berikut ini di atas kode ]]></b:skin>

.ct-wrapper-footer {position: relative;margin: 0 auto;width: 100%;}
.footer-nav { position: relative;width: 100%;z-index: 1000;overflow: hidden;background:#f0f0f0;}
.footer-nav ul {margin: 0 auto;padding: 1em 0;text-align: center;width: 100%;}
.footer-nav li { list-style-type: none; display: inline-block; padding: 0; }
.footer-nav li a { color: #333; display: inline-block; font-style: normal !important; margin: 0 0 0 1em; padding: 0; text-decoration: none; }
.footer-nav li a:after { content: "2022"; display: inline-block; margin: 0 0 0 1em; color: #777; }
.footer-nav li:last-child a:after { display: none; }
.footer-nav ul li a:hover, .footer-nav ul li a:active { text-decoration: none; color: #0D78A5; }

3. Pasang kode HTML Navigasi Menu Footer di bawah kode footer blog Anda, misalnya di bawah kode <div class='footer'> .... kode lain.... </div>

<div class='footer-nav'>
<div class='ct-wrapper-footer'>
<ul>
<li><a href='/'>Home</a></li>
<li><a href='#'>About</a></li>
<li><a href='#'>Services</a></li>
<li><a href='#'>Contact</a></li>
<li><a href='#'>Disclaimer</a></li>
</ul>
</div>
</div>

4. Silakan edit menunya dengan mengganti kode # dengan linknya.
5. Save Template!

Cek hasilnya. Good Luck! (www.contohblog.com).*

Demikianlah Artikel Cara Membuat Navigasi Menu di Footer Blog

Sekian Tutorial dari Blogrenanda Cara Membuat Navigasi Menu di Footer Blog, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sekian postingan dari BlogRenanda.

Cara Membuat Navigasi Menu di Footer Blog

Anda sedang membaca artikel Cara Membuat Navigasi Menu di Footer Blog dan artikel ini url permalinknya adalah https://blogrenanda.blogspot.com/2017/01/cara-membuat-navigasi-menu-di-footer.html Semoga artikel ini bisa bermanfaat.

Share on Facebook

Share on Twitter

Share on Google+

Share on LinkedIn

Subscribe to receive free email updates: