TycoBlogger - Zon Untuk Blogger™

TUTORIAL: Kotak Komen Facebook Untuk Blogger

2010-05-22T23:07:00.000+08:00

Tutorial kali ini aku dapat di AllBlogTools. So, aku nak share dengan korang yang berminat. Tutorial dan hack untuk letakkan kotak komen seperti di Facebook. Hanya untuk Blogger blogspot. Seperti gambar di bawah:

Caranya mudah.

1) Korang perlu "matikan" kotak komen default untuk blogger. Pergi ke Settings >> Comments dan setkan "hide". Then save.

2) Pergi ke Facebook Developers untuk create application bagi mendapatkan ID.

Di situ, korang isikan:
Site name:
Site URL:
Locale:

dan kemudian klik "Create Application". Akan keluar page seperti di bawah:

Copy nombor ID aplikasi tersebut.

3) Copy kod di bawah dan korang perlu edit sedikit untuk kesesuaian blog korang.

<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'ID APLIKASI', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
<fb:comments width='450' xid='NAMA KOTAK KOMEN'/>
</b:if>

ID APLIKASI:No ID aplikasi yang korang dapat di Facebook tadi
450: Kelebaran kotak komen ikut blog korang
NAMA KOTAK KOMEN: Nama ni ikut suka korang. Boleh guna blog korang, nama korang. Apa saja tetapi jangan ada space antara nama.

4) Dah selesai edit, copy semua kod tersebut dan korang pergi ke Dashboard >> Layout >> Edit HTML dan pastikan "Expand Widget Templates" di tik. Cari tag:

<data:post.body/>

Kemudian masukkan kod yang dicopy tadi SELEPAS tag tersebut.Preview atau klik save jika tiada kesilapan. Walaaaaaa..siap!!!
Mudah kan? Try it for yourself. Nak demo, klik kat SINI. Try komen. Kotak komen ini juga boleh auto post komen korang ke wall profile korang di Facebook.

Cara Meletakkan Cloud Tag Animasi Flash Untuk Blogger

2010-05-03T00:01:00.000+08:00

Dah terlewat agaknya aku nak share benda ni. Tapi tadi round tengok kat shoutbox, ada yang bertanya, maku aku rajinkan diri membuat tutorial ni. Widget untuk kali ini adalah Flash Animated Cloud Tag iaitu widget untuk tag label tetapi di dalam bentuk animasi flash. Seperti yang ada di sidebar (Labels) kanan blog ini. Atau contoh gambar di bawah:

So, bagi yang belum ada di blog korang, boleh cuba gunakan widget ni. Caranya mudah:

1) Pergi ke Dashboard >> Layout >> Edit HTML dan cari (tekan ctrl+f pada keyboard) tag seperti di bawah:

<b:section class='sidebar' id='sidebar' preferred='yes'>

2) Copy kod di bawah dan masukkan SELEPAS tag di atas.

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "300", "300", "7", "#9e9e9e");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x205559");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

3) Klik preview dan kalau tak ada apa yang salah, klik save.

**NOTA** Korang boleh edit mengikut kesesuaian blog korang.
300 - Untuk KELEBARAN
300 - Untuk KETINGGIAN
9e9e9e - Untuk warna BACKGROUND
205559 - Untuk warna FONT

Pergi ke Dashboard >> Layout >> Page Elements dan drag widget ini mengikut tempat di mana korang nak letak.

So, itu saja. Try ye.

Selamatkan Isi Post Blog!!!

2010-04-28T19:00:00.000+08:00

Dek kerana tak tau nak post apa dan kebuntuan akal, aku pun merajinkan la diri untuk menukar template blog ni. Jenuh gak nak memilih template yang ada. FYI, aku ni memang la malas nak edit template, nak tukar-tukar background pada template walau pun aku tau nak buat. Sebab aku tak terlalu obses pada wajah template. Aku lebih prefer pada layout.

Sebelum ni, aku gunakan template RedHat Dashboard. Best template tersebut. Kemas tapi stylish dan nampak profesional. Aku je yang godeh-godeh jadi huru-hara. Hehehe. So, sekarang aku gunakan pula template baru. Template ni namanya GAMMA RAY. Dibuat oleh be-insight. Be-insight sememangnya menyediakan template yang berkualiti tinggi seperti The Antagonist.

Ok2. Lari tajuk jap. Sebenarnya aku nak share tentang cara untuk "selamatkan" isi blog korang.

Sebelum ini, aku ada bagi tutorial tentang disable right click, disable copy image dan sebagainya, kali ini aku akan share tentang disable highlight. Apa fungsinya? Disable highlight akan membolehkan isi atau ayat-ayat di dalam sebuah post "terselamat" daripada dicopy. Ini kerana, jika kita hanya mempunyai disable right click, ayat-ayat di dalam post masih boleh dan dicopy dengan menekan butang "Ctrl+C" pada keyboard. Jadi, kaedah kali ini akan menidakkan cara tersebut. Bagaimana untuk mengaplikasikannya? Mudah.

1) Pergi ke Dashboard >> Layout >> Page Elements dan klik pada "Add A Gadget".
Pilih HTML/Javascript dan korang masukkan kod di bawah:-

<script type="text/javascript">

//form tags to omit in NS6+:
var omitformtags=["input", "textarea", "select"]

omitformtags=omitformtags.join("|")

function disableselect(e){
if (omitformtags.indexOf(e.target.tagName.toLowerCase())==-1)
return false
}

function reEnable(){
return true
}

if (typeof document.onselectstart!="undefined")
document.onselectstart=new Function ("return false")
else{
document.onmousedown=disableselect
document.onmouseup=reEnable
}

</script>

2) Klik save dan lihat hasilnya. Itu saja.

Tutorial Facebook "Like" Untuk Blogger

2010-04-26T13:36:00.001+08:00

Bagi semua pengguna Facebook, tentunya arif tentang butang "Like". Baru-baru ini Facebook telah melancarkan plugin. Bagi pengguna WordPress, mudah kerana hanya install plugin tersebut dan aktifkan. Bagaimana kita ingin gunakan dalam Blogger pula? Jika korang berminat, ikut langkah mudah berikut:

1) Pergi ke Dashboard >> Layout >> Edit HTML dan tik pada kotak "Expand Widget Templates".

2) Kemudian cari tag:

<div class='post-header-line-1'/>

Jika tiada, cari pula tag di bawah:

<data:post.body/>

3) Copy kod di bawah dan masukkan SEBELUM (di atas post) atau SELEPAS (di bawah post):-

<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>

4) Preview atau klik save.

**NOTA**Untuk like, boleh ditukarkan kepada recommend. Untuk arial (font), boleh ditukarkan kepada salah satu senarai font di bawah:

lucida+grande
segoe+ui
tahoma
trebuchet+ms
verdana

Dan untuk light, boleh ditukarkan kepada dark atau evil.

Demo boleh dilihat pada bawah post ini. Try klik untuk lihat hasilnya. Selamat mencuba.

Tutorial: 2 Kolum Pada Header

2010-04-14T01:36:00.002+08:00

Salam kembali. Hampir sebulan aku tak update blog ni. Maaf sangat-sangat. Aku menyibukkan diri dengan WordPress. Bertapa selama hampir sebulan untuk belajar php coding pula. Masih banyak lagi yang perlu dipelajari. Terima kasih kepada yang still menziarahi blog ni walaupun tanpa sebarang update. Bersyukur juga kerana still dalam search engine seperti Google, rank blog aku ni agak baik dari segi carian keyword.

Oh ya, setelah belajar sedikit sebanyak tentang WordPress, aku dah pun ada domain sendiri. AirielKayz.com. So, kalau ada kesempatan, jenguk-jenguk la blog rasmi personal aku tu. Komen dan pendapat dari korang memang aku amat hargai. Macam mana aku dapat domain tu, ada aku cerita di blog tu. Daftar la jadi ahli kat blog aku tu kalau sudi. Hehehe..

Balik kepada topik, kali ni, tutorial yang aku nak beri adalah tentang 2 kolum pada header. Iaitu kita "pecahkan" header blog kita menjadi 2 kolum.

Contoh 2 Kolum Header

Contoh 2 Kolum Header Untuk Add Widget

