Kotak Komen Comel

Nak ubah kotak komen agar nampak lebih comel seperti di bawah ini?
Bukan sahaja kita suka tengok, manalah tahu mungkin boleh menambah minat pelawat untuk komen juga kan :)


Cara nak buat mudah je. Sebelum tu, jangan lupa backup dulu template tu ye.
Cara backup template,
masuk ke bahagian
Tengok sebelah kanan atas, klik
Klik
Save File.

Cari kod di bawah. Lebih kurang pun tak pe.

#comments-block{.... #comments-block .deleted-comment{
font-style:italic;
color:gray;
}

Ambil semua kod dibawah dan gantikan semua kod di atas tadi
 

#comments-block{
margin:0;
padding:0;
}

#comments-block .comment-author {
background: #ff86a8;
border:1px solid #ff86a8;
font-size: 12px;
margin:6px 0px;
border-radius:10px 10px 0px 0px;
padding:10px;
}

#comments-block .comment-body{
margin: 0;
font-size: 13px;
border-left: 1px solid #ff86a8;
border-right: 1px solid #ff86a8;
margin-top: -7px;padding: 5px;
}

#comments-block .comment-footer{
margin:0;
font-size: 11px;
font-weight: normal;
margin-bottom: 20px;
border-left: 1px solid #ff86a8;
border-right: 1px solid #ff86a8;
border-bottom: 1px solid #ff86a8;
margin-top: -12px;
padding: 5px;
border-radius:0px 0px 10px 10px
}

#comments-block .deleted-comment{
font-style:italic;
color:gray;
}

#comments-block .comment-author a{color:#000 !important;}
#comments-block .comment-footer a, .comment-body a{color:#ff86a8 !important;}

Tips:
Kalau nak ubah warna kotak komen boleh la ubah kod warna #ff86a8




Save sahaja.

SIAPP!!
Eh, belum lagi..
Sila ke Settings / Comments

Tick Embedded below post untuk Comment Form Placement seperti gambar di bawah ini.



Itu sahaja :)
Selamat mencuba.

setiap hari duk buat tutorial je keje aku sekarang. Ada sapa-sapa tak suke? ;pKredit to Liyana Lunia, i love u lah sebab ajar Mommy Pinky :)

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Listing Comel

Masuk ke bahagian
Kemudian klik Add a Gadget
Pilih gadget seperti di bawah


Salin kod di bawah dan isi di ruang kotak ini


HTML Code pic anda<a href="url entry">Tajuk entry</a>

Tips:
Html Code untuk pic yang menarik/cute boleh usha di www.glitter-graphics.com

Contoh kod Mommy Pinky,

<img border="0" src="http://bit.ly/WqQaEU" /> <a href="http://www.mommypinky.com/2012/12/blouse-peplum-exclusive.html" target="_blank">Peplum Exclusive </a> 
<img border="0" src="http://bit.ly/WqQaEU" /> <a href="http://www.mommypinky.com/2013/02/peplum-lace-dania_5.html" target="_blank">Peplum Lace Dania </a>

Hasil seperti dibawah ini,

Peplum Exclusive
Peplum Lace Dania

Selamat mencuba :)

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Membuat blockquote

Blockquote ni memang cunn sangat kalau kita guna untuk highlight ayat dalam entry. Kalau korang rajin buat tutorial boleh jugak highlight kod html supaya mudah orang nak nampak kod mana perlu copy paste tu kan.

Contoh Ini Contoh

HAI SAYA CONTOH
YANG BACKGROUND BELAKANG NI HAA.

Cara nak buat mudah je. Sebelum tu, jangan lupa backup dulu template tu ye.
Cara backup template,
masuk ke bahagian
Tengok sebelah kanan atas, klik
Klik
Save File.


Cari kod di bawah

.post blockquote {

Tips senang nak cari kod,
Tengok keyboard korang, Tekan key Ctrl dan key F serentak.
Kalau guna Mozilla Firefox, korang akan nampak imej ni
Masukkan kod di ruang sebelah find, klik Next.

Gantikan kod

.post blockquote {
margin:1em 20px;
}

dengan kod dibawah ini

.post blockquote {
background: url(http://mykawaiistore.com/blockquote.png);
padding: 3px;
margin: 3px 3px;
border: 2px dotted #fff;
border-left: 5px solid #fbdceb;
border-right: 5px solid #fbdceb;
}

Untuk tambah efek hover bolehlah ditambah kod ini

.post blockquote:hover {
background: url(http://mykawaiistore.com/blockquotehover.png);
padding: 3px;
margin: 3px 3px;
border: 2px dotted #fff;
border-left: 5px solid #e6f6ee;
border-right: 5px solid #e6f6ee;
}

Siap ^^
Boleh ubah direct link yang berwarna merah untuk masukkan imej yang korang suka

Cara nak guna?
Bila nak letak kod atau tulisan atau apa-apa je la dalam blockquote, just highlight kan ia, dan klik simbol blockquote seperti di bawah


Nak tukar animated picture pun boleh

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Share & Like Facebook Button

Kelebihan button like & share ni ialah ia akan publish di facebook, kalau korang like entri tersebut. Dan kawan-kawan facebook lain akan teruja lah nak tengok apa yang korang like tu kan? So, traffic meningkat. Bagus kan?

Cara nak buat mudah je. Sebelum tu, jangan lupa backup dulu template tu ye.
Cara backup template,
masuk ke bahagian
Tengok sebelah kanan atas, klik
Klik
Save File.

Tandakan kotak Expand Widget Templates
Cari kod di bawah

<data:post.body/>

Tips untuk memudahkan pencarian,
Lihat keyboard korang, Tekan key Ctrl dan key F serentak.
Untuk pengguna Mozilla Firefox, korang akan nampak imej ni
Masukkan kod di ruang sebelah find, klik Next.
Paste kod ini selepas kod <data:post.body/> tadi.

Button Like

<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;layout=standard&amp;show-faces=true&amp;width=280&amp;height=24&amp;action=like&amp;colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:280px; height:24px'/>

Button Share

<div style="float:left;padding:0px;"><a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/><script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>

Siap ^^
Button like & share akan muncul dibawah entry secara automatik.
Kalau rasa nak letak button like dan share diatas setiap entry, paste kan sebelum kod

<div class='post-body entry-content'>

kredit to : www.liyanaa.com dan www.arcx13.com

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Ubah Smiley Cbox

Rasa nak buat tutorial pulak malam-malam gini. Kali ni nak share cara-cara ubah smilies @ emoticon di Cbox.

Ok,
Cbox yang memang dah sediakan smiley. Tapi versi yang boring macam ni.
Aloo, boringnyaa. Haha


So kita bagi gempak sikit jadi macam kat bawah ni ,


(Ini contoh Mommy Pinky punya tau!)

Caranya, gile kentang senang. Heh

Log In ke Cbox / Options / Smilies

Hasilnya seperti di bawah ni,

Tak payah teragak-agak REMOVE je semua smiley yang ada tu.
Ngahaha. Syuhh !



Ok, tiba masa nya untuk menggantikan dengan smiley yang lebih cute ;)
Bagi yang masih kurang arif bab url, Mommy Pinky cadangkan pergi ke emo.huhiho.com je.
Mommy Pinky tunjuk satu contoh ye.
Macam mana nak buat





Sila copy code Direct Link ye kawan-kawan

Paste code tadi pada bahagian URL
Jangan lupa tick dahulu Show Image Preview


Ruang code isi dengan smiley seperti ini :)
Ruang alt.code tu bolehla isi apa-apa yang sama maksud, contohnya hehe
Save!!

(updated : 14/06/10)
OPSS!!!
Mommy Pinky dapat banyak aduan, page emo.huhiho.com dah tak boleh view. Tak pe, Mommy Pinky akan tunjuk cara menggunakan image dari Glitter-Graphic. Lebih banyak pilihan lagi :)

Contoh : www.glitter-graphics.com/graphics/178500



Copy this HTML code to your (myspace) profile or website:
<a href="http://www.glitter-graphics.com"><img src="http://dl10.glitter-graphics.net/pub/369/369220a3hjk9pcg9.gif" width=50 height=50 border=0></a>

To post on Glitter-Graphics.com and forums, use this BB code:
[url=http://www.glitter-graphics.com][img]http://dl10.glitter-graphics.net/pub/369/369220a3hjk9pcg9.gif[/img][/url]


Url gambar boleh diambil dengan mudah melalui BB Code. Ia terletak antara [img]Url gambar[/img]

iaitu,

[url=http://www.glitter-graphics.com][img]http://dl10.glitter-graphics.net/pub/369/369170ouydbetbmz.gif[/img][/url]

url gambar adalah bahagian yang di bold kan
Seterusnya, cara adalah sama seperti diatas :)

Jadi, bila blogger lain datang komen, automatik akan keluar emoticon cute korang tu.
Selamat mencuba!


Sapa-sapa yang tak berjaya tu, cuba sampai dapat ye. Hehe

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Favicon

Ada dua cara mudah untuk ubah favicon.
Cara pertama, masuk ke bahagian

Cara ubah favicon yang paling mudah.
Ringkas dan mudah sahaja tutorial kali ini. Mommy Pinky nak tunjuk cara ubah Favourite Icon / Favicon. Ada sape-sape yang tak tau favicon tu ape? Favicon tu, icon yang terletak sebelah address website atau blog.

Contohnya blog Mommy Pinky menggunakan favicon




Bagi blogspot, icon warna oren ni la.
Kita boleh ubah tau. Nak letak gambar sendiri pun tak pe. Yang penting kena la cari atau edit URL Gambar (gif, jpg, ico, dan lain-lain) ke saiz yang lebih kecil. Ini penting supaya bila orang lain buka blog kita, tak ambil masa loading yang lama. Saiz yang bagus 50x50 pixel.

Ok caranya,


Dashboard / Layout / Edit HTML / Download Full Template

(penting sebagai backup!)


Cari code </head>
Tekan Ctrl + F untuk memudahkan pencarian.


Copy code di bawah,


<link href='URL GAMBAR' rel='SHORTCUT ICON'/>


paste kan sebelum code </head> tadi.
Ok, siap :)




Tips : Boleh upload gambar sendiri yang telah diadjust saiznya di ImageShack. Kat sini senang nak ambil URL gambar.

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---

Ubah Icon Sebelah Blog List

Nampak tak ada icon sebelah sis, hubby dan bro tu?
Cara nak buat mudah je. Sebelum tu, jangan lupa backup dulu template tu ye.

Cara backup template,
masuk ke bahagian
Tengok sebelah kanan atas, klik
Klik
Save File.

Cari kod di bawah. Lebih kurang pun tak pe.
Tips untuk memudahkan pencarian,
Lihat keyboard korang, Tekan key Ctrl dan key F serentak.
Untuk pengguna Mozilla Firefox, korang akan nampak imej ni
Masukkan kod di ruang sebelah find, klik Next.

.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-15px;
line-height:1.5em;
}

Delete semua code di atas, gantikan dengan kod di bawah
Untuk ubah icon cute, ganti je kod url imej yang berwarna merah.
gambar cute boleh cari di www.glitter-graphics.com

.sidebar ul {
list-style:none;
margin:0 0 0;
padding:10px 0 0;
}
.sidebar ul li {
background:url(http://dl8.glitter-graphics.net/pub/1866/1866928oi3l89co7v.gif) no-repeat 2px .25em;
margin:0;
padding:0 0 3px 16px;
margin-bottom:2px;
text-indent:7px;
line-height:1.3em;
}

Ok, sekarang boleh klik
Seterusnya, masuk ke bahagian
Pilih Gadget Blog List


Perkara paling penting jangan tick ruang icon tu. Kalau tak, nampak icon tu je.
Siap dah. Selamat mencuba ^^

---

Dah habis baca ke? Jemput tinggalkan komen ◕‿◕

---