Membuat Widget Nav Link Teks Keren Di Blog

Kali ini aku menawarkan postingan menarik untuk teman blogger mencobanya. Saya tidak tau apa nama widget tersebut yang terang karna biasa aku menyebutnya Nav Link yasudahlah aku menawarkan judul postingan ini menjadi Membuat Widget Nav Link Teks Keren Di Blog, hehe maap untuk yang sudah paham namanya jangan di buli ya.hehehe...

Widget Nav Link Teks yang aku bahas ini cukup menarik dan juga tidak mengecewakan keren berdasarkan aku karna aku sanggup menciptakan menyerupai iklan link degan kata teks yang sanggup kita ganti secara manual di wedget nya, begitupun dengan link nya sanggup kita ganti sesuai dengan yang kita inginkan tegantung yang ingin dipasang link Teks postingan teman sendiri. Selain sanggup dipasang link internal widget Nav ini sanggup di pasang link External didalamnya.

DEMO TAMPILAN

Jika teman ingin mencobanya silahkan ikuti cara Membuat Widget Nav Link Teks Keren ini:

Pertama silahkan pasang arahan CSS dalam kotak dibawah ini terlebih dulu sempurna dibawah <style type='text/css'>.

#sidebar-sticky .widget-content{height:300px;padding:0;margin:0 auto}
.nav-link a {border-radius:4px;
display: block;
margin: 0px 0 4px;
margin-left:0px;
padding: 10px 20px 11px;
color: #000;
font-size: 16px;
font-weight:500;
-webkit-transition: color, background-color 0.5s linear;
-moz-transition: color, background-color 0.5s linear;
-o-transition: color, background-color 0.5s linear;
transition: color, background-color 0.5s linear;
}

.sidebar a {
    color: #fff;
}
#ContactForm1{display:none}
.nav-link a:hover {
background-color: #3b3d41;
}
.nav-link a:hover {
color: #c63;
}

.widgetnavlink {background:#DC143C url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT_IQmwFaC-uKL0BGucNYlwnCRZzKaKu4mB6HBSnCEHN35BML_aq-2Pv9PlW83o765RsTBUiLmEVNAyd4MJRPPdhZTGF-LaY0Z-lWRkj-058wSPHBqIRPdBQb5C1SjJXL7FZjrq4cXRz0/s1600/new-icon3.png') no-repeat right top}
.lowongan4 {background-color:#DC143C;list-style:none;padding:0}

Selanjut nya SAVE terlebih dulu arahan diatas dan silahkan masuk ke TATA LETAK untuk menambahkan arahan HTML Nav Link Teks, tambahkan JAVA Script.

Masukan arahan HTML dibawah ini :

<div class='nav-link'>

<a class='widgetnavlink' href='URL LINK POSTING' target="_blank"><i class="material-icons">&#xE7F7;</i> Membuat Widget Nav Link Teks Keren Di Blog </a>

  </div>

Yang aku blok warna MERAH silahkan masukan link sobat, dana yang aku warnai KUNING silahkan berikan judul posting sobat.
SAVE selesai..

Sobat telah berhasil Membuat Widget Nav Link Teks Keren Di Blog, silahkan cek blog teman terimakasih.
Sumber https://www.idsiteblog.com/

Share :