Mengubah jenis font
memang mendukung blog menjadi lebih enak, tetapi juga haru tetep jangan
sampai memakai font yang terlalu lebay. Berikut cara bagaimana engubah
font header, judul postingan, judul sidebar dan lain-lain pada blogger :
Langkah :
- Buka akun blogger Anda
- Masuk ke menu Template > Edit HTML > Proceed > centang 'Expand Template Widget'
- Cari kode-kode yang mirip pada kode dibawah ini :
- Kode dibawah ini mengubah jenis font judul postingan (ubah pada jenis font yang berwarna biru)
/* Posts-----------------------------------------------*/
h2.date-header{margin:1.5em 0 .5em;display:none;}
.wrapfullpost{}
.post{margin-bottom:15px;border-bottom:1px dashed #eee;text-align: justify;}
.post-title{color:#333333;margin:0 0 10px 0;padding:0;font-family:'Candy Round BTN', Arial, Times New Roman Times, Serif;font-size:24px;line-height:24px;font-weight:bold;}
- Kode dibawah ini mengubah jenis font header (karena saya memakai laman diatas header dan menaruh labels dibawah header, ubah jenis yang berwarna biru pada laman diatas header dan merah untuk label dibawah header)
.menu-primary{}
.menu-primary ul{min-width:160px}
.menu-primary li a{color:#555;text-shadow:0px 1px 0px #fff;padding:19px 15px 19px 15px;line-height:11px !important;text-decoration:none;text-transform:uppercase;font:normal 11px 'Oswald',sans-serif;border-bottom:3px solid #F1F1F1}
.menu-primary li a:hover,.menu-primary li a:active,.menu-primary li a:focus,.menu-primary li:hover > a,.menu-primary li.current-cat > a,.menu-primary li.current_page_item > a,.menu-primary li.current-menu-item > a{color:#F80508;text-shadow:0px 1px 0px #fff;outline:0;border-bottom:3px solid #F70413}
.menu-primary li li a{color:#fff;text-shadow:0px 1px 0px #000;text-transform:none;background:#F70413;padding:10px 15px;margin:0;border:0;font-weight:normal}
.menu-primary li li a:hover,.menu-primary li li a:active,.menu-primary li li a:focus,.menu-primary li li:hover > a,.menu-primary li li.current-cat > a,.menu-primary li li.current_page_item > a,.menu-primary li li.current-menu-item > a{color:#fff;text-shadow:0px 1px 0px #000;background:#D30A10;outline:0;border-bottom:0;text-decoration:none}
.menu-primary a.sf-with-ul{padding-right:20px;min-width:1px}
.menu-primary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:18px 10px 0 0}
.menu-primary li li .sf-sub-indicator{padding:9px 10px 0 0}
.wrap-menu-primary .sf-shadow ul{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgke8Nqemb7j3i-_q_KSjrayzOex-yMIUL87IWkTH3lu_Q2rpfu8LsSYUHYDNSU9AW6Nc4YyPjghJd_CBdRr2w0b0sCVBUU-Y3INgaL8tYE0rVDF7T6pXfVjM4rfRfJ3iE2tuDGvuopagiH/s0/menu-primary-shadow.png') no-repeat bottom right}
.menu-secondary-container{position:relative;height:40px;z-index:300;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxkEfGY75TPaZQQzXx_Xbhk79nTyN_IfB9OyR0X3hCLgx_uYQrlaA13ggOe79q-gZlEr7E55tHSnZPByubpa3mK2UTZU6smsVpTCwyEJCTjMyL6_97yxSiGQdmiUFDVZ-wSwVvMc_TFNWo/s0/menu-secondary-bg.png) left top repeat-x;padding-left:5px}
.menu-secondary{}
.menu-secondary ul{min-width:160px}
.menu-secondary li a{color:#555;padding:12px 15px 11px 15px;text-decoration:none;font:12px 'Oswald',sans-serif;text-transform:uppercase}
- Kode dibawah ini mengubah jenis font judul sidebar (ubah pada kode biru)
/* Sidebar Content----------------------------------------------- */
.sidebar{margin:0 0 10px 0;font-size:13px;color:#555555;}
.sidebar a{text-decoration:none;color:#555555;}
.sidebar a:hover{text-decoration:none;color:#F70413;}
.sidebar h2{background:#F2F2F2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH_54hB0JD25BdHaMvpuBW6G8ccAksVpfEbT5SmD1ldnZXoAZRJJoCmNEbU42talnGUUhFNkgvuzDMDUBAKd58-bLCB_t2lkipfuhjJkrpBt-wbPdPxcLHVDtkxoCZfeDfp_qo7I3OzIow/s0/widgettitle-list.png) 4px center no-repeat;margin:0 0 10px 0;padding:9px 0 9px 20px;border:1px solid #E0E0E0;color:#666;font-size:16px;line-height:16px;font-family:'Oswald',sans-serif;text-decoration:none;text-transform:uppercase;}
.sidebar ul{list-style-type:none;list-style:none;margin:0px;padding:0px;}
- Kode dibawah ini mengubah judul footer
/* FOOTER ----------------------------------------------- */
#footer{width:960px;margin:0px 0px 15px 0px;text-shadow:0px 1px 0px #fff;}
#copyrights{color:#434141;background:#FFF;text-align:center;padding:25px 0}
#copyrights a{color:#434141}
#copyrights a:hover{color:#434141;text-decoration:none}
#credits{color:#434141;font-size:11px;text-align:center;padding-top:15px}
#credits a{color:#434141;text-decoration:none}
#credits a:hover{text-decoration:none;color:#434141}
#footer-widgets{width:960px;background:#F6F6F6;padding:20px 0 0 0;border-top:1px solid #DBDBDB;border-top:1px solid #DBDBDB}
.footer-widget-box{width:225px;float:left;margin-left:12px}
.footer-widget-box-last{}
#footer-widgets .widget-container{color:#555;text-shadow:0px 1px 0px #fff;}
#footer-widgets .widget-container a{color:#555;text-decoration:none}
#footer-widgets .widget-container a:hover{color:#F70413;text-decoration:underline}
#footer-widgets h2{color:#333333;font-family:'Oswald',sans-serif;font-size:16px;line-height:16px;text-decoration:none;text-transform:uppercase;background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhH_54hB0JD25BdHaMvpuBW6G8ccAksVpfEbT5SmD1ldnZXoAZRJJoCmNEbU42talnGUUhFNkgvuzDMDUBAKd58-bLCB_t2lkipfuhjJkrpBt-wbPdPxcLHVDtkxoCZfeDfp_qo7I3OzIow/s0/widgettitle-list.png") no-repeat scroll 4px center #F2F2F2;border:1px solid #E0E0E0;margin:0 0 10px;padding:9px 0 9px 20px;font-weight:normal;margin-bottom:16px;}
- Kode dibawah ini mengubah jenis font pada isi konten sidebar
#crosscol-wrapper{display:none;}
.PopularPosts .item-title{font-weight:bold;padding-bottom:0.2em;text-shadow:0px 1px 0px #fff;}
.PopularPosts .widget-content ul li{padding:0.7em 0;background:none}
.widget-container{list-style-type:none;list-style:none;margin:0 0 15px 0;padding:0;color:#555;font-size:13px}
.widget-container2{list-style-type:none;list-style:none;margin:4px 0 15px 10px;padding:0;color:#3E3E3E;font-size:13px}
h3.widgettitle{background:#F2F2F2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiopqU3wMI4nqzpf5ogisV_mqrktFoaLYhJXTGSqV8GZhdeebcNUqkBDuNjoX46J__ujWM-wOcGlulYEIgykyDXLTnVXj11LtqB5JuxaE4HbirXrkO0TaH8VvBheLbOGC31fzSUEfBD7Te7/s0/widget-list.png) 4px center no-repeat;margin:0 0 10px 0;padding:9px 0 9px 20px;border:1px solid #E0E0E0;color:#666;font-size:16px;line-height:16px;font-family:'Oswald',sans-serif;text-decoration:none;text-transform:uppercase;}
Keterangan :
- Lakukan perubahan pada kode (jenis font) pada warna biru
- Anda bisa mengetahui jenis font dengan menggunakan font-font dari Microsoft Word ataupun Google Web Font
- Preview terlebih dahulu
- Save template Anda.
Related Posts
Anda sedang membaca artikel tentang Cara mengubah jenis font header, judul postingan, judul sidebar dan lain-lain pada blogger dan anda bisa menemukan artikel Cara mengubah jenis font header, judul postingan, judul sidebar dan lain-lain pada blogger ini dengan url http://blackyz-art.blogspot.com/2013/06/cara-mengubah-jenis-font-header-judul.html. Anda boleh menyebarluaskan atau mengcopy artikel Cara mengubah jenis font header, judul postingan, judul sidebar dan lain-lain pada blogger ini jika memang bermanfaat bagi anda atau teman-teman anda,namun jangan lupa untuk mencantumkan link sumbernya.