Cara Dan Metode Mempercantik Judul Widget Sidebar H2 Blogger

cara Dan Teknik Mempercantik Judul Widget Sidebar H2 Blogger

POSTING ini melengkapi posting sebelumnya, Mempercantik Tampilan Judul Widget (H2) Sidebar Blog.

Judul sidebar blog memang harus diperlakukan istimewa, harus unik dan menarik perhatian (eye catchy),
alasannya ia bab dari navigasi sajian dan internal link, untuk memudahkan pengunjung membuka konten blog kita.

Biasanya, widget yang dipasang di sidebar blog dan "wajib ada" a.l. Recent Posts dan Popular Post. Widget Related Posts biasanya ada di bawah posting. (Baca: 15 Widget Wajib & Tidak Perlu Dipasang di Blog).

Kode-kode sidebar heading alias judul widget sidebar (h2) ini CB share dari Blogger Spice. Anda dapat memodifnya kembali sesuai dengan selera.

cara Dan Teknik Mempercantik Judul Widget Sidebar H2 Blogger

Berikut ini beberapa tampilan Judul Sidebar H2. Kita mulai dari tampilan ibarat dalam gambar ilustrasi di atas.

1. Template > Edit HTML

2. Cari (Ctrl+F) arahan .sidebar h2 atau .sidebar-wrapper h2 dan yang semisalnya.

3. Ganti arahan tersebut dengan salah satu arahan di bawah ini:

.sidebar h2 {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJsbWgbgO0IX1Pm42w9T8S0Pp44Pq_tGGWcSa0O2xBhun3th2rUEUFvKh03id_3DR2-iBop2oMPF53y9qdLqnEnRdaJ_yIU8-fj6Hd7kobmMrgf64-o_LvQ-XRbOYLOvSLFt4SKtJEvFA6/s1600/BloggerSpice+SidebarH2.png) no-repeat scroll 0 0 transparent;
    color: #f5f5f5;
    height: 66px;
    font-size: 140%;
    font-weight: 300;
    margin: 0 0 -25px 0;
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    text-align: left;
    padding: 15px 10px 0px 15px;
    font-family: 'Oswald',Sans-Serif
}

.sidebar h2 {
padding:5px;
background:#000000;
color:#FFFFFF;
font:140% 'Oswald',Sans-Serif;
}

.sidebar h2 {
padding:5px;
border-bottom:5px solid #000000;
color:#000000;
font:140% 'Oswald',Sans-Serif;
}

.sidebar h2 {
padding:5px;
border-bottom:3px dashed #000000;
color:#000000;
font:140% 'Oswald',Sans-Serif;
}

.sidebar h2 {
padding:5px;
border:2px solid #000000;
color:#000000;
font:140% 'Oswald',Sans-Serif;
}

.sidebar h2{
background:#333;
margin:5px 4px 5px 0;
padding:9px 0 9px 10px;
border:0;
color:white;
font-size:16px;
line-height:16px;
font-family:'Oswald',sans-serif;
text-decoration:none;
text-transform:uppercase;
box-shadow:4px 4px 0px rgba(33,33,33,0.45);
}

.sidebar h2 {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJsbWgbgO0IX1Pm42w9T8S0Pp44Pq_tGGWcSa0O2xBhun3th2rUEUFvKh03id_3DR2-iBop2oMPF53y9qdLqnEnRdaJ_yIU8-fj6Hd7kobmMrgf64-o_LvQ-XRbOYLOvSLFt4SKtJEvFA6/s1600/BloggerSpice+SidebarH2.png) no-repeat scroll 0 0 transparent;
color: rgb(213,213,213);
height: 66px;
font-size: 140%;
font-weight: bold;
margin: 0 0 -28px;
position: relative;
left: -30px;
top: 0;
width: 362px;
text-align: center;
padding: 15px 0 0;
font-family: 'Oswald',Sans-Serif;
padding-bottom: 15px;
}

.sidebar h2 {
padding:10px;
text-align:center;
border-top-right-radius:30px;
border-bottom-left-radius:30px;
background:#000000;
color:#FFFFFF;
font:140% 'Oswald',Sans-Serif;
}

Demikian cara Dan Teknik Mempercantik Judul Widget Sidebar H2 Blogger. Silakan dipilih sesuai dengan template dan selera Anda.

APA? Ingin ibarat judul sidebar yang di blog CB ini? Oke, ini beliau kodenya:

.sidebar h2 {
    font: normal 300 16px 'Oswald',Arial,sans-serif;
    margin: 0 0 10px 0;
    padding: 0;
    border-bottom: 2px solid #222222;
    text-transform: uppercase;
    position: relative;
    color: #2b2b2b;
}

#sidebar h2:after {
    content: " ";
    width: 90px;
    height: 0;
    position: absolute;
    left: 0;
    bottom: -2px;
    border-bottom: 2px solid #e74c3c;
}

 #sidebar-wrapper h2:after {
    content: " ";
    width: 90px;
    height: 0;
    position: absolute;
    left: 0;
    bottom: -2px;
    border-bottom: 2px solid #e74c3c;
}

Good Luck & Happy Blogging! (https://duniainformasisemasa321.blogspot.com/).*

Sumber http://www.contohblog.com/

Artikel Terkait

Cara Dan Metode Mempercantik Judul Widget Sidebar H2 Blogger

4/ 5

Oleh Unknown

Unknown Agustus 13, 2016