Kenapa nak ada 2 kolum pada header? Ada banyak kelebihan 2 kolum pada header. Kalau dilihat pada contoh gambar di atas, boleh dilihat aku meletakkan saiz banner iklan yang berukuran 728x90. Ini sesuai untuk mereka yang ingin optimiskan pengiklanan di blog. So, boleh la korang letak banner Nuffnang ke, Advertlets ke atau apa-apa saja banner yang berukuran saiz maksima 728x90 (aku agak je saiz maksima tu sebab aku takde banner yang lebih besar dari tu).

Caranya?

1- Pergi ke Dashboard >> Layout >> Edit HTML dan anda cari(ctrl+F) kod seperti di bawah:-

/* Header----------------------------------------------- */

#header-wrapper {width:960px;margin:0 auto 0px;height:120px;}

#head-inner {width:230px;background-position: left;margin-left: auto;margin-right: auto;float:left;}

#header {margin: 0px;text-align: left;color:#ffcc66;}

2- Highlightkan semua kod tersebut dan gantikan dengan kod di bawah:-

/* Header----------------------------------------------- */

#header-wrapper {width:960px;margin:0 auto 0px;height:120px;}

#head-inner {width:230px;background-position: left;margin-left: auto;margin-right: auto;float:left;}

#header {margin: 0px;text-align: left;color:#ffcc66;}

#r_head{width:730px;float:left;}

3- Selepas itu, cari pula kod seperti di bawah:-

<div id='header-wrapper'><b:section class='header' id='header' maxwidgets='1' showaddelement='no'><b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/></b:section></div>

4- Gantikan kod di atas dengan kod di bawah:-

<div id='header-wrapper'><div id='head-inner'><b:section class='header' id='header' maxwidgets='1' showaddelement='no'><b:widget id='Header1' locked='true' title='Test Blog (Header)' type='Header'/></b:section></div><div id='r_head'><b:section class='header' id='header2' preferred='yes'/></div></div>

5- Selepas puas hati, klik preview atau terus save. Then lihat hasilnya.
Selesai.
Untuk demo, boleh lihat di SINI.

Adios...

Blogwalking: Undangan Ziarah atau Spam?

2010-03-19T14:31:00.001+08:00

Gambar di atas tu aku ambik screenshot kt GB(GengBlogger) untuk aktiviti terkini. Aku malas nak terangkan apa citer pasal gambar tu. Korang tengok, korang faham la sendiri.

Yang aku nak mencarut di sini, tentang style blogwalking sesetengah blogger. Singgah di shoutbox blog orang lain dan tinggalkan jejak. Bagus amalan blogwalking tu. Memang patut.

Pernah dapat ucapan kat shout box yang ala-ala di bawah?
"Cantiknya blog awak... jom follow saya?"

"Isi blog ni menarik. Saya follow, follow saya balik ye?"

"Bagus blog ni, banyak info".

Bagi blogger yang baru, memang seronok sebab fikir blog dapat pujian. Tapi bila dia pula blogwalking ke blog lain, dia ternampak ucapan yang sama di shoutbox dan dari orang yang sama. Apa perasaannya?

Pernah aku blogwalking ke satu blog. Ada satu ucapan di shoubox,"nice blog.. banyak info dalam blog ni".... Aku dok belek satu2 post kat blog tu. Tak ada pun sebarang info. Yang ada cite pasal gaduh dengan pakwe, rindu pakwe. Tu je. Tak tau la kalau itu dikatakan info. Dan satu lagi, pernah gak blog aku dapat ucapan, "cantik la blog ni... saya suka warna-warninya". Jadahnya aih cantik warna-warni sedangkan blog aku tak pernah ada warna-warni . Dan kebetulan masa dapat ucapan tu, blog aku memang warna hitam. Melucukan.

Ada pulak yang tinggalkan ucapan,"follow blog saya ye..nantu saya follow awak balik". What the heck... For what? Dengan harapan orang akan follow blog tu, then baru nak follow balik? Ikut korang la ye. Mana yang sedapkan hati korang.

Tak salah memuji blog yang dilawati. Tapi biarlah dari hati yang ikhlas. Ini kata isi blog tu menarik, tapi sepatah ayat pun tak baca. Bagi blogger yang dah lama, memang dah tak pelik benda macam ni. Tapi bagi blogger yang baru nak belajar blog, kesian la kat mereka. Berbunga-bunga hati bila dapat pujian blog kat shoutbox. Rupanya dapat tahu, ucapan dari orang tu sama je dengan yang ada kat blog orang lain oleh blogger yang sama.

Memadailah tinggalkan jejak macam,"Salam ziarah", "blogwalking petang2", "up traffic", "nuff zzzz" atau macam yang terbaru ni si TubeLawak yang memang begitu rajin blogwalking(kat shoutbox aku penuh dgn id TubeLawak). Cara macam ni memang aku tak kisah sebab memang dia ngaku pun tak baca post kat blog aku. Hahaha.. Saja nak naikkan traffic dan bagitau aku yang dia ada post baru. Aku lebih suka cara TubeLawak ni. Daripada yang datang bagi ucapan pujian tapi rupanya sama dengan yang ada di blog lain. Terus terang, memang aku takkan follow blog yang macam ni. Sekali dua boleh la tahan. Bila dah banyak kali, jelek. Adakah ini Spammer? Ntah la.

Sama la macam yang ada kat GB sekarang ni. Duk copy kata aluan then paste kat setiap proile. Untuk apa? Nak dapat status Blogger Friendly? What the heck... Adeh, korang ni macam-macam la. Bila tengok kat list Aktiviti Terkini macam gambar di atas tu, tak ke menjelekkan? Orang yang sama, ucapan yang sama, style yang sama dan berturut-turut. So annoying. Mungkin ini bukan Spammer. Tapi style yang sama. Huhuhuhu.

Apa pun, ini pendapat peribadi aku je. Aku tak kisah. Korang nak spam ke, nak link iklan ke kat shoutbox aku, aku tak kisah. Ada rezeki korang, ada la orang klik.

Yang penting, ikhlas la bila buat sesuatu tu. Hehehehe. Bukan marah.. Saja merapu petang hari ni.. Salah, kata, harap maaf.

Adios...

Icon Social Media Untuk Blog

2010-03-19T12:29:00.000+08:00

Salam kembali...

Agak "bz" lately sebab baru mula nak guna WordPress. Huhuhu, orang dah lama guna, aku baru nak belajar. Itu pun hanya guna domain dan hosting free je ( http://akutypo.byethost17.com ). Apa pun, coding WP lagi mencabar. But fun. Nak faham betul-betul coding WP, mungkin aku akan buat pula blog tutorial untuk WP. Hehehe.. So, minta maaf sangat-sangat sebab tak berkesempatan nak update blog kebelakangan ni.

Hari ni, buah tangan aku hanya icon media sosial seperti gambar di bawah. Sesuai untuk mereka yang mempunyai template blog yang berwarna hijau (lately ni makin banyak lak blog berwarna hijau) atau ada unsur-unsur hijau, boleh gunakan icon media sosial ni.

Ada 108 icon semuanya dan dalam format PNG. So, kalau minat, boleh download di SINI.

Widgets: Meletakkan Emoticon Yahoo Pada Komen

2010-03-12T15:44:00.001+08:00

Saja aku nak bagi kaedah "lapuk" ni untuk korang. Almaklumlah, banyak blog sekarang yang dah guna sistem komen yang canggih. Dah ramai yang tahu kaedah ini malah banyak yang dah gunakan dalam blog masing-masing.

Kaedah ini adalah meletakkan emoticon Yahoo Messenger untuk komen di blog. Macam gambar yang ada kat atas tu. Bagi yang belum ada atau nak cuba kaedah ini, jom ikut langkah mudah ini.

1) Pergi ke Dashboard >> Layout >> Edit HTML dan pastikan anda tik pada "Exand Widget Templates".

2) Scroll ke bawah dan lihat kod seperti di bawah:-

<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<h3><a expr:href='data:post.addCommentUrl'
expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a></h3>
</b:if>
</b:if>
</p>
</b:if>

3) Gantikan kod di atas dengan kod di bawah:-

4) Cari tag </body> dan masukkan javascript di bawah SEBELUM tag tersebut.

<script src='http://tycoblogger.webs.com/smiley.js' type='text/javascript'/>

5) Klik "Save" dan selesai!.

Demo ada di SINI.

MINTA PANDANGAN NAK ANJURKAN KONTEST

