Saturday, December 25, 2010

Color Code

ditaip Unknown pada 12/25/2010 09:45:00 PM 7 komen

Kod warna sangat penting dalam menggubah template kita. Contoh paling mudah yang boleh diberi ialah ubah warna tulisan dalam entry.


Contohnya :

Awan

Hanya ambil kod warna seperti dibawah ini, copy



Kemudian, paste dalam kod warna yang dihighlight dibawah. Kod kat bawah ni boleh la letak kat dalam entry korang. Senangkan?

<div style="color: #319C96;">Awan</div>

Tips:
Ganti Awan dengan entry korang.





Kod warna macam2 boleh guna kalau kreatif, kan? :)






Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Saturday, December 18, 2010

Wishlist

ditaip Unknown pada 12/18/2010 11:13:00 PM 23 komen

wishlist1

wishlist2

wishlist3

wishlist4


Untuk membuat wishlist seperti di atas,

Dashboard / Design / Edit Layout / Add a Gadget / HTML/JavaScript Add

Masukkan saja kod di bawah ini

<center>
<form name=myform>
<input type="checkbox" name="mybox" value="wishlist1" checked />wishlist1 <br />
<input type="checkbox" name="mybox" value="wishlist2" checked />wishlist2 <br />
<input type="checkbox" name="mybox" value="wishlist3" disabled />wishlist3 <br />
<input type="checkbox" name="mybox" value="wishlist4" disabled />wishlist4 <br />
</form>
</center>

Tips:

Untuk membuat kotak bertanda, letakkan kod checked
Untuk membuat kotak tanpa tanda, letakkan kod disabled
wishlist boleh diubah dengan ayat sendiri

Siap!! Save ye :)






Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Wednesday, December 15, 2010

Ubah Tajuk Sidebar kepada Bentuk Imej

ditaip Unknown pada 12/15/2010 01:04:00 PM 46 komen



Mula-mula kena tau saiz kelebaran sidebar blog kita berapa.
Tak tau nak cek saiz macam mana?
Ini caranya.

Dashboard / Layout / Edit HTML

Cari kod ini (Ctrl + F)

#sidebar-wrapper {

Kat sini kita boleh lihat ada kod
width: 260px;


So, maksudnya saiz sidebar blog MP 260px

Maka buat la imej bersaiz 260px. Buat lebih kecik tak pe asalkan jangan lebih. Haa, time ni guna la kepakaran korang design ye. Tak kesah la buat guna photoshop ke photoscape ke. MP guna dua-dua sekali Photoshop CS5 & PhotoScape. Ngeh Ngeh.Ini hasil terbaru, baru je buat tadi. Simple jek, sebab suka simple. Padahal tak reti design ngaku je la (-.-)


Macam biasa la, bila dah siap design pegi la upload pic korang tu dulu untuk ambil Url Image. Tak reti? Boleh rujuk SINI ye.
Baik, cara masukkan imej

Dashboard / Layout / Edit HTML / Download Full Template
(penting sebagai backup!)


Sila tick Expand Widget Templates


Sekarang kena cari kod Tajuk Sidebar kita. Sebagai contoh yang MP buat, untuk tajuk Frenzz. Tekan Ctrl + F dan taip Frenzz.

*sila taip dengan sama sebijik macam tajuk yang korang buat tu. Kalau huruf besar, kena buat huruf besar la ek.
Kalau tak, memang tak jumpa. Kod yang korang akan jumpa adalah seperti berikut.

<b:widget id='HTML4' locked='false' title='Frenzz' type='HTML'>

<b:includable id='main'>

<!-- only display title if it's non-empty -->

<b:if cond='data:title != &quot;&quot;'>

<h2 class="title"><data:title></data:title></h2>

</b:if>

Tukar kod ini,
<h2 class="title"><data:title></data:title></h2>

dengan kod imej ini,
<img border='0' src='URL Gambar Korang'/>

Hasil kod seperti dibawah
<b:widget id='HTML4' locked='false' title='Frenzz' type='HTML'>

<b:includable id='main'>

<!-- only display title if it's non-empty -->

<b:if cond='data:title != &quot;&quot;'>

<img border='0' src='http://img257.imageshack.us/img257/1/frenzz.png'/>

</b:if>

ini MP punya.

Ok siap. Klik Peview, dah ok, bolehla Save Template


