MEMBUAT ICON DI SAMPING JUDUL POSTING

Posted By UBAY
20 Nov 2010

Akhirnya belum sampai 2minggu aku dah nemuin ide posting. Ide ini datang dari temanku di sekolah yang bilang gini kurang lebih "Bay, blogmu kok bisa ada gambarnya gitu di judul postingnya??? Bawaan dari templatenya ya???" Terus aku jawab dengan jujur "Ya sih sebenarnya bawaan templatenya. Tapi, gambar aslinya nggak gitu. Itu sudah aku edit ukuran dan gambar iconnya." Nah, berawal dari percakapan itu akhirnya pulang sekolah aku mikir-mikir. "Kenapa nggak aku posting aja cara bikin icon ini ya???" Nah, akhirnya dari situ aku memutuskan untuk memposting hal tersebut. Nah contohnya yang bisa kalian lihat di blogku ini atau yang di screenshot samping ini. Nah, caranya sebenarnya mudah banget dan lagipula ini merupakan trik yang sangat umum digunakan untuk bloging dan kurang berbobot. Namun, karena kehabisan ide dan hanya ini inspirasinya ya terpaksa aku posting ini aja. Hehehehehehe...,

Ya sudah daripada curhat terus mendingan langsung aja gini caranya :

1. Login akun blog kalian
2. Masuk menu Rancangan >>> Edit HTML
3. kalian cari kode ]]></b:skin> dan copy-paste kode berikut di atasnya :


#fecha {
        display:block;
        text-align: center;
        float:left;height:65px;
        font-family: Arial, Helvetica, sans-serif;
        width:62px;
        margin:0px 5px 0 0;
        background:url(http://i833.photobucket.com/albums/zz258/NYZHAR/Untitled-4.png);
}

.fecha_dia {
        display:block;
        font-size:1.2em;
        margin:0;
        color:#336699;
        font-weight: bold;
        padding:0.7em 0 1.1em 0;
        text-align: center;
}

.fecha_mes {
        display:block;
        font-size: 0.9em;
        margin:0;
        padding-top:5px;
        color:#fff;
        font-weight: bold;
        text-align:center;
}

.fecha_ano { display:show; visibility:show; height:0; }

KETERANGAN :
:: kode css masih bisa diedit sesuai keinginan kalian ::

4. Selanjutnya kalian cari kode yang kurang lebih seperti berikut (namun, setiap template punya susunan yang berbeda):


</b:includable>
<b:includable id='post' var='post'>
  <div class='post hentry uncustomized-post-template'><div class='post_header'>

5. Copy-paste kode berikut tepat dibawah kode tersebut :


<div id='fecha'>
<script>remplaza_fecha(&#39;<data:post.timestamp/>&#39;);</script>
</div>

6. Simpan template dan lihatlah hasilnya.

SEMOGA BERMANFAAT...

Posting Komentar

Blogger Template New Plus Blue

Designed by : Ubay Nizar XML Coded by : Ubay Nizar