Sunday, 22 September 2013
Assalamualaikum sobat.
Fuuh... akhirnya dapat inspirasi lagi nih untuk posting. Saya akan memberikan Tutorial Blog nih, ehheh seperti apa ya?? Yaitu Cara Membuat Heading Tag Menjadi Keren Yuk langsung saja, saya akan memberikan CSSnya dan cara menggunakannya, Ada Berbagai macam Tags Heading jadi sobat tinggal pilih aja yang sobat suka.
Jika Sudah Ketemu, Sobat bisa pilih macam-macam Heading Tags Dibawah ini!!
Jika Ingin Copas silahkan sertakan sumbernya!!
Fuuh... akhirnya dapat inspirasi lagi nih untuk posting. Saya akan memberikan Tutorial Blog nih, ehheh seperti apa ya?? Yaitu Cara Membuat Heading Tag Menjadi Keren Yuk langsung saja, saya akan memberikan CSSnya dan cara menggunakannya, Ada Berbagai macam Tags Heading jadi sobat tinggal pilih aja yang sobat suka.
Step:
- Login Blogger
- Masuk Ke Dashboard
- Template → Edit Html
- Cari Kode ]]></b:skin> Untuk mempermudah pencarian, sobat bisa tekan Ctrl+ F
Jika Sudah Ketemu, Sobat bisa pilih macam-macam Heading Tags Dibawah ini!!
.post h4 { background-attachment: scroll; background-color:white;background-image: url("http://2.bp.blogspot.com/-GZCR82-F- bU/UTnAhdjJ9eI/AAAAAAAAbXI/Fy0CjGpYCMM/s1600/h2.png"); background-position: 4px 50%; background-repeat: no-repeat no-repeat; border: 3px solid; border-radius: 60px 60px 60px 60px; box-shadow: 0 1px 3px, 1px 1px 0 inset; color: #333333; font-family: inherit; font-size: inherit; font-size-adjust: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 1; list-style: none outside none; margin: 15px 3px; outline: medium none; padding: 3px 10px 3px 30px; text-shadow: 0 1px 0; text-transform: uppercase; vertical-align: baseline; }
.post h4 { background-attachment: scroll; background-color: white;
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUrLDwHY81epb5Rh4rWLYy4y6i89v83rlb4eqWu50cnh2uT3GSSzvQ-RnEM5vQXHmopLzVFSDOc6Mc4_Nygb25W6fwEeeHhgCFuBaJgCPBEGqA_3fmlNSqRKmcwXX9t72WXLSu1ZWcpE4q/s1600/h2.png");
background-position: 0 50%; background-repeat: no-repeat no-repeat; border: 3px solid #0D7005; border-radius: 14px 14px 14px 14px; box-shadow: 3px 3px 3px #ABABAB; color: #25991C; font-family: Lobster,cursive; font-size: 26px; font-weight: normal; margin: 0 0 1em; padding: 0 1px 4px 34px; position: relative; text-shadow: 1px 1px 0 #000000; text-transform: capitalize; }
.post h4 {border-bottom: 1px dotted #4E555A;border-top: 1px dotted #4E555A;color: #4E555A;padding: 3px;}
.post h4{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBwiH1bYJXlZKNR4QqdYggvRgiv_hV1vCgm8_gAIEFof3b5a_a12E7eHnb9oTfSoc-q_TXhCLsgdMoAwUUYxSaogBnv4FXpBEg1HvK_VUD-LmT7QLjizoD9de3CYsUGSgbisyvGXWCcvqL/s1600/h2.png") no-repeat scroll 4px center transparent;border: 3px solid #C8C800;border-radius: 60px 60px 60px 60px;box-shadow: 0 1px 3px #C6C6C6, 1px 1px 0 rgba(255, 255, 255, 0.4) inset;color: #A5A503;font-family: 'lobster',sans-serif;font-size: 19px;font-weight: bold;line-height: 1;margin: 15px 3px;padding: 3px 10px 3px 30px;text-shadow: 0 1px 0 #CCCCCC;text-transform: uppercase;}
.post h4 {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwmeZGdlmcBzYa4cA43BWOeLGy-XxWL9IjrNAyqQanJxjKXFs7MRTTBeVS8iPjKTxfSfxoo-14Kvc6ihO-jColPBRJZGyxXVn6BXYtHL45Lx88rfIlsQis9nUXOi6vJ9ERsc72LJZK6rZy/s1600/star.png") no-repeat scroll 5px center transparent;
clear: both;color: #662D2D;font-family: 'Oswald',sans-serif;font-size: 26px;font-weight: bold;line-height: 1.2;margin: 25px 5px;padding: 6px 10px 2px 40px;text-shadow: 0 1px 0 #CCCCCC;text-transform: uppercase; }
.post h4{color:#0080ff;border-top:1px dotted #0080ff;border-bottom:1px dotted #0080ff;padding:3px;}
.post h4{text-align: center;font-weight:bold;border:solid 5px #999c3b;font-size:14px;-moz-border-radius-topleft: 75px;-moz-border-radius-topright:75px;-moz-border-radius-bottomleft:5px;-moz-border-radius-bottomright:5px;-webkit-border-top-left-radius:75px;-webkit-border-top-right-radius:75px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px;border-top-left-radius:75px;border-top-right-radius:75px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;padding:3px}
.post h4{text-align: center;font-weight:bold;border:solid 5px #0fc7ff;font-size:14px;-moz-border-radius-topleft: 75px;-moz-border-radius-topright:75px;-moz-border-radius-bottomleft:75px;-moz-border-radius-bottomright:75px;-webkit-border-top-left-radius:75px;-webkit-border-top-right-radius:75px;-webkit-border-bottom-left-radius:75px;-webkit-border-bottom-right-radius:75px;border-top-left-radius:75px;border-top-right-radius:75px;border-bottom-left-radius:75px;border-bottom-right-radius:75px;}
.post h4{line-height: 1em;color: #91b9ff;font-weight:bold;font-size: 17px;text-shadow:0px 0px 0 rgb(-365,-325,-255), 0px -1px 0 rgb(-620,-580,-510),0px -2px 1px rgba(0,0,0,1),0px -2px 1px rgba(0,0,0,0.5),0px 0px 1px rgba(0,0,0,.2);}
.post h4{ font-size: 14px; font-weight: bold; text-shadow: 0px 0px 35px #000000;}
.post h4 {color:#0000ff;border-left:10px solid #0000ff;border-right:10px solid #0000ff;padding:3px 5px 3px 20px;border-radius:15px;-moz-border-radius:15px;box-shadow:0px 0px 13px #0000ff;-webkit-box-shadow:0px 0px 13px #0000ff;-moz-box-shadow:0px 0px 13px #0000ff;}.post h3, .post h4:hover {color:#f01a1a;border-left:10px solid #f01a1a;border-right:10px solid #f01a1a;box-shadow:0px 0px 13px #f01a1a;-webkit-box-shadow:0px 0px 13px #f01a1a;-moz-box-shadow:0px 0px 13px #f01a1a;}Source Script
Keterangan:
Untuk Tulisan Berwarna Merah sobat bisa ganti dengan .post h2, .post h3, .post h5
sesuai selera sobat.
Cara Menerapkan Heading Tag
Sobat bisa lihat gambar dibawah ini
Atau Sobat bisa juga menggunakannya secara manual, caranya adalah berikut ini...
Klik Html didalam posting, Ingat!! Bukan Compose
kemudian, sobat tulis kode seperti ini
<h2> Terserah sobat mau tulis apa </h2>
<h3> Terserah sobat mau tulis apa </h3>
<h4> Terserah sobat mau tulis apa </h4>
<h5> Terserah sobat mau tulis apa </h5>
Ingat!!
Heading Tag tidak akan terlihat disaat sobat menulis Artikel. Heading Tag akan muncul setelah Artikel telah di publikasikan.
Sepertinya sudah jelas Artikel hari ini yang dapat saya sampaikan.Jika kurang jelas, sobat bisa bertanya dikomentar!!
Jika Ingin Copas silahkan sertakan sumbernya!!
31 comments
Tutorial yang bagus nie... Mantap gan..
Nice Share gan Di tunggu kunbal nya ppatz-garoet.blogspot.com :) ^_^
kenapa semua pada ikut" AHS ?
ckck..
- AHS - http://ah-shared.blogspot.com
Terima Kasih Sudah Share :3
Comment Back : http://uchiha-bunshin.blogspot.com/2013/09/cara-membuat-efek-kaca-pecah-dengan.html
Keren deh gan infonya.
thank gan informasinya sangat bermanfaat. :-d
makasih infonya gan
Kalau saya lebih sering memakai tag h3 :)
hmm..
mangap saya udah bisa :p
tapi lumayan lah buat yang belum tahu.. b-(
Lanjutkan/.
Visit : www.anbi.us
Mangap gan , ane udah bisa :p
Tapi lumayanlah buat pembelajaran :)
Komenback ya :)
http://mora-official.blogspot.com/2013/09/jasa-dan-layanan.html
Thx Gan Infonyaa
Comment Back Yaa tuparev-cyber4rt.blogspot.com
siip sob cheer
kunbal sudah meluncur sob mksih ya!!
sama" sob..
ea.. mksih
saya sih h3 h4 h5 sob :d
sama" sob,,
silahkan dicoba :)
ya blh memang, masa gk boleh =))
sipp mastah (h)
sama-sama
Thanks semua atas kunjungannya cheer
Wah jadi keren ya mas tag headingnya :-D
Ini Yang Saya Cari cari Gan
comment http://info-sahabatku.blogspot.com/2013/09/cara-buat-random-post-dengan-scroll.html
wihhh, manteb nih gan,, ane coba dulu yah.. :d
iya sob..
silahkan sob..
Good!!
Ijin coba yaa!! :d :d
Bisa membuat blog kita lebih menarik lagi dan tentunya keren ya ? :D hehe
mantap sob tanks informasi nya
Info baru lagi nih sob... thanks
Gunakanlah bahasa yang sopan
Tidak mengandung SARA (Agama, Suku, Dll)
Tidak menyertakan link aktif.
Jika melanggar syarat diatas komentar akan saya anggap SPAM
Konvert KodeMember AktifJoin This Blog