Post-Title (by me)

Boring dengan corak 'post-title'
 korang? tak paham? 'post-title' tu tajuk post korang la, macam aku punye tu, ade anak itik gerak2. kan? So, sini aku bagi html percuma yang aku canai2 sendiri. .

Tapi kene lah appreciate aku. tak susahkan mention nama saya di blog anda? kan? Jangan lah jadi 'le copaste' sejati ye. HAK CIPTA SAYA.


Yang ni adalah preview background 'Post Title' yang aku dah reka.

ninja turtle terkinja-kinja:

bertukar->

P/s- bila korang halakan cursor korang ke arah 'title' itu, 'title' itu akan di 'zoom' sedikit, and ninja turtle tu akan gerak dari kanan ke kiri, then 
♪ ♫ joget2 ♫~


So, camni gamaknye. . . .

1. Korang perlu bukak Template Design > Edit Html.
2. Sebelum buat apa2, sila backup template korang. camne caranye? cari [Backup/restore], then pilih [Download full template]. sebab nanti korang akan tersilap, menyesal. yang penting adalah korang kene ingat kat mana korang 'paste'. untuk pembetulan nanti.
3. So, lepas korang dah bukak 'edit html' tu, please tekan 'Ctrl + F' untuk aktifkan 'enjin pencari', cari :

h3.post-title, .comments h4 {

atau

h3.post-title {

if tak jumpa jugak, try cari 'post-title' atau yang serupa.

4. Then, korang copy html code kat bawah ni semua  and paste selepas h3.post-title{ tu, camni 

h3.post-title {paste html code kat sini}

html code:

padding: 10px;
margin: 10px 0 10px 20px;
background: #FFFFFF;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis7k9yBtQu6ap26Ma4RrPjcmR0EK14aUBtBSJUMU1jnKP4w4TAhBcBJGxicbglB7WF6HwkmHEajgsToWM023vdhoqNuMPy2WefJIMNEP-HPT00NNvdo4Eudyw25m1JdVRj8oiG2V-f6xU/s1600/other4.gif);
background-repeat:repeat;font-family:verdana;font-size: 20px;
text-align:center;
opacity:1;filter:alpha(opacity=30);-moz-opacity:0.3;-khtml-opacity:0.3;
border: 2px solid; #000000;
-moz-border-radius: 25px 10px / 10px 25px;                

border-radius: 25px 10px / 10px 25px;    
 -o-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
}
.post-title:hover {
background:#FFFFFF;
font-size: 24px;
text-align:center;
opacity:5.0;filter:alpha(opacity=500);-moz-opacity:5.0;-khtml-opacity:5.0;-o-transform: rotate(0deg) scale(1.06) translate(-10px, 0);-moz-transform: rotate(0deg) scale(1.06) translate(-10px, 0);-webkit-transform: rotate(0deg) scale(1.06) translate(-10px, 0);}
float: left;
margin-right: 5px;
height: 17px;
width: 22px;
border:2px dotted  #fbd5dd;
-moz-border-radius: 40px 10px;
border-radius: 40px 10px;;
-o-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;}
.post-title:hover {
}
.post-title:hover  {background: #D8FFDE;
background-image:url(http://i3.glitter-graphics.org/pub/276/276283oeknvz7m8i.gif);
background-position:bottom right;
background-repeat:no-repeat;
border-top: 3px dotted#000000;
border-bottom: 3px dotted#000000;
border-left: 5px solid#000000;
border-right: 5px solid #000000;

P/s:pastikan html ni di 'paste'-kan antara pembuka, '{ ' dan penutup  '}', kalau tidak, takkan jadi.

5. Preview dulu jadi ke tidak, dan tadaaa!! dah jadi. If ade problem, sila komen. 

tips aku- kalau korang nak lebih efisyen, korang buat 1 lagi blog then try kat situ dulu, senang dan selamat.

Hak Cipta Terpelihara Mista A