2010-03-12T00:45:00.000+08:00

Assalamualaikum dan selamat sejahtera..(dah macam YB lak)

Aku berhasrat untuk menganjurkan satu kontest untuk blog aku. Tapi aku tak tau nak anjurkan kontest yang macam mana. Tentunya niat aku nak memperkenalkan blog aku yang usang tu.
Hadiah aku dah sediakan. Untuk tempat pertama hingga ketiga.
Hadiahnya bg aku...ntah tak tau nk kata. Hadiahnya adalah koleksi vcd aku. 2 koleksi lengkap drama korea dan satu vcd movie Hongkong. 2 koleksi lengkap drama korea tu mahal la jugak. Satu pun aku beli dah lebih harga RM100 dan satu lagi tu kurang sekupang je nk cukup RM100.
Yang movie hongkong tu tk lah mahal sgt... vcd je.. tapi semuanya adalah original.
Tak tau la harga sekarang. Semua vcd tu aku tengok baru je sekali. Lepas tengok tak de nak tengok lagi. Mungkin hadiahnya tak seberapa...tapi aku cuba nak buat gak kontest ni..
So, aku nak minta pandangan, kontest yang macam mana aku boleh buat? Huhuhu...baru 1st time nk buat kontest. Harap ada pandangan bernas dari ahli-ahli GB...terutamanya yang pernah menganjurkan kontest..
Terima kasih in advance.

WIdgets: Multi Tab Untuk Blog

2010-03-11T14:31:00.001+08:00

Ini satu lagi widget yang boleh menjimatkan ruang kolum untuk blog. Rasanya banyak blog yang dah gunakan kaedah ini(blog aku lak yang takde...huhuhu). Banyak jenis multi tab dan apa yang aku nak share kali ni multi tab yang mudah untuk digunakan. Kalau nak try, jom ikut langkah mudah di bawah:-

1) Pergi ke Dashboard >> Layout >> Edit HTML dan anda cari tag </head>.

2) Copy kod di bawah dan masukkan SEBELUM tag di atas:-

3) Klik "Save" dan pergi ke Dashboard >> Layout >> Page Element kemudian klik "Add A Gadget" dan pilih HTML/Javascript.

4) Copy kod di bawah dan masukkan ke dalam ruang HTML/Javascript:-

<div id="tab">
<div class="tabber">

<div class="tabbertab">
<h2>NAMA TAB 1</h2>
<ul>

KOD WIDGET ANDA

</ul>
</div>

<div class="tabbertab">
<h2>NAMA TAB 2</h2>

<ul>

KOD WIDGET ANDA

</ul>
</div>

<div class="tabbertab">
<h2>NAMA TAB 3</h2>
<ul>

KOD WIDGET ANDA

</ul>
</div>

</div></div>

Jika semuanya ok, klik save. Selesai.

**NOTA** Semua yang dihighlightkan berwarna BIRU hendaklah ditukar mengikut kesesuaian anda.

Link List Untuk Blog

2010-03-11T12:54:00.000+08:00

Widget ini sangat sesuai untuk mereka yang suka meletakkan senarai link blog lain di blog mereka. Cara mudah untuk digunakan. Tidak jauh beza dengan kaedah link list yang anda gunakan cuma bezanya, kaedah ini adalah menggunakan jQuery sebagai asas CSS. Style link list anda akan lebih menarik. Jom kita cuba gunakan kaedah ini.

1) Pergi ke Dashboard >> Layout >> Edit HTML dan anda cari tag </head>.

2) Copy kod di bawah dan masukkan SEBELUM tag di atas:-

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[

$(document).ready(function()
{
slide("#sliding-navigation", 25, 15, 150, .8);
});

function slide(navigation_id, pad_out, pad_in, time, multiplier)
{
// creates the target paths
var list_elements = navigation_id + " li.sliding-element";
var link_elements = list_elements + " a";

// initiates the timer used for the sliding animation
var timer = 0;

// creates the slide animation for all list elements
$(list_elements).each(function(i)
{
// margin left = - ([width of element] + [total vertical padding of element])
$(this).css("margin-left","-180px");
// updates timer
timer = (timer*multiplier + time);
$(this).animate({ marginLeft: "0" }, timer);
$(this).animate({ marginLeft: "15px" }, timer);
$(this).animate({ marginLeft: "0" }, timer);
});

// creates the hover-slide effect for all link elements
$(link_elements).each(function(i)
{
$(this).hover(
function()
{
$(this).animate({ paddingLeft: pad_out }, 150);
},
function()
{
$(this).animate({ paddingLeft: pad_in }, 150);
});
});
}

//]]>
</script>

3) Klik "Save" dan pergi ke Dashboard >> Layout >> Page Element kemudian klik "Add A Gadget" dan pilih HTML/Javascript.

4) Copy kod di bawah dan masukkan ke dalam ruang HTML/Javascript:-

<ul id="sliding-navigation">

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

<li class="sliding-element"><a href="URL ANDA">NAMA LINK</a></li>

</ul>

Jika semuanya ok, klik save. Selesai.

**NOTA** Semua yang dihighlightkan berwarna BIRU hendaklah ditukar mengikut kesesuaian anda.

Untuk demo, anda boleh lihat di SINI.

Blog Sampah? Plagiat Itu Habit Blogger?

2010-03-11T03:04:00.002+08:00

Kenapa ya aku terpanggil untuk memberikan pandangan tentang isu ini? Rasanya ramai di kalangan blogger tahu tentang hal ini. Yang kecoh baru-baru ni. Terutamanya blogger yang menjadi ahli GengBlogger.com.

Plagiat bukan isu baru. Malah tidak keterlaluan jika dikatakan ianya sudah menjadi habit sebahagian blogger."Kekocohan" yang baru-baru ini memang agak gempak. Meniru hasil kerja orang lain hampir 100% tetapi tidak memberikan sebarang kredit kepada pemilik asal. Terus terang aku katakan, blog aku ini banyak yang aku dapat trick atau tutorial daripada blog tutorial yang lain. Jika blog tutorial tempatan, aku berpandukan kepada Nescafe Ais.

Tetapi, aku tidak meniru atau atau copy dari blog beliau. Aku lihat blog beliau dan aku cuba cari kelainan untuk tutorial atau tricks. Apa la sangat blog aku ni nak dibandingkan dengan blog beliau. Ibarat langit dan bumi. Aku buat blog ini kerana aku "taksub" dengan coding dan minat aku terhadap CSS, javascript, HTML dan sebagainya. Contohnya blog beliau berikan tutorial auto read more. Aku buat sesuatu yang lain. Aku buat pula auto read more dengan read more link with button image. Contoh ya. Jujurnya, aku memang kagum dengan blog beliau. Tetapi aku tidak meniru. Boleh bezakan blog ini dengan blog beliau. Jauh bezanya.

Aku juga suka berpandukan pada blog-blog tutorial dari luar negara seperti Indonesia, India, Mesir, Sri Lanka kerana kebanyakan blogger dari negara-negara ini memang pandai dalam bidang coding. Aku cuba lihat pada javascript mereka dan aku gabungkan dengan beberapa javascript yang lain.

Tentang isu terbaru ni, memang kesilapan besar bagi si peniru. Anda copy bulat-bulat dan anda tukar nama kepada nama anda dan kemudiannya anda mengakui itu adalah hasil anda? A big mistake. Dan satu tindakan bodoh. Langung tidak ada kredit untuk yang tuan asal? Bertambah bodoh tindakan itu. Come on, ini dunia cyber. Kalau dari mana kita datang pun orang boleh tahu, inikan pula copy hasil orang yang telah dibaca beribu orang. Malaysia bai.. ini Malaysia. Tak besar mana pun. Orang boleh tahu hasil kerja cyber ni.

So, memang patut tuan punya asal tu marah. Itu hak dia. Anda rampas, curi, culik, tiru (dan perkataan sewaktu dengannya) hasil dia, memang la dia marah. (Kalau aku tak marah. Aku cuma geram bila orang dah ikut tutorial aku, menjadi pulak hasilnya kat blog diaorang, tak tau nak ucap terima kasih...Hehehehe. Apa pun, aku "restui" apa yang korang dapat dari blog ini).