Untuk follower widget mungkin akan ada problem. Next tutorial je ok ;)






Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Tuesday, November 9, 2010

Image Hosting

ditaip Unknown pada 11/09/2010 02:51:00 PM 11 komen

Hari ni MP nak bagi ceramah free untuk adik-adik yang masih konfius bila MP buat tutorial dan bagi arahan masukkan URL image, URL mp3 dan sebagainya.
Untuk elakkan korang rasa serabut, hari ni kita tumpukan pada URL image je dulu, ok?

Url Image tu ape sebenarnya?

Korang boleh rujuk contoh entry tutorial sebelum ni
Tutorial : Icon Cute Sebelah Bloglist

MP ada bagi arahan masukkan URL Gambar Kesukaan.
Hah, macam mana rupa nya URL Gambar / Url Image tu?

First, korang kena tau dulu gambar ni ada beberapa jenis file
Antara format-format fail imej yang paling kerap dijumpai dan digunakan adalah JPEG/JPG, GIF dan PNG.
haa, biasa nampak kann

So sekarang ni apa kaitan dengan URL image?
Nak senang kerja, ambik je gambar-gambar dari Glitter Graphics
Cara nak ambil URL Image hanya ikut step di bawah.

Pilih gambar yang korang suka, contohnya gambar kalender ni



Kalau tengok kat website Glitter Graphicsada 2 kod kat situ, abaikan Code HTML.

Copy BB code dia, korang perhati elok-elok kod ni
Url Image terletak antara [img] dan [/img]



[url=http://www.glitter-graphics.com][img]http://dl.glitter-graphics.net/pub/725/725451hqye09hovg.gif[/img][/url]

Yang MP highlight tu la Url Image
atau dikenali sebagai Direct Link.

http://dl.glitter-graphics.net/pub/725/725451hqye09hovg.gif


nampak tak kat belakang dia tu ada .gif
So, lepas ni kalau korang jumpa link yang hujung dia ada .gif ke, .png ke, .jpg ke korang faham la itu maksudnya link untuk gambar
Clear?

Baik, tadi kita belajar ambil Url Image dari Pic yang sudah siap ada BB code, senang kata ready stock la.
Macam mana plak kalau kita nak guna gambar kita sendiri @ download pic @ icon kat mana2?
Mereka ni tak de BB code.
So, macam mana nak cari Url Image dia?
Hah, di sini la kita akan masuk ke tajuk utama tutorial ni. Kita akan belajar tentang Image Hosting.


Tak payah susah-susah cari web hosting
Sebab blogspot kita ni dah memang boleh kita guna untuk upload gambar dan kenal pasti URL Imagenya dengan mudah

bersambung..





Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Sunday, November 7, 2010

Floating Button

ditaip Unknown pada 11/07/2010 03:54:00 PM 63 komen

Dah lama tak buat tutorial ek? Hari ni adik d'fiey bertanya camne agaknya nak pasang floating button kat blog kita.


Eh, floating button tu ape? Ini dia.


Haha, nak buat ni senang je, sebab tu cepat je buat tutorial ni. Heh. Ikut saje step kat bawah ni ye :)

Dashboard / Design / Page Elements / Add A Gadget / HTML/Javascript.

Ok, sekarang copy code dibawah ni dan paste di ruang Content HTML/Javascript

<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>

<div style='display:scroll; position:fixed; top:140px; left:-12px;'>

<a class='linkopacity' href='http://www.facebook.com/zanariahmohdnasir' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/232.png" /></a><br />

<a class='linkopacity' href='http://twitter.com/mommypinky' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/432.png" /></a><br />

<a class='linkopacity' href='http://www.blogger.com/home' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/blogger_64x64.png" /></a><br />


</div>


Haip, belum siap lagi..kat atas ni code Mommy Pinky yang punya..haha. Sila la tukar Url yang di bold dengan Url akaun anda sendiri ye!!

Kalau rasa tak cukup 3 buttons je, hanya tambah code kat bawah ni dan adjust la sendiri. Hua Hua.


<a class='linkopacity' href='LINK ADDRESS' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="URL IMAGE" /></a><br />


Tips :
Kedudukan floating buttons boleh diubah di 140px,

Left tu boleh ubah kepada Right kalau nak floating buttons kat belah kanan blog korang.. :)

Tak berkenan gambar kat atas tu? Boleh ubah url image yang berwarna biru, cari sendiri icon yang korang suka. Mommy Pinky suke cari kat sini :) KLIK

Dah siap, SAVE!!

Kredit



Ada apa-apa kurang faham, tinggalkan komen ok. InsyaAllah, mommy tolong pahamkan..tapi lmbat la kot, masa terhad..ekeke~





Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Saturday, October 2, 2010

Entry dengan Password

ditaip Unknown pada 10/02/2010 06:02:00 PM 18 komen



Key






 

 


Plain Text






 

 



Cipher Text






 

 


HTML Code




Standard
     
Inline
     
***








Entri rahsia @ personal mungkin diperlukan oleh kalian tak kesah la ape sahaja alasannya. Malu ke, perlukan privasi ke, saje nak tengok ada yang berminat nak baca ke. Hehe. Tak pun macam kes aku. Ngeh Ngeh
Ape pun, sila jangan lupa baca doa sebelum mulakan tutorial ni. Bimbang tak jadi ;)

Ok, macam biasa,

Dashboard / Layout / Edit HTML / Download Full Template
(penting sebagai backup!)
Cari code <head>
(Tekan Ctrl + f untuk memudahkan pencarian)

dah jumpa?

copy code dibawah nie, dan paste di bawah code <head> tadi









<script src='http://www.vincentcheung.ca/jsencryption/jsencryption.js' type='text/javascript'/>









SAVE!!

Ok, tamat di situ.

Sekarang, macam mana nak buat entri berpassword?

Masuk ke website ini CLICK










Di ruang Key boleh la masukkan password yang korang suke,




Di ruang Plain Text ialah bahagian entri anda. Copy & paste je.




Click Encrypt






Sebaik sahaja korang click Encrypt tu, automatik code html akan keluar. So, copy and paste sahaja di ruangan New Post & Publish Post.







Selamat mencuba :)










Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Saturday, August 28, 2010

Masukkan Video dari Facebook ke dalam Entry

ditaip Unknown pada 8/28/2010 01:47:00 PM 13 komen

Assalamualaikum, para sahabat yang disayangi. Hehe. Wah, banyak juga yang berminat nak tau cara masukkan video dari FB nie ek? Ingat kan tak de yang berminat. Hehe. Sebelum diteruskan, marilah kita semua sama-sama mengucapkan terima kasih kepada Sifu Mr Piratz yang sudi berkongsi tutorial ini. Jika berminat, boleh belajar dari blog beliau di SINI.

Tutorial nie semata-mata untuk berkongsi dengan sahabat-sahabat diluar sana dan juga sebagai simpanan peribadi. Dah lama tau cari tutorial nie. Puas duk Google. Huhu.


Baik, tanpa membuang masa lagi, mula-mula korang kena la login ke Facebook dan pilih dulu video mana yang korang nak share kat dalam entry. Hei, kalau tak de akaun FB kena la join FB dulu. Pastu, add la Mommy Pinky sekali. Wah2, sempat plak promote diri. Kuikui~

Dapatkan Video ID
Sebagai contoh, bagi Videos Posted by Brenda Garcia
Hihi, comelkan?

Video ID ialah seperti di bawah
(tengok bahagian address kat atas tu)


bagi clear sket pic nie,

jadi, Video ID = 1227575495369


Seterusnya, apa yang perlu dilakukan hanyalah Copy Code dibawah, dan masukkan ke dalam entry,

Dashboard / New Post / Edit Html


<center><object width="500" height="400" >
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="movie" value="http://www.facebook.com/v/xxxxxxxx" />
<embed src="http://www.facebook.com/v/xxxxxxxx" type="application/x-shockwave-flash"
allowscriptaccess="always" allowfullscreen="true" width="500" height="400">
</embed>
</object></center>


Gantikan xxxxxxxx dengan Video ID

Note: Nak ubah saiz video, ubah sahaja di bahagian width & height. Ok siap :)



Selamat Mencuba :)
Kalau tak jadi mungkin sebab terlupa baca Bismillah ;)






Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Friday, August 27, 2010

Tukar Older Post, Home, Newer Post kepada Imej/ Icon

ditaip Unknown pada 8/27/2010 12:48:00 AM 42 komen

Assalamualaikum, sudah lama tak buat tutorial kan. Kali nie, request dari adik Lieyan Chantek. Sorry, agak lama baru nak buat tutorial ni. Nasib baik request tutorial yang senang je. Hanya ubah-ubah kod sikit. Sedikit nasihat, kalau nak cantikkan blog jangan takut untuk bermain dengan kod-kod anda. Saya juga bermula dari zero seperti kamu, kamu dan kamu yang sedang makan di tepi tu. Hei, tak puasa ke?

Kadang-kadang kita tak boleh harap kan orang lain sangat. Kita sendiri kena usaha tau. Kalau kamu hanya harap kan pertolongan orang, susah nak maju. Ketahui la bahawa template blog kita tak sama seratus peratus, so, jangan la cepat melatah bila tak jumpa kod-kod yang diperlu kan. Try n error saja. Yang penting back up dahulu template kamu tu. Haih membebel plak tengah hari buta begini.


Ok, ok, nie soalan adik Lieyan Chantek,


Tulisan2 dibawah ini boleh diubah kepada imej / icon yang menarik kamu tau?



Ok, macam biasa,


Dashboard / Layout / Edit HTML / Download Full Template
(penting sebagai backup!)

Sila tick Expand Widget Templates
Cari code dibawah ni (Tekan Ctrl + f untuk memudahkan pencarian)



<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

</div>



Tulisan yang berwarna + bold tu tukar dengan kod di bawah


<img src="Image URL" />



Begini contohnya,


<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><img src='http://img507.imageshack.us/img507/4343/leftq.png'/></a>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><img src='http://img94.imageshack.us/img94/3545/rightyx.png'/></a>
</span>
</b:if>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img src='http://img535.imageshack.us/img535/606/homeb.png'/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><img src='http://img535.imageshack.us/img535/606/homeb.png'/></a>
</b:if>
</b:if>

</div>



Hasil adalah seperti di bawah,





Oh, icon menarik boleh cari di SINI. Tak tau cara nak guna icon tu? Rujuk SINI. Selamat Mencuba :)







Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Tuesday, July 20, 2010

Pasang Lagu Dalam Entry

ditaip Unknown pada 7/20/2010 05:42:00 PM 16 komen

Bagaimana nak isi lagu dalam entry. Contohnya dalam entry

1. BB Girl, eh BB Boy, eh eh
2. Tak sukenya kena tinggal :'((

Mommy Pinky belajar buat tutorial ni melalui blog Zack Zukhairi sebenarnya. Ade sesape tak kenal budak nih? Heh. Urmm..bukan la bermakna dia buat tutorial, tapi dia yang share link tempat belajar tu iaitu di blog rojakStory. Kalau nak belajar dari situ terus pun tak pe. Senang je. Lagi pun banyak lagi tutorial menarik kat situ :)

Ok, ini cara Mommy Pinky. Bahan-bahan yang wajib ada,

1. Lagu yang berformat MP3
2. File hosting : FileDen (sila daftar dulu ye kawan-kawan)

Tujuan kita daftar dengan Fileden ni, supaya kita dapat Direct Link untuk sesuatu mp3 yang kita nak gunakan nanti. Ada faham? :)

Ok, caranya

Selepas berjaya daftar, pergi ke Upload & upload lagu pilihan anda. Ingat, pastikan lagu tersebut berformat mp3. Kalau tak, memang tak jadi. Hehe.

Cara Upload, ikut je kat bawah ni, satu-satu Mommy Pinky tunjukkan. Suke tak? Hehe.


Klik Upload


Continue To File Uploader



Mommy Pinky lebih suke guna uploader yang lama. Sebab new uploader selalu corrupt. Penat je tunggu. Heh. Sebab tu, Mommy Pinky suggest korang klik je kat situ. Hehe.


Sekarang untuk pilih lagu dari Music Folder anda, klik Browse tu



Mommy Pinky pilih lagu Siti Nurhaliza, okeh. Contoh je ni.


Klik Upload, dan boleh la pergi menonton tv ke, blogwalking ke sebab memang berjanggut kalau nak tunggu..Haha


Ok, ini hasilnya. Tapi kita tak nak code yang ini.

Klik Direct URLs tu, code yang diperlukan akan terpapar di dalam box tu. Sila copy ye, jangan tengok je.. :)

Copy code di bawah ini,


<object id="audioplayer1" data="http://www.stormpages.com/rojakamoi/player.swf" width="290" height="24" type="application/x-shockwave-flash"><br/><param value="http://www.stormpages.com/rojakamoi/player.swf" name="movie"/><br/><param value="playerID=1&amp;soundFile=http://www.fileden.com/files/2010/3/1/2779493/Siti_Nurhaliza_-_Tahajjud_Cinta_-_06_-_Pintu_Rindu.mp3" name="FlashVars"/></object>


Gantikan kod berwarna biru dengan direct link anda. Ok, hasilnya seperti dibawah ini :)

Kalau tak berkenan bentuk mp3 nie, ada lagi satu yang korang boleh guna. Klik kat sini Muzicons
Klik URL
Paste direct link di dalam kotak seperti diatas. Seterusnya, korang bolehlah ubah warna dan sebagainya ikut kegemaran. Ambil code html dibahagian result untuk diletakkan dalam entry, ok :) Ini contohnya yang Mommy Pinky buat. Huhuh~ Selamat Mencuba :)
Panjangnya tutorial, harap korang faham :)





Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Monday, June 14, 2010

Ubahsuai LinkWithin

ditaip Unknown pada 6/14/2010 09:30:00 AM 34 komen


LinkWithin ialah widget blog yang muncul di bawah setiap pos, menghubungkan kepada cerita berkaitan dari arkib blog kita. Kelebihan yang unik ialah ia dipaparkan dalam bentuk thumbnail jadi, pengunjung akan lebih berminat untuk melihat entry kita yang lepas². Bagi yang masih belum menggunakan widget ini bolehlah install dulu disini ye www.linkwithin.com


Widget ini boleh diubahsuai supaya kelihatan seperti di atas. Ayat asal "Anda mungkin juga meminati:" boleh ditukar kepada ayat anda sendiri. Malah boleh ditambah juga gambar atau icon comel. Caranya mudah sahaja. Hanya tambah sahaja kod di bawah ini di atas kod LinkWithin tersebut.

<script>linkwithin_text=' <img src="alamat url gambar" border=0> Ayat Yang Ingin Dimasukkan ' </script>

Ini contoh kod yang betul

<script>linkwithin_text=' <img src="http://dl10.glitter-graphics.net/pub/369/369220a3hjk9pcg9.gif" border=0> Entry Ini Menarik Juga Tau ! ' </script>
<script>
var linkwithin_site_id = 1549651;
</script>
<script src="http://www.linkwithin.com/widget.js"></script>

Save. Siap ^^
Selamat mencuba ye.





Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Wednesday, June 2, 2010

Reply Komen

ditaip Unknown pada 6/02/2010 11:47:00 AM 75 komen



Dengan adanya reply di bahagian komen akan memudahkan tuan blog balas komen pengunjung. Berminat tak? Hasilnya seperti di bawah ini.


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
<b:include data='comment' name='commentDeleteIcon'/>

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.

Copy pula code di bawah ini dan paste di bawah code tadi,
<span class='comment-reply'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=YOUR BLOG ID&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'>[Reply to Comment]</a></span>

Haip, belum siap lagi.

Ambil Blog ID anda, dan gantikan di YOUR BLOG ID

Tak tau Blog ID tu ape?
Cuba tengok atas, bahagian address link sekarang. Semua nombor selepas blogID tu la Blog ID anda :)

Tak faham lagi? Perhati pic dibawah ni



Ok Sekarang Boleh Save :)

Ops, nak tukar ayat?

tukar di [Reply to comment]

Kalau nak tukar ke gambar cute, tukar [Reply to comment] tu dengan code di bawah ni,

<img alt='Reply To This Comment' src='URL GAMBAR ANDA'/>


Ouh, selamat mencuba :)
erk, Mommy Pinky tak test pun tutorial ni..kalau tak jadi, tolong beritahu ok ;)
Credit to : Sue





Dah habis baca ke? Jemput tinggalkan komen ◕‿◕



Monday, May 24, 2010

Kotak Komen Comel

ditaip Unknown pada 5/24/2010 11:32:00 AM 63 komen


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 ◕‿◕



Sunday, May 23, 2010

Listing Comel

ditaip Unknown pada 5/23/2010 09:44:00 PM 10 komen


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

ditaip Unknown pada 5/23/2010 06:16:00 PM 31 komen

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 ◕‿◕



 

Sign in
Copyright © 2021. All rights reserved
Hannah Marketing (002548446-P)