Topics :
Home » » Menambah Icon di Samping Judul Artikel

Menambah Icon di Samping Judul Artikel


Ungkit -  Cara Menambah Icon atau gambar kecil sebelum judul artikel atau lebih jelasnya disamping judul artikel itu dapat menarik perhatian pembaca untuk melihat artikel tersebut itu sepenuhnya kenapa? yah dengan dihiasi dan maka judul posting pun lebih mencolok dan dapat menark mata pembaca yang melihatnya.Maka dari itu saya akan beri tahu bagaimana caranya menambahkan icon/gambarnya.




Caranya :

1. Masuk Akun Blogger Anda dan klik Layout pilih Edit Html.

2. Cari Kode Css Berikut :


.post h3 {
margin:.5em 0;
padding:30px 0px 0px 45px;
font-size:120%;
<font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;

3. Cari Icon Yang ada suka misalnya icon buku dan pena yang punya gambarnya (http://tbn1.google.com/images?q=tbn:nlmFs_SO55kJ_M:http://remas-alakbar.com/images/
buku.png)
atau anda bisa mencarinya di Iconarchive.com, disana anda akan mendapatkan banyak contoh icon.

4. Ganti kode padding :
30px 0px 0px 45px; Jadi padding : 48px 0px 0px 45px; dan tambahkan height: 48px; dan background:url nya dibawah color:#333;yang jadinya seperti ini:


.post h3 {
margin:.5em 0;
padding:
48px 0px 0px 45px;
font-size:120%;
font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;
background:url(http://tbn1.google.com/images?q=tbn:nlmFs_SO55kJ_M:
http://remas-alakbar.com/images/buku.png)
no-repeat left center;

5. Save templatenya.


Selamat Mencoba dan Semoga Bermanfaat

Sumber: Gariscerdas.com

1 komentar :

  1. gimana caranya membuat menu bar seperti tu gan? bole kasih sedikit tips

    BalasHapus