Tindakan meminta maaf tu aku rasa baik. Tetapi biarlah ikhlas. Jangan la minta maaf, buat tajuk post macam nak gaduh. Lagi la bertambah marah tuan punya hasil. Nak minta maaf, biarlah ikhlas. Tunjukkan keikhlasan dengan jujur. Apa pun, bagi aku, "what you give, you get back because you ask for it". Ha, kan dah speaking aku ni. Wish aku untuk yang berkenan, good luck.

Bila aku lawat pulak blog tuan punya hasil, memang dia betul-betul marah. Aku faham perasaan dia. Sapa tak marah kalau hasil pencarian yang penat diusahakan tiba-tiba diambil orang tanpa izin. Memang patut dia marah. Dia ada hak nak marah macam mana sekali pun. Tetapi, aku ada rasa kurang "berkenan" kerana ada satu ayat yang kurang "enak" untuk dibaca. Aku dah cuba untuk baca dalam nada yang "enak", tetapi tidak juga datang rasa "enak"nya. Ayat berkenaan adalah "Kesimpulan kepada pereka blog sampah tersebut, anda dan keturunan anda sememangnya sampah.

Come on man.Yang salah orang lain, kenapa babitkan keturunan? Kalau dianya yang copy dan curi hasil anda, takkan keturunan dia pun pencuri? Kalau kita kaki mencarut dan kaki maki orang, adakah keturunan kita gak kaki maki dan kaki carut? Tak salah marah apatah lagi bila kita tahu, apa yang kita akan buat akan mendapat sokongan kerana ramai yang menyukai kita. Dan tidak bertambah salah lagi bila kita marah, ramai yang jadi batu api. Tetapi janganlah babitkan keturunan. Yang salah orang yang tiru tu je. Bukan keturunan dia.

Jangan emosi menguasai diri, sampai rasional terus diketepi. Bila kita makin marah, makin ketara apa yang "sumbang" dalam diri kita. Anda dah lama dalam dunia cyber dan boleh dikatakan idola ramai orang. Malah tidak keterlaluan jika dikatakan anda adalah role model dalam bidang ini. In fact, aku juga kagum dengan hasil anda dan aku berimpian untuk mendapat tempat seperti anda. Jadi, hargai apa yang ada. Jangan pergadaikan hanya kerana emosi. Anda dah lama, patutnya anda lebih matang dalam isu ini. Maaf, ini hanya pandangan aku seorang blogger biasa yang tidak sebesar mana namanya.

Apa pun, harap selesaikan cara baik. Masing-masing ada fikiran waras, berfikirlah dengan bijak. Sekali lagi, ini hanya pendapat peribadi aku. Dan secara jujurnya, aku berpegang teguh pada apa yang aku nukilkan di sini. Maaf jika ada menyinggung rasa. Bukan masuk campur, tetapi hanya rasa hati terpanggil untuk menegur.
Maafkan aku jika ada kata-lata yang kasar. Salam kasih sesama blogger. Adios.

p/s: Aku menggunakan Tynt dan boleh tahu siapa yang copy dari blog ini. Berapa copy sehari dan apa yang dicopy. Bukan aku nak trace siapa yang tiru, tetapi untuk tahu perkembangan blog aku yang tak seberapa ni. Hanya nak tahu jumlah yang gunakan tutorial di blog aku ni. Kenapa ye subscribers kat blog ni lebih ramai dari followers? Confused...

Widgets: Leave Falls Social Bookmark Untuk Blog

2010-03-11T01:04:00.000+08:00

Jika sebelum ini kita ada pelbagai jenis butang bookmark sosial untuk post di blog seperti Sharing Is Sexy, Share The Love, Spread The Love dan sebagainya, kali ini kita cuba pula aplikasikan satu lagi butang sharing bookmark sosial untuk post. Kaedah paling mudah tetapi menarik.

1) Pergi ke Dashboard >> Layout >> Edit HTML >> dan tik pada "Expand Widget Templates".

2) Kemudian anda cari tag <data:post.body/>.

3) Copy kod di bawah dan masukkan SELEPAS tag di atas:-

<div style='clear:both; '>
<div style='width:65px; float:left;'>
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijISg4asfwCcj70KiTji73EFjiyy-Cex8SV_jiQW-XCKnQNevXvALEKKM03rACDG9p8x1TzFX83yO5egdOJ9IoAz51_DTrM6j2EPPNPCt7q2D_MNamNPTDYlwvFI4DOHsrMUd3bU2kSvx7/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3ygjadHsBHiujaeaBEqJtnRaCeUbyLUKiJr7JS15avv6B0cCenW5xhnYdem5UVxzRQB7IsFbqLyXmKRKCyIUGun0-iOzKL9XuvC2lJCjatCkJ0TL5wc2_1mKBEO1OsysKgjNMVAXSkHGc/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://technorati.com/faves?add=" + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSoVDkOv77VkcrXI4S27OyP4c-OO2_Tc7tNiivEML4SfVsjRCsh2xD6y0bNTfSDNxsXfpwTDUa_CVX2mP2P08DNzR9HopuI-HtY3uSRRdxMmivHiVORVZkQUJPIMZ5wCbwBkhL6MoxxJVH/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://twitthis.com/twit?url=" + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4-iI87Ishtioub95g5qM0DskVN454Fm4wrXOah_z24SpF6lF2bXYY2AHsaJ0wwnCYVRS6ksbnLL3Zgb5_tXNDL_JQhJdyrYJ9n6hRx6oAgdrYAsVSxswz77-5Tzw75mxkb1FAey3uIEbM/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsI7cq_K7zswVYleSpZZQ4noVEtYheqifnPwkj1AwnqaKnL0XC5N5Lqx5gNZ5Av9JALLQD2874h2GZELD2kL3RSNKnoqMDRwati-8v8hxHmeAysxYL269Ev7wDZAJbXGjViF_aA0ZFoMJx/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuR8Jz7Tpl1xU43nuPECLIkqqwvPOZiyCYaRdZmErIRASnjm7BNYqi5kqkwUzUbSGJ1CO8l1rkULVJFHqUoIrtB5L1SH7r9Yim9jr-PpU3stE3WGiJwrZKkr-ktTK0AuQgNRElBT4zj6sV/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='"http://reddit.com/submit?&url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><img alt='Reddit' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhM2APG6PoINEu0oaXsTyiHEGsljo4Zw8pkX81YF5mKbOhLUpiLOYXSiVDfhjm53gajQ0_voRaYh36fu5he_hyphenhyphenntJF7nuhnwdiU45RT7o3E_8TUuXmESTqpsrxhN9broouYm6yb4vaqsrky/' style='padding:0;margin:0;border:none;'/></a>
</div>
<div style='width:65px; float:left;'>
<a expr:href='data:blog.homepageUrl + "feeds/posts/default"' rel='external nofollow' target='_blank'><img alt='Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3KnzxclFjdvPc4LbC7_ltQZRUxBoRD9EKK8MrYAOi37oSiLwRxFwXIeSN3Lc_ix43m141030QXeCkSbAijkG4z7o7T_PuP2weiXjQEOhEXH-bcMiEYbom5xyxH4TiXWIvDWgiwJvoDU32/' style='padding:0;margin:0;border:none;'/></a>
</div>
</div>

4) Save template anda dan selesai! Memang mudah. Demo lihat di SINI.

p/s: Sesuai digunakan untuk template yang berlatar belakang warna putih.

Widgets: Attractive CSS Menu Untuk Blog

2010-03-10T22:23:00.000+08:00

Ok. Ini kali(ke kali ini?) satu lagi menu navigasi untuk blog. Lebih elegan dan menarik. Sama langkah seperti menu navigasi sebelum ini. Tak susah. Senang je.

1) Pergi ke Dashboard >> Layout >> Edit HTML dan anda cari tag </head>.

2) Copy kod di bawah dan masukkan SEBELUM tag di atas:-

<style type='text/css'>
#nav {
width:100%;
margin-left:-40px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVeku1YaU6g_MMAQS5feD3-3PWr9YgBEq862NAzEmY3QsT0WQWIpXd2PsHfUmIGTU8wuKK3hbN-IyqEnAGsEMc8E5rl9tgVTJbRzyFo6L-iDAxyH8MYJfQCF3lGPkvj9DXR9CTRZr1g_1p/) repeat-x;
}

#nav li {
float: left;
display: block;
}

#nav li a {
float: left;
display: block;
padding: 12px 18px 12px 18px;
text-transform: uppercase;
text-decoration:none;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_BjLWJucXeuLxuXzPakPbs08y991oOogWMFkdQITXxJkItCh5zK0UroblPkyMLK9uG7DAAlpeEmFPSdVX3b0nFBq-sOEdxCkfgvqte-JfV8Y7l99g-wzbxlXNat9-7GZYAfsKwAnX0KbU/) no-repeat top right;
color:#ffffff;
}

#nav li a:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_BjLWJucXeuLxuXzPakPbs08y991oOogWMFkdQITXxJkItCh5zK0UroblPkyMLK9uG7DAAlpeEmFPSdVX3b0nFBq-sOEdxCkfgvqte-JfV8Y7l99g-wzbxlXNat9-7GZYAfsKwAnX0KbU/) no-repeat right -40px;
color:#ffffff;
text-decoration:none;
}

ul#nav li.current_page_item a, ul#nav li.current-cat a {
color: #fff;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_BjLWJucXeuLxuXzPakPbs08y991oOogWMFkdQITXxJkItCh5zK0UroblPkyMLK9uG7DAAlpeEmFPSdVX3b0nFBq-sOEdxCkfgvqte-JfV8Y7l99g-wzbxlXNat9-7GZYAfsKwAnX0KbU/) no-repeat right -80px;
}

#nav li ul {
display: none;
}
</style>

3) Klik "Save" dan pergi ke Dashboard >> Layout >> Page Element kemudian klik "Add A Gadget" dan pilih HTML/Javascript.

4) Copy kod di bawah dan masukkan ke dalam ruang HTML/Javascript:-

<ul id="nav">

<li class="current_page_item"><a href="URL Anda">Home</a></li>

<li><a href="#" title="URL Anda">HTML</a></li>

<li><a href="#" title="URL Anda">CSS</a></li>

<li><a href="#" title="URL Anda">PHP</a></li>

<li><a href="#" title="URL Anda">MySQL</a></li>

<li><a href="#" title="URL Anda">About</a></li>

<li><a href="#" title="URL Anda">Contact</a></li>

</ul>

<div class="clear"></div>

Jika semuanya ok, klik save. Selesai.

**NOTA** Semua yang dihighlightkan berwarna BIRU hendaklah ditukar mengikut kesesuaian anda.

Untuk demo, anda boleh lihat di SINI.

Widget: Smart CSS Menu Untuk Blog

2010-03-10T17:20:00.001+08:00

Navigasi Menu Melintang ini sangat kemas dan sesuai untuk tambahan navigasi menu pada blog anda. Caranya mudah.Jom kita aplikasikan. Ikut langkah mudah di bawah:-

1) Pergi ke Dashboard >> Layout >> Edit HTML dan anda cari tag </head>

2) Copy kod di bawah dan masukkan SEBELUM tag di atas:-

<style type='text/css'>
#foxmenucontainer46{height:30px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSKmB0Uax-7Ltsq-fJtumZzOI_eAqJMrmSzkJVMYsZ7bzsgLiLjSt3Zt_xYuVdOcmOT9uHTjFLNM1SrN_XUr5mhUtiF2n615Vklm8Vxx0erF4G_pmiPcWfzel9cJmQBcZR8LdrYZWeNuag/) repeat; display:block; padding:0px 0 0px 0px; font: 10px Tahoma,Century gothic,verdana, Arial, sans-serif; font-weight:normal; text-transform:uppercase; overflow:hidden; }

#menu46{margin: 0px; padding: 0px 10px; width:100%; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSKmB0Uax-7Ltsq-fJtumZzOI_eAqJMrmSzkJVMYsZ7bzsgLiLjSt3Zt_xYuVdOcmOT9uHTjFLNM1SrN_XUr5mhUtiF2n615Vklm8Vxx0erF4G_pmiPcWfzel9cJmQBcZR8LdrYZWeNuag/) repeat; height:30px; border-bottom:1px solid #dddddd; }

#menu46 ul {float: left; list-style: none; margin: 0px; padding: 0px; }

#menu46 li {float: left; list-style: none; margin: 0px; padding: 0px; }

#menu46 li a, #menu46 li a:link, #menu46 li a:visited {color: #444; display: block; margin: 0px; padding: 9px 15px 9px 15px; text-decoration: none; }

#menu46 li a:hover, #menu46 li a:active {background:#333A3F; color: #fff; margin: 0px; padding: 9px 15px 9px 15px; text-decoration: none; }

#menu46 li li a, #menu46 li li a:link, #menu46 li li a:visited {background:#202020; width: 150px; color: #bbb; font-size: 10px; font-family: tahoma, century gothic,Georgia, sans-serif; font-weight: normal; float: none; margin: 0px; padding: 9px 10px 9px 10px; border-bottom: 1px solid #282828; }

#menu46 li li a:hover, #menu46 li li a:active {background: #121212 ; color: #fff; padding: 9px 10px 9px 10px; }

#menu46 li ul {z-index: 9999; position: absolute; left: -999em; height: auto; width: 170px; margin: 0px; padding: 0px; }

#menu46 li li { }

#menu46 li ul a {width: 140px;}

#menu46 li ul a:hover, #menu46 li ul a:active { }

#menu46 li ul ul {margin: -31px 0 0 170px; }

#menu46 li:hover ul ul, #menu46 li:hover ul ul ul,
#menu46 li.sfhover ul ul, #menu46 li.sfhover ul ul ul {left: -999em;}

#menu46 li:hover ul, #menu46 li li:hover ul, #menu46 li li li:hover ul, #menu46 li.sfhover ul, #menu46 li li.sfhover ul, #menu46 li li li.sfhover ul {left: auto; }

#menu46 li:hover, #menu46 li.sfhover {position: static;}

</style>

3) Klik "Save" dan pergi ke Dashboard >> Layout >> Page Element kemudian klik "Add A Gadget" dan pilih HTML/Javascript.

4) Copy kod di bawah dan masukkan ke dalam ruang HTML/Javascript:-

<div id="foxmenucontainer46">

<div id="menu46">

<ul>

<li><a href="URL Anda">Home</a></li>

<li><a href="URL Anda" title="#">HTML</a></li>

<li><a href="URL Anda" title="#">CSS</a></li>

<li><a href="URL Anda" title="#">Java Script</a></li>

<li><a href="URL Anda" title="#">Templates</a></li>

<li><a href="URL Anda" title="#">Register</a></li>

<li><a href="URL Anda" title="#">Subscribe</a></li>

<li><a href="URL Anda" title="#">About us</a></li>

<li><a href="URL Anda" title="#">Contact</a></li>

<li><a href="URL Anda" title="#">Privacy Policy</a></li>

</ul>

</div>
</div>

<div class="clear"/></div>

Jika semuanya ok, klik save. Selesai.

**NOTA** Semua yang dihighlightkan berwarna BIRU hendaklah ditukar mengikut kesesuaian anda.

Untuk demo, anda boleh lihat di SINI.

Widget: Ruang Subscribe Untuk Blog Yang Menarik

2010-03-10T14:56:00.001+08:00

Ini satu lagi widget yang menarik untuk blog anda terutamanya blog yang mempunyai ramai pengikut dan pembaca yang setia. Jika anda berminat dengan widget ini, ikut langkah mudah di bawah:-

1) Pergi ke Dashboard >> Layout >> Edit HTML dan kemudian cari tag </head>.

2) Dan SEBELUM tag di atas, masukkan kod di bawah:-

<style type='text/css'>

#hsection{border:4px solid #D3D3D3;background-color:#e9e9e9;}
#hsection:hover{border:4px solid #BABABA;background-color:#e9e9e9;}

#sectionmy .sectionmy2 h2.subscription { border:0; margin:0; padding:6px 0 0 55px; height:42px; font-size:16px;font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif;
font-weight:bold; }

#sectionmy .sectionmy2 h2.rss { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUHjDil5qVtorCviZazh8PMPSeka4A96F-SVckXZBs2F0zdATfBT2iMM53xtvmn3BuSPWvWddlZh0leXklaaiBvV-0OYe7jOj8QGnF7jsLinCl9rjkpSVTr86TS26cwCYOW9IX247jKoNA/) no-repeat top left; }

#sectionmy .sectionmy2 h2.email { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLCwQcqztDZmU2t5kIRwRFP6q3FP3jZl9ZziU6T0qtuwkIUhY68mbbk23WqmqBTmOBKITB3idaoLr7v5rJcLCA2uZQcXep7RU8LYJHqNJ9ARAnNqCrAqix0Z52sRZrNLe3XodE6uweeqCx/) no-repeat top left; }

#sectionmy .sectionmy2 h2.twitter { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt9wiIpN1YzzFuulZONOeLlzvPn7A3_gaxD6XtnvL_4D0PidBdOF25BOzj0VwzBMu_bPVKOq071t5bg8REzSpjG-o62Mtasnqn2dWlgEmWIHLJCatzgxsvsDQwOYRg3_uChP-7AlfvASIr/) no-repeat top left; }

#sectionmy .sectionmy2 .subscription a { color:#252e28; text-decoration:none; }

</style>

Klik "Save".

3) Sekarang pergi ke Layout >> Page Element dan klik "Add A Gadget". Kemudian pilih HTML/Javascript. Copy kod di bawah dan masukkan ke dalam ruang HTML/Javascript.

<div id="hsection">
<div id="sectionmy">
<div class="sectionmy2">

<h2 class="subscription rss"><a href="URL FEED ANDA">SUBSCRIBE VIA RSS</a></h2>

<h2 class="subscription email"><a href="URL LANGGANAN EMAIL ANDA">SUBSCRIBE VIA EMAIL</a></h2>

<h2 class="subscription twitter"><a href="URL TWITTER ANDA">FOLLOW ON TWITTER</a></h2>

</div></div>
</div>

Klik save.

**NOTA** Tukarkan perkataan yang berwarna JINGGA dengan URL anda sendiri dan warna BIRU dengan perkataan anda sendiri.

Anda boleh lihat demo di SINI.

I’m Going to the Gatsby Deodorant Street Fair

2010-03-09T21:15:00.000+08:00

PERHATIAN!!!

Gatsby Deodorant Street Fair

Tarikh: 17 April 2010
Tempat: Ruang Legar Berjaya TimeSquare KL
Masa : 10 pagi hingga 5 petang

Ha, apa tu? Info di atas adalah mengenai program yang dianjurkan oleh Gatsby. Program ini dinamakan Gatsby Deodorant Street Fair. Program yang dianjurkan bersama dengan Nuffnang ini dijangka akan menghimpunkan seramai lebih 500 orang blogger termasuk yang terpilih di dalam Projek 400.

Antara aktiviti-aktiviti yang akan diadakan seperti membaling getah(paling mudah kot?) hinggalah ke aksi-aksi yang melucukan dan menggeli hati seperti bergusti sumo dalam beg udara oleh para peserta. (Gatsby, ada tak aktiviti menangkap duit dalam bilik udara?)Selain itu juga, ada pelbagai jenis gerai mainan akan didirikan pada hari tersebut. Yang menyeronokkan, peserta yang mengambil bahagian dalam aktiviti-aktiviti tersebut, akan diberikan mata ganjaran dan mata ganjaran yang terkumpul boleh ditebus dengan produk-produk Gatsby.

Nanti dulu! Ada lagi yang menarik, lebih menarik. Cabutan bertuah. Hehehe. Aku paling suka cabutan bertuah ni. Nak tau apa antara hadiah-hadiahnya? Barangan elektronik, komputer,telefon bimbit dan baucar tunai berjumlah lebih dari RM 15,000!
Menarik kan?

So, bagi sesiapa yang belum pernah atau kurang pasti untuk ke Berjaya TimeSquare Kl, di bawah ini adalah petanya:

Anda boleh menaiki KL MONORAIL atau RAPID KL untuk ke sana.

Sebarang info lanjut, anda boleh layari www.gatsby.com.my/streetfair.

So, kita jumpa di sana ye. Anda semua dijemput hadir untuk memeriahkan lagi program ini. Tak sabar nak jumpa para blogger semua. Adios.
p/s: Harap-harap ada la booth untuk FIFA. Maklum la, FIFA World Cup pun dah dekat ni. Hehehe. Ada apa-apa cadangan tak untuk aktiviti pada hari tu?

Projek 400 Nuffnang..... Terpilih?

2010-03-09T19:56:00.002+08:00

Tadi aku buka email dan terima satu email dari Nuffnang. Apa ceritanya?
Tak sangka aku terpilih untuk menyertai Projek 400 Nuffnang. Bestnya, aku akan dapat tambahan RM50 ke dalam akaun Nuffnang aku. Itupun setelah aku hadir pada program itu. Mungkin bagi sesetengah blogger, ini adalah perkara biasa. Tetapi bagi aku, rasa bertuah sangat. Tak salah kan aku rasa macam tu? Teruja bak kata orang. Hehehe.. Post akan datang aku akan terangkan apa itu Projek 400. Sebab itu salah satu syarat untuk membolehkan aku layak menyertai Projek 400 ini. Terima kasih Nuffnang. Of course, I will go.

Tools: Wibiya Toolbar Memudahkan Blog

2010-03-09T14:10:00.000+08:00

Jika anda alert atau peka, ada satu bar di bawah blog ini. Berwana merah. Ia dipanggil Wibiya toolbar. Mungkin agak terlewat aku nak kongsi benda ni. Tapi apa pun, sharing is caring, right? So, aku nak share gak.

Toolbar Wibiya mempunyai banyak fungsi. Bukan tak ada toolbar lain seperti Meebo, tetapi aku lebih suka menggunakan Wibiya. Dengan Wibiya, ia mempunyai banyak fungsi seperti Post Terkini, Twitter Dashboard, Butang back to Top, Random Post dan pelbagai lagi. Malah ada juga tersedia data berapa yang online(Whos Amung Us), game, webpage chat dan macam-macam lagi.

Antara aplikasi yang ada untuk Wibiya toolbar

Selain itu, anda boleh sesuaikan warna toolbar dengan warna template blog anda. Ada pelbagai pilihan warna yang menarik.

Pilihan warna Wibiya toolbar

Kelebihannya: Semua aplikasi dihimpunkan di dalam satu script dan disimpan oleh database Wibiya. Blog tidak akan menjadi berat. Jika berat pun, adalah kerana loading data dari Wibiya, sama seperti loading data dari LinkWithIn.

So, klik SINI untuk dapatkan Wibiya toolbar. Anda perlu daftar dan setelah anda berpuas hati, anda boleh dapatkan kod javascript untuk toolbar anda.

**NOTA** Semasa anda ingin dapatkan kod javascript, klik pada platform "Others" (Boleh juga jika ingin klik pada Blogger untuk auto-installation). Copy kod javascript yang diberi.

Pergi ke Blogger Dashboard >> Layout >> Edit HTML HTML dan cari tag </body> (hampir di bawah sekali pada HTML template anda). Masukkan kod javascrit yang anda copy tadi SEBELUM tag </body>.
Klik save dan lihat hasilnya. Selamat mencuba!

Disable Right Click Part II (Updates!!!)

2010-03-09T12:38:00.001+08:00

Hari ini aku lawat GengBlogger dan ada satu isu panas. Pasal plagiat dan photocoy. Sian budak tu. Mungkin baru kot dalam dunia blog ni. Apa pun, good luck pada yang berkenaan. So, aku tertarik untuk udates(UPDATES=huruf P kat kibod aku ni memang sengal sikit) antara kaedah-kaedah yang boleh kita gunakan untuk menghalang isi dan gambar di blog kita daripada ditiru atau dicuri.

Ada kaedah mudah iaitu guna watermark. Tetapi itu hanya untuk gambar. (Klik SINI untuk download Alamoon Watermark). Bagaimana dengan yang lain?

Di awal blog ini, ada satu post yang diberi nama Disable Right Click. Apa itu "Disable Right Click"? Pergi ke post itu penerangan lebih lanjut.
Kali ini, beberapa kaedah lagi akan diberi untuk tajuk post ini. Mudah dan berkesan.(TETAPI, kaedah right click tetap boleh digunakan sekiranya blog anda mempunyai shoutbox atau sebarang kotak chat)

Anda ingin gunakan kaedah ini pada blog anda? Jom ikut langkah berikut.

Kaedah Pertama: Disable Right Click Or Drag Picture

Pergi ke Blogger Dashboard >> Layout >> Edit HTML dan anda cari tag <body>.
Tambahkan kod di bawah kepada tag di atas:-

oncontextmenu="return false" onselectstart="return false" ondragstart="return false"

dan tag body akan kelihatan seperti berikut:

<body oncontextmenu="return false" onselectstart="return false" ondragstart="return false">

Kaedah Kedua: Disable Right Click Or Drag Picture II

Pergi ke Blogger Dashboard >> Layout >> Add A Gadget >> HTML/Javascript. Kemudian masukkan kod di bawah ke dalam kotak HTML/Javascript.

<script>
var isNS = (navigator.appName == "Netscape") ? 1 : 0;

if(navigator.appName == "Netscape") document.captureEvents(Event.MOUSEDOWN||Event.MOUSEUP);

function mischandler(){
return false;
}

function mousehandler(e){
var myevent = (isNS) ? e : event;
var eventbutton = (isNS) ? myevent.which : myevent.button;
if((eventbutton==2)||(eventbutton==3)) return false;
}
document.oncontextmenu = mischandler;
document.onmousedown = mousehandler;
document.onmouseup = mousehandler;

</script>

Klik "Save".

Kaedah Ketiga: Copyright Notice When Clicking On Image

Pergi ke Blogger Dashboard >> Layout >> Add A Gadget >> HTML/Javascript. Kemudian masukkan kod di bawah ke dalam kotak HTML/Javascript.

<script language="JavaScript" type="text/javascript">

</script>

Klik "Save". Dan bila setiap kali anda ingin masukkan gambar dalam post anda, akan kelihatan tag untuk gambar seperti berikut:

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaJX1F6pnSM_aEoA_J0bnAheRacFvTRcP1Zcxt5CVgz3nhFeXxl3Unzxl50h_UXj7lD4KH8NHKfkj_9ME5KJ75nAFPEXiltLifED4MeOK1tsa-Kfmjslk1C_dQ2tl7OPfGfikvBUcDTO5G/s1600-h/love.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaJX1F6pnSM_aEoA_J0bnAheRacFvTRcP1Zcxt5CVgz3nhFeXxl3Unzxl50h_UXj7lD4KH8NHKfkj_9ME5KJ75nAFPEXiltLifED4MeOK1tsa-Kfmjslk1C_dQ2tl7OPfGfikvBUcDTO5G/s320/love.jpg" /></a></div>

Tambahkan kod ini:

onMouseDown="popupMsg('HakCipta Terpelihara -- TycoBlogger 2010')"

selepas tag gambar yang saya highlightkan seperti di atas. Maka tag gambar anda nanti akan kelihatan seperti di bawah:-

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaJX1F6pnSM_aEoA_J0bnAheRacFvTRcP1Zcxt5CVgz3nhFeXxl3Unzxl50h_UXj7lD4KH8NHKfkj_9ME5KJ75nAFPEXiltLifED4MeOK1tsa-Kfmjslk1C_dQ2tl7OPfGfikvBUcDTO5G/s1600-h/love.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaJX1F6pnSM_aEoA_J0bnAheRacFvTRcP1Zcxt5CVgz3nhFeXxl3Unzxl50h_UXj7lD4KH8NHKfkj_9ME5KJ75nAFPEXiltLifED4MeOK1tsa-Kfmjslk1C_dQ2tl7OPfGfikvBUcDTO5G/s320/love.jpg" onMouseDown="popupMsg('HakCipta Terpelihara -- TycoBlogger 2010')"/></a></div>

**NOTA** Highlight berwarna biru boleh ditukar mengikut kehendak anda. Klik gambar di bawah:-

Kaedah Keempat: Imej Bertindih

Kaedah ini agak rumit sedikit. Mula-mula, anda kene cipta satu titik yang latar belakangnya adalah transparent. Di sini aku buat satu dot yang berukuran 5x6 pixels.
Contoh di bawah:-

ADA GAMBAR NI TAPI TAK NAMPAK SEBAB TRANSPARENT

http://img222.imageshack.us/img222/465/dot.png (guna URL ini kalau malas nak buat titik sendiri)

Gunakan kaedah tag image seperti di bawah:-

<table><tbody>
<tr><td background="URL GAMBAR YANG DIPOST" width="100"><img height="KETINGGIAN GAMBAR YANG DIPOST" src="URL GAMBAR TINDIH/TITIK" width="KELEBARAN GAMBAR YANG DIPOST" /></td></tr>
</tbody></table>

URL GAMBAR YANG DIPOST - Link untuk gambar yang akan anda postkan
KETINGGIAN GAMBAR YANG DIPOST - Ketinggian gambar yang akan dipost
URL GAMBAR TINDIH/TITIK - Link untuk gambar yang akan jadi penindih
KELEBARAN GAMBAR YANG DIPOST - Kelebaran gambar yang akan dipost
(Untuk KELEBARAN dan KETINGGIAN gambar, anda boleh lihat right click pada gambar tersebut dan click pada Properties atau Image Info)

Di bawah adalah contoh kaedah di atas. Right Click pada image dan click "Save Image As". Lihat hasilnya. Yang akan disimpan adalah "dot" dan bukan image yang tertera.

Dan contoh tag image untuk gambar di atas adalah seperti di bawah:

<center><table><tbody>
<tr><td background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSqVP0OAftrN83tB7vq2V49jDOm5Pjn3ZlJ8sQQ9a3B-A-LdozrQD4oTgXJ_UyVdbXzb4mlY9aM5YJDzV30PTIUk6xTcAnQeLQa5ihoXNvvsp00OcWpqTK6bDkT45dBsU8-ui8ghtITaJn/s320/10196150-love-and-money.jpg" width="100"><img height="240" src="http://img222.imageshack.us/img222/465/dot.png" width="320"/></td></tr>
</tbody></table></center>

Demo untuk semua tricks di atas boleh anda lihat di sini.
Jadi, selamat mencuba.

Meta Tag Untuk SEO Bahagian Ke 2

2010-03-08T23:51:00.000+08:00

Ini penambahan bagi topik sebelum ini, META TAG UNTUK SEO. Ada sedikit penambahan dalam kod meta tag. Ia dapat membantu blog anda dengan lebih baik dalam ranking SE. Ikuti langkah-langkah yang akan dinyatakan seterusnya.

1) Pergi ke Dashboard >> Layout >> Edit HTML dan cari tag di bawah:-

<b:include data='blog' name='all-head-content'/>

2) Kemudian copy kod meta tag di bawah SELEPAS tag di atas:-

<meta expr:content='data:blog.pageTitle + "TENTANG BLOG ANDA"' name='description'/>
<meta expr:content='data:blog.pageTitle + "KATA KUNCI BLOG ANDA"' name='keywords'/>
<meta content='global' name='target'/>
<meta content='INDEX, FOLLOW' name='ROBOTS'/>
<meta content='ALL' name='SPIDERS'/>
<meta content='ALL' name='WEBCRAWLERS'/>
<meta content='100' name='alexa'/>
<meta content='NAMA PENULIS BLOG' name='author'/>

**NOTA** Gantikan perkataan yang aku highlightkan warna BIRU dengan perkataan sendiri.

3) Seterusnya, cari pula tag di seperti di bawah. Jangan scroll terlalu jauh kerana ia tidak jauh daripada tag di atas.

<title><data:blog.pageTitle/></title>

4) Gantikan tag tersebut dengan kod di bawah:-

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/>NAMA BLOG ANDA</title>
</b:if>

Sekali lagi, gantikan perkataan berwarna BIRU dengan nama blog anda.

Klik preview dan jika tiada masalah, klik save. Selesai.

Template Premium: The Antagonist

2010-03-08T04:47:00.001+08:00

Ini adalah template premium yang paling sesuai untu blog yang berkonsepkan personal. Antara rekaan template yang paling menarik pernah aku lihat dan gunakan. Jauh berbeza daripada template-template yang sedia ada. Kekurangan template ini, TIDAK SESUAI untuk orang yang gilakan widget yang melampau pada blog. Kerana agak terhad untuk widget.

Aku gunakan template ini di salah satu blog aku. Boleh lihat demo di SINI. Sambil lihat tu, follow la sekali ye? Blog personal aku yang baru siap. Support sikit usaha aku tu. Boleh kan?

Ada 4 pilihan warna iaitu GREY, PINK, BLUE dan ORANGE.

GRAY

DOWNLOAD

PINK

DOWNLOAD

BLUE

DOWNLOAD

ORANGE

DOWNLOAD

Untuk "Network", pergi ke Dashboard >> Layout dan click "EDIT" pada kotak bernama "Network".
Copy kod di bawah dan masukkan ke dalam kotak tersebut. Masukkan URL link pada yang dinyatakan dan kemudian klik "Save".

<div id="network">
<ul>
<li><a href="MASUKKAN LINK ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVpNSamWOMJ2EMLv4ymUmsFKkokO1Hw-IT7i40mZMV9XL7PcxbSwyGAHbVEVeYkls-wNTbleNlBPC42t4hxufNXIsfze7M2M4ZfJeT0WxdlhySDq-NdRIN_uDMAm0Gj4HOdzBWqv3kkdFB/"/><strong>Twitter</strong> Follow my tweets!</a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivsST7j6ZcB4bQZI3sWZjaFUhS_z9EW2WN5od7haRD54qBRTa2cq1K8wbFmqXEw8Tek2H53BYNlYXj2CSoTe4yMV-uixk2lal_4CO_V95FbsuFzarHu-ssn74MvAGaGDytC8xnZ4Os7FAH/"/><strong>Flickr</strong> Some photos of mine.</a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpOV_X1S9kmfrnwpj7puFFGg_ZUfeTAuYNg-2fpyJsVCk-UfE7qXysxMI7K1eJx7oov2O1LSD-nzqqyH-46v9ZMhkSoS8P8JNwSV5NTK-I7Qu9fqwtxlN5IN4sNMOR21AEQuhR4p3J5IcI/"/><strong>Delicious</strong> What I've been reading.</a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgmSq7sJ_me_NVQ2p2zFhr5z748B18mAWOD70R_Cforg71xRG2grMOVCfdhyXvF3YDT3OsI68OgjMQRoP_kPyKCZ8E2FrdiNcnciwdOaG2p9O556-BjcTo7alXlEmHyVsJQ9EI98Hp8i0m/"/><strong>Blogger</strong> What I'm writing.</a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhENeYb1RFQsKEJkeLCX-A5Naf5zagDEQ7XKqZi9jDDo-edyV-30OVq97gIgLHOIoTg6iFi9eMsroLBJD-AsbC0kM-b4H07msPzxu3mY3v_y0oLldO73jvikmW85WNQMDdjx8MRX-XRFYvb/"/><strong>Behance</strong> My artworks.</a></li>

<li><a href="MASUKKAN LINK ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwFl6CHYpI1DGGGWKyQ3QrBKgPeQXhVRKL7_nmhX6mpSfzy1xiN_Xf2ngthvDhVEifVXn5HWPJVUG7Go6wiQHmrAePQn4P-HFc-_SH6NnwxjUGuPRql2h74fmakzkh1LcFFOpzzWGTMbia/"/><strong>Myspace</strong> Listen to me!</a></li>
</ul><div class="clear"></div></div>

Ada pertanyaan tentang installation template ni, boleh tanya. Jangan lupa komen ye?

Tips SEO: Navigasi "Breadcrumb"

2010-03-05T12:21:00.000+08:00

"Breadcrumb" adalah satu bentuk navigasi yang dapat membantu mengoptimiskan SEO kita dalam enjin carian. Ia akan membantu pelawat blog memudahkan untuk melayari blog anda. Bentuk "breadcrumb" ini adalah UTAMA >> LABEL >> TAJUK POST. Contoh adalah seperti di blog ini( di atas tajuk post) atau seperti gambar di bawah:-

Cara yang mudah untuk anda aplikasikan di blog anda.
(Backup dahulu template anda)

1. Pergi ke Dashboard >> Layout >> Edit HTML dan klik "Expand Widget Templates"

2. Cari tag ]]></b:skin>

3. Copy kod di bawah dan kemudian masukkan SEBELUM tag tersebut.

.breadcrumbs{
padding:5px 5px 5px 0;
margin:0;font-size:95%;
line-height:1.4em;
border-bottom:4px double #cadaef;
}

4. Cari pula tag <div class='post hentry uncustomized-post-template'> (jika tiada, cari <div class='post hentry'> )

5. Copy kod di bawah dan masukkan SELEPAS tag di atas.

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<div class='breadcrumbs'>
Anda Di Sini » <a expr:href='data:blog.homepageUrl'>Utama</a> »
<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'> , </b:if>
</b:loop>
</b:if> » <data:post.title/>
</div>
</b:if>
</b:if>

6. Klik "Save Templates" dan kemudian lihat blog anda. Klik pada satu post untuk lihat hasilnya. Selamat mencuba!

Auto Update Status Twitter Dan Facebook Dengan Post Blog Anda

2010-03-04T21:16:00.003+08:00

Ha, tajuk post kali ini panjang sikit. Tapi kaedahnya pendek dan mudah. Dengan kaedah ini, bila setiap kali anda update post baru di blog anda, secara automatik status Tweeter atau Facebook anda juga akan diupdate dengan post blog anda. Mudah kata, anda update blog anda, status Tweeter atau Facebook anda juga akan diupdate mengikut blog anda. Mudah lagi? Anda faham la sendiri.

So, ini akan memudahkan kawan-kawan di Facebook atau pengikut anda di Tweeter mengetahui perkembangan terkini blog anda. Tak faham lagi?
Ikut langkah di bawah.

-Pergi ke Twitterfeed.com. Di sini anda perlu DAFTAR, isi maklumat dan klik "Create Account". Kemudian anda dibawa ke muka yang mengandungi 3 langkah.

LANGKAH 1 - NAMAKAN FEED & MASUKKAN URL FEED

- Nama Feed = contohnya blog ini Zon Untuk Blogger
- Url Feed = http://NAMA-BLOG-ANDA.blogspot.com/feeds/comments/full (sepatutnya seperti ini)
atau anda boleh masukkan url Feed anda sendiri jika anda sudah daftar di Feedburner. Kemudian klik "Continue to step 2".

LANGKAH 2 - MEMILIH DAN MENETAPKAN SERVIS PILIHAN

Di sini anda akan dapat lihat beberapa servis iaitu Twitter, Facebook, Laconica, Ping.fm dan Hellotxt untuk anda pilih.
Contohnya, Facebook. Klik Facebook, seterusnya klik "Connect With Facebook". Satu window baru akan keluar dan di situ anda masukkan Email Facebook dan password anda dan klik "Connect". Kemudian klik "Allow Access" dan seterusnya klik "Create Service". Setelah semuanya dibuat, anda telah selesai.

LANGKAH 3 - DASHBOARD TWEETERFEED

Klik "Go to Dashboard" dan di bahagian dashboard, anda boleh ulangi langkah di atas untuk servis yang lain seperti Tweeter.

Itu sahaja. Selesai. Selamat mencuba.

JS Kit Rating: Sistem Rating Untuk Blog

2010-03-04T15:03:00.001+08:00

Ini adalah sistem rating yang berfungsi untuk pembaca blog anda menilai post di blog anda. Seperti yang ada di blog ini di setiap tajuk post. Tetapi ini bukan rating yang disediakan oleh Blogger. Rating ini adalah percuma daripada JS Kit. Sistem rating amat menarik kerana ia "cantik", ringkas dan disertakan info seperti "Hot Post", post yang anda sudah vote dan pelbagai lagi. Contoh seperti gambar di bawah:

Untuk menggunakan sistem ini, ikut langkah-langkah ini:

1- Pergi ke Dashboard >> Layout >> Edit HTML, pastikan
Expand Widget Templates.

2- Cari tag:

<data:post.body/>

Jika ingin letakkan di bawah post ATAU

<div class='post-header-line-1'/>

Jika ingin letakkan di bawah tajuk post.

3- Ada dua grafik rating. Pilih salah satu yang anda suka.
a)

<div style="float:left; margin-right:3px;"></div>
<div class="js-kit-rating"
expr:path="data:post.url"
expr:permalink="data:post.url"
expr:title="data:post.title">
</div>

<div style="float:left; margin-right:3px;"></div>
<div class="js-kit-rating"
expr:path="data:post.url"
expr:permalink="data:post.url"
expr:title="data:post.title" view="score">
</div>

**NOTA** Pilih mana yang anda suka, copy kod tersebut dan masukkan di bawah salah satu tag di atas.

4- Cari tag </body> dan masukkan script di bawah SEBELUM tag </body>.

<script src="http://js-kit.com/ratings.js"></script>

Klik Save dan siap.