Update | Cara untuk Elakkan Blogwalking Satu Hala

Apa itu blogwalking satu hala? Blogwalking satu hala ataupun juga dikenali sebagai blogwalking palsu ni, dia tinggal jejak kat shoutmix kita, tanpa datang pon ke blog kita.. Cemana cara dia buat, itu saya tak pasti.. Ada yang kata dia hack kitenyer shoutmix, macam2 cara la, tapi yang pastinya dia tak datang pon ke blog kita, kiranya kita tak dapat trafik dari dia..

Tapi kita yang baik hati lagi jujur ni, balaslah jejak dia kat shoutmix kita tu, siap beramah mesra lagi tny khabar pe semua kan, sekali kita je yang duk tingkatkan trafik belog dia, kita je yang duk gi skodeng2 entry kat belog dia. Tapi dia tak langsung sikitpon tak belek2 blog kita ni..

Cemana nak elakkan dari terkena blogwalking satu hala nih? Meh tengok tutorial yang saya dapat ni, dengan hanya a few setting kat shoutmix. Tips ni khas untuk pengguna SHOUTMIX sahaja, bagi yang guna CBOX, harap maaf, uols kena upgrade (which is kena bayar) baru boleh guna Website Lock..

1st login ke shoutmix uols.. Then, pi kat Setting > Security, pehtu klik Website Lock cam kat bawah nih..

Pehtu, masukkan url blog uols tanpa http:// ataupun www. macam kat bawah ni..

Dah save, maka uols leh berblogwalking dengan senang hati, coz website lock nih mencegah dari si blogwalker palsu ni untuk bukak shoutmix di blog depa tanpa masuk blog kita..


p/s : Kredit to cik Tom

p/s/s : Tutorial ni dah buat lama dah, tapi terpaksa up balik berikutan kes-kes blogwalking palsu yang semakin menjadi-jadi sekarang ni.. Inilah penangannya apabila tujuan berblogging disalahfokuskan, semata-mata mahu naikkan trafik dengan jalan mudah, pentingkan diri sendiri tanpa ada rasa di jiwa mahu menjalinkan ukhuwah sesama blogger..

Cara untuk Membuat Assignment dari Churp Churp

Last time saya ada buat entri mengenai Earning dari Churp Churp, skang ni saya nak buat langkah-langkah yang uols patut buat setelah mendapat assignment dari Churp Churp, khasnya di bahagian scheduled tweets..

Bila uols dah dapat sheduled tweets, contohnya macam kat bawah ni.. Uols baca betul-betul dan perhatikan campaign duration dan keywords yang yang diberikan..

Karanglah ayat uols dan pastikan kesemua keywords yang diberikan mestilah terdapat dalam ayat uols tadi di petak compose yang disediakan.. Nak buat dalam Bahasa Melayu pon boleh, English pon boleh.. Yang penting, keywords kena sejibik sejibung.. Kalau ikut contoh kat atas ni, kena ada 4 keywords ni dan jumlah perkataan mestilah tidak melebihi yang tercatat di bawah kotak compose tersebut..

Dah siap, cek betul-betul ayat karangan uols tadi supaya semua keywords ada dan ejaan keywords tu sama sebelum submit.. Cek 2-3kali pon takper.. Walaupun akan ada pop up yang keluar macam kat bawah ni, mostly menandakan apa yang uols karang tu menepati syarat, tapi jangan terlalu rely pada pop up ini..

Sebabnya saya pernah terkena, saya fikir kalau salah akan ada pop up ni sebagai confirmation, tapi ada sekali tu pop ni tak keluar, terus disubmitnya ayat karangan saya tu (tak silap masa tu layout lama churp2 nak berubah kepada yg baru).. Jadi make sure berpuashati dulu ngan ayat uols tu, baru submit, kay?

Lagi satu, kalau dah dapat assigment dari Churp Churp ni, especially Schedule Tweets, better buat cepat-cepat, coz pernah sekali tweet saya yang diluluskan tu tak dapat dipublish sebab dah cukup kuota.. Jadi rugila kat situ, dah karang best2 (best ke..agaga) means, ikut syarat apa semua, tapi maybe sebab lambat or nak dekat due, kebetulan pulak kuota pon dah penuh, tak dapat earning..hehehe..

Pada yang dah join Churp Churp tu, harap entri ini dapat membantu.. Dan yang belum join, cepat-cepatlah join, jangan lepaskan peluang ni.. Sambil bertweet, dapat jugak pendapatan kan..


p/s : Jangan segan-segan untuk follow twitter saya, has_ishak, coz saya juga akan follow uols..

Nak bagitau ni..

Hehehe..tajuk cam ape je.. Hihi, sebab takleh nak pikir dah nak bagi tajuk apa.. Yang pastinya, ada 3 benda nak gitau..agagaga

1st, semalam saya ada buat buat post mengenai pengalaman pertama menggunakan EMOTICON yang berjaya menarik perhatian cik Mas (lupa pulak nak habaq thanks kat Miza kat entry tu, coz inform me pasal tu..hihi), dan ET ada bertanya, cemana nak guna EMOTICON tu.. Actually, tersangatlah senang.. Err, maksudnya nak guna tu senang je, hanya click kat EMOTICON yang kita berkenan tu, akan keluar code, pilih yang HTML Code dan paste ajela kat entri.. Yang agak ambil masa adalah nak pilih emoticon dan sesuaikan dengan apa yang kita nak tulis Maklumla, saya ni beginner dalam bab2 EMOTICON ni, memang amik masa lah nak gunapakai EMOTICON ni.. Oh ya, saya amik icon yang comel banget ni kat EMOCUTEZ, tu pon cik Mas yang gitau.. Macam2 ada..

2nd, Atok ada tanya, cemana nak letak link entri terkini ke, or entri berkaitan ke or even entri yang kita nak promote kat orang kat kotak komen, alang2 kita mengomen kan.. Caranya mudah sahaja, copy code kat bawah ni..

Jom skodeng :<a href="http://myapeapeaje.blogspot.com/2010/11/mengenai-buffered-earning-metered.html">Mengenai CPC, CPM, BE & ME Nuffnang</a>

Gantikan ayat jom skodeng tu kepada ayat pilihan jiwa nurani uols, untuk a href tu letak url entri yang uols nak promote tu.. Dan last sekali, jangan lupa untuk tukar tajuk entri itu yang bersesuaian ngan url entri tu..

Dan yang last sekali, kalau perasan, kat sidebar saya dah takde untuk Awards mahupun Won.. Bukan bermakna saya tak menghargai awards2 yang uols bagi ek.. Malahan saya suka banget kalau diberi award.. Saya dah tampal awards tu kat Awards menu bar, under From Beloved Frens.. Hehe, yang For Belle Supporters tu jangan ditanya.. Ntah bila mahu design ni..huwahuwa.. Ada tak orang yang baek hati nak tlun designkan? Ngeh..ngeh..ngeh..

Tutorial : Kelebihan Related Posts berbanding dengan LinkWithin

Rasanya masih ramai lagi yang tidak tahu akan kelebihan menggunakan coding Related Posts berbanding LinkWithin.. Walaupun cara untuk install LinkWithin agak senang berbanding coding Related Posts, tapi uols akan rugi backlink jika menggunakan LinkWithin..

Tak silap saya, backlink ni mempengaruhi jugak SEO dan ALEXA ranking (kalau salah..sila perbetulkan..hehehe) Selain itu, kalau uols guna Related Posts, loading page akan lebih cepat compare dengan uols menggunakan LinkWithin, nak2 skang ni tersangatlah ramai yang menggunakan LinkWithin kan..

Apa gunanya Related Posts ni? Memudahkan pembaca blog uols untuk melihat entri-entri dahulu yang berkaitan dengan topik-topik yang menarik minat mereka.. So, takdela entri lama tu bersawang je kan..

Macam biasa, 1st sekali pi kat Dashboard > Design > Edit HTML, then tick Expand Widget Templates. Untuk langkah keselamatan, sila backup dahulu template uols. Dengan menggunakan CTRL + F, search </head>, dan paste coding di bawah ni sebelumnnya atau di atas </head>..

<!--Related Posts with thumbnails Scripts and Styles Start-->     <style type="text/css">     #related-posts {     float:center;     text-transform:none;     height:100%;     min-height:100%;     padding-top:5px;     padding-left:5px;     }     #related-posts h2{     font-size: 1.6em;     font-weight: bold;     color: black;     font-family: Georgia, “Times New Roman”, Times, serif;     margin-bottom: 0.75em;     margin-top: 0em;     padding-top: 0em;     }     #related-posts a{     color:black;     }     #related-posts a:hover{     color:black;     }     #related-posts  a:hover {     background-color:#d4eaf2;     }     </style>     <script type='text/javascript'>     var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvbcplu1t9YWicxqpoiKWv95bT2JkXTGsoMhyphenhyphen04iq7yYwCOnYlrArMrwYhg_E-xObdDbHM3vCOzixZPgopxi8QzUh8XH8K7h-o4N_R7LdhSLEqEQZahVJ3OIoeUSNAUxpIXtVx03V-CVs/s400/noimage.png";     var maxresults=5;     var splittercolor="#d4eaf2";     var relatedpoststitle="Related Posts";     </script>     <script src='http://blogergadgets.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>     <!--Related Posts with thumbnails Scripts and Styles End-->

Untuk yang berkaler merah tu,

var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvbcplu1t9YWicxqpoiKWv95bT2JkXTGsoMhyphenhyphen04iq7yYwCOnYlrArMrwYhg_E-xObdDbHM3vCOzixZPgopxi8QzUh8XH8K7h-o4N_R7LdhSLEqEQZahVJ3OIoeUSNAUxpIXtVx03V-CVs/s400/noimage.png" = uols boleh tukar image bagi entri tidak bergambar dengan menggantikan url nomage ini

var maxresults=5 = uols boleh tukar jumlah topik berkaitan samaada nak 2,3,4 or berapa saja uols nak

var splittercolor="#d4eaf2" = uols boleh tukar color pembahagi topik mengikut citarasa

var relatedpoststitle="Related Posts" = uols boleh tukar tajuk related post ni sama ada nak Entri Berkaitan ke, or ape ape je lahh..

Dan, coding kat bawah ni uols paste dibawah <data:post.body>.. 

<!-- Related Posts with Thumbnails Code Start-->         <div id='related-posts'>         <b:loop values='data:post.labels' var='label'>         <b:if cond='data:label.isLast != "true"'>         </b:if>         <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=6"' type='text/javascript'/></b:loop>         <script type='text/javascript'>         removeRelatedDuplicates_thumbs();         printRelatedLabels_thumbs("<data:post.url/>");         </script>         </div><div style='clear:both'/>         <b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>         <a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html'><img style="border: 0" alt="Related Posts Widget For Blogger with Thumbnails" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a><a href='http://www.bloggerplugins.org/' ><img style="border: 0" alt="Blogger Widgets" src="http://image.bloggerplugins.org/blogger-widgets.png" /></a>         </b:if></b:if>         <!-- Related Posts with Thumbnails Code End-->

Preview dulu, dah berkenan then boleh save.. Tapi untuk yang guna 'read more hack', laman utama blog uols tidak akan terpapar widget Related post ini.. Harap maklum..


credit to : Riwayat Hariku 

Tutorial Recent Post Bergerak

Hari tu, saya dah share bagaimana nak letak Facebook Like & Retweet button, kali ni saya nak kongsikan pulak bagaimana mahu membuat recent post bergerak seperti kat fresh entries di sidebar tu..

Macam biasa, pi kat Dashboard > Design > Page Elements > Add a Gadget.. Then pilih HTML/ JavaScript. Pehtu, hangpa copy code ni dan paste kat bahagian content..

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>         <style media="screen" type="text/css">         <!--         #spylist {         overflow:hidden;         margin-top:5px;         margin-bottom:-20px;         padding:0px 0px -20px 0px;         height:350px;         }         #spylist ul{         width:220px;         overflow:hidden;         float:center;         list-style-type: none;         padding: 0px 0px;         margin:0px 0px;         }         #spylist li {         width:200px;         padding: 2px 2px;         margin:0px 0px 5px 0px;         list-style-type:none;         float:center;         height:70px;         overflow: hidden;         background:#FFFFFF;         border:1px solid #ddd;         }         #spylist li a {         text-decoration:none;         color:#A32929;         font-size:12px;         height:0px;         overflow:hidden;         margin: 0px 0px;         padding:0px 0px 0px 0px;         }         #spylist li img {         float:left;         margin-right:10px;         background:#EFEFEF;         border:0;         }         .spydate{         overflow:hidden;         font-size:0px;         color:#0284C2;         padding:2px 0px;         margin:1px 0px 0px 0px;         height:0px;         font-family:Tahoma,Arial,verdana, sans-serif;         }         .spycomment{         overflow:hidden;         font-family:Tahoma,Arial,verdana, sans-serif;         font-size:0px;         color:#262B2F;         padding:0px 0px;         margin:0px 0px;         }         -->         </style>             <script language="JavaScript">         imgr = new Array();         imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";         imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";         imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";         imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";         imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";         showRandomImg = true;         boxwidth = 255;         cellspacing = 6;         borderColor = "#232c35";         bgTD = "#000000";         thumbwidth = 70;         thumbheight = 70;         fntsize = 12;         acolor = "#666";         aBold = true;         icon = " ";         text = " ";         showPostDate = false;         showcomments = false;         summaryPost = 40;         summaryFontsize = 10;         summaryColor = "#666";         icon2 = " ";         numposts = 20;         home_page = "http://URL BLOG ANDA/";         limitspy=4         intervalspy=4000         </script>         <div id="spylist">         <script src="http://sites.google.com/site/testingsahaja/recentpostslide.js?attredirects=0&d=1" type="text/javascript"></script>         </div>

Part yang kaler merah tu, tukar ngan alamat blog uols. Yang kaler hijau tu pulak, uols leh tukar mengikut saiz dan kesesuaian sidebar blog uols. Yang kaler biru tu, numposts = 20 adalah jumlah post yang akan dipapar secara bergilir-gilir.. Yang limitspy = 4 tu pulak adalah jumlah paparan post pada masa yang sama..

Dah adjust comey-comey, preview pon dah berkenan di hati, maka uols leh save dan voila!! ^_*


p/s : credit to Riwayat Hariku

    

Tutorial Pasang Facebook Like & Retweet Button

Dah lama saya tak berkongsi tutorial kat sini kan..hehehe.. Sebenarnya, banyak tutorial yang ingin saya kongsikan, tapi masa tak berapa mengizinkan..hohoho.. Tanpa melengahkan masa lagi, jom kita tengok cara-cara untuk pasang Facebook Like & Retweet Button pada setiap entri..

Macam biasa, 1st sekali pi kat Dashboard > Design > Edit HTML, then tick Expand Widget Templates. Untuk langkah keselamatan, sila backup dahulu template uols. Dengan menggunakan CTRL + F, search <div class='post-header-line-1'>, jika kod tersebut tiada, uols boleh menggantikannya dengan kod <div class='post-header-line-1'> ataupun <data:post.body> macam kat bawah ni..

Untuk Facebook Like button, copy coding ini dan paste di bawah kod tersebut.. Yang kaler hijau tu, uols leh tukar kedudukan button samaada nak right or left. Begitu juga yang kaler merah tu, boleh ditukar saiz button ini mengikut kehendak uols.

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

Untuk retweet button, copy coding ni dan paste dibawah coding like button ni (saya buat camgitu ler..) Nak letak kat atas coding like button pon boleh, asalkan di bawah <data:post.body>. Macam saya hari tu, banyak kali adjust jugakla nak bagi comey2 je terletak dua-dua button ni..

<script type='text/javascript'>
tweetmeme_style = "compact";
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>

p/s : Credit to maribinablog. Kay, selamat mencuba..

Cara Membuat Drop Down Menu Bar

Kali ni saya nak share tutorial membuat drop down menu bar.. Jenuh jugakla saya mencari tutorial ni, akhirnya terjumpa jugak yang simple but nice (bagi mata sepet me la..) Ini contoh menu bar blog Belle ini..

 

Macam biasa, pi kat Dashboard > Design > Edit Html... Sebagai langkah keselamatan, sila save dulu template uols sebagai backup.. Pehtu, tick kat Expand Widget Templates, then search </head>, copy code ini dan paste sebelum </head>.

 </font></font></p><p style="text-align: left; clear: both;" class="separator"><span class="fullpost"><!--jquery-DD-Menu-Starts--><br> <style type="text/css"><br> /* menu styles */<br> #jsddm<br> { margin: 0;<br> padding: 0}<br> <br> #jsddm li<br> { float: left;<br> list-style: none;<br> font: 12px Tahoma, Arial}<br> <br> #jsddm li a<br> { display: block;<br> background: <span style="color: red;">#324143</span>; /*DARK-GREEN*/<br> padding: 5px 12px;<br> text-decoration: none;<br> border-right: 1px solid white;<br> width: 70px;<br> color: #EAFFED;<br> white-space: nowrap}<br> <br> #jsddm li a:hover<br> { background: #24313C}<br> <br> #jsddm li ul<br> { margin: 0;<br> padding: 0;<br> position: absolute;<br> visibility: hidden;<br> border-top: 1px solid white}<br> <br> #jsddm li ul li<br> { float: none;<br> display: inline}<br> <br> #jsddm li ul li a<br> { width: auto;<br> background: <span style="color: red;">#A9C251</span>; /*LIGHT-GREEN*/<br> color: #24313C}<br> <br> #jsddm li ul li a:hover<br> { background: <span style="color: red;">#8EA344</span>}<br> </style><br> <br> <br> <!-- script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/<span class="IL_AD" id="IL_AD3">javascript</span>"></script --><br> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script><br> <script type="text/javascript"><br> var timeout = 500;<br> var closetimer = 0;<br> var ddmenuitem = 0;<br> <br> function jsddm_open()<br> { jsddm_canceltimer();<br> jsddm_close();<br> ddmenuitem = $(this).find('ul').eq(0).css('visibility', 'visible');}<br> <br> function jsddm_close()<br> { if(ddmenuitem) ddmenuitem.css('visibility', 'hidden');}<br> <br> function jsddm_timer()<br> { closetimer = window.setTimeout(jsddm_close, timeout);}<br> <br> function jsddm_canceltimer()<br> { if(closetimer)<br> { window.clearTimeout(closetimer);<br> closetimer = null;}}<br> <br> $(document).ready(function()<br> { $('#jsddm > li').bind('mouseover', jsddm_open);<br> $('#jsddm > li').bind('mouseout', jsddm_timer);});<br> <br> document.onclick = jsddm_close;<br> </script><br> <!--jquery-DD-Menu-Stops-http://bloggerstop.net-->

 

Sebelum paste, sila ubah code warna #324143; /*DARK-GREEN*/, #8EA344 dan #A9C251; /*LIGHT-GREEN*/ mengikut kegemaran uols. Nak cek code warna leh tengok kat sini.. Dah paste & save, sila pi kat Page Elements > Add a Gadget > Html/JavaScript type, then paste code ni kat widget tersebut..

</p><p><span class="fullpost"><!--BODY-CODE--><br> <ul id="jsddm"><br> <li><a href="#">JavaScript</a><br> <ul><br> <li><a href="#">Drop Down Menu</a></li><br> <li><a href="#">jQuery Plugin</a></li><br> <li><a href="#">Ajax Navigation</a></li><br> </ul><br> </li><br> <li><a href="#">Effect</a><br> <ul><br> <li><a href="#">Slide Effect</a></li><br> <li><a href="#">Fade Effect</a></li><br> <li><a href="#">Opacity Mode</a></li><br> <li><a href="#">Drop Shadow</a></li><br> <li><a href="#">Semitransparent</a></li><br> </ul><br> </li><br> <li><a href="#">Navigation</a></li><br> <li><a href="#">HTML/CSS</a></li><br> <li><a href="http://bloggerstop.net">Blogger Help</a></li><br> </ul>

Tukarlah nama menu tu mengikut kehendak uols, then save, maka letak widget tersebut di atas blog post ataupun bawah header, whichever is ur preference and voilaaa!!

credit : sini 

Mahu Letak Floating Icon Di Tepi Blog?

Kali ni, saya nak shara cara-cara untuk letak icon2 seperti facebook, twitter, feedburner, youtube, & flickr, serta home & back to top button..

1st sekali, pi kat Dashboard > Page Elements > Add a Gadget dan pilih Html/Javascript. Copy dan pastekan coding kat bawah ni di gadget tersebut.

<br></p><blockquote><div style="color: blue;"><style type='text/css'></div><div style="color: blue;">a.linkopacity img {</div><div style="color: blue;">filter:alpha(opacity=50);</div><div style="color: blue;">-moz-opacity: 0.5;</div><div style="color: blue;">opacity: 0.5;</div><div style="color: blue;">-khtml-opacity: 0.5;}</div><div style="color: blue;"><br> </div><div style="color: blue;">a.linkopacity:hover img {</div><div style="color: blue;">filter:alpha(opacity=100);</div><div style="color: blue;">-moz-opacity: 1.0;</div><div style="color: blue;">opacity: 1.0;</div><div style="color: blue;">-khtml-opacity: 1.0; }</div><div style="color: blue;"></style></div><div style="color: blue;"><br> </div><div style="color: blue;"><div style='display:scroll; position:fixed; top:240px; right:-12px;'></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://facebook.com/akaun facebook anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8RkFhfxHC155u_rbtn_ILWLCLuXx2Cs0bxNJhdS0MML55Tq5wfBDdCK3g4xgtO-N1tRy1eMhWHDy3mVtQ7jxhD9TwLA2erqyDlIqCASQAI9pPsu257pNZsI-Ps3eulygoYkUL4k4PEKL7/s320/facebook.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://twitter.com/akaun twitter anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRKiTLbJlMmClX_xOF_RPtUQEHTaKVmNFYHwaQ8ERWIJyeoK2CfSyfRmtxED7o4QYEUK_USyZu-o4TiIhhJ_o4pY5CsDrzOD3aQGAa0QA2bMYaVqcWUF9IauBXq5VnrNuJieUkZ0AbsOCu/s320/twitter.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://feedburner.com/akaun feedburner anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feedburner'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTt12EKXwKxmoYavzjKmIjh5oG2fzacLze2fAiKud82EwSc8ShcRzNao8lsJouC9FWBmX2wnC-eUZrgunEkS7Idpwdsdztz8_Q81KNpmaC-eeFhvCLWy5iAs-MXQ4Hk4FPaxSveCu_LRbI/s320/feedburner.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://youtube.com/akaun youtube anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='youtube'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiANtu7f9D6cdg7pfCwsayBD8Qik4h3qj1OsncYmX85JkvGQGJKh0jz3Bzdfn2X0SfNNXlZQojptsrnLjj1F3nROowjvHVEG_v7XzpiXrLe1SB5OKffYIx6A-DoNfRgRGNR64esaOkH2DXn/s320/youtube.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"><a class='linkopacity' href='<b style="color: rgb(255, 0, 0);">http://flickr.com/akaun flickr anda/</b>' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='flickr'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIHMj_ZU1xH3J3VefPAJmyptqFYkh0nBkyz_8dQIUtfbbsK7MhDl8PzSCPZ6Unk3BHPbkF_lvNFW5rHSMNarsY1YByyKHPoGoFOeWOOV2b8zwbqlllJGpnOSzd57vw4tYaOa-_rY_M5FTs/s320/flickr.png" /></a><br /></div><div style="color: blue;"><br> </div><div style="color: blue;"></div></div></blockquote><p><span style="color: orange;"></span>

Sebelum save, jangan lupa untuk letak alamat akaun uols. Sekiranya takmo letak let say flickr, then uols just buang ajela coding untuk flickr. Kalau rasa dah bosan ngan icon tersebut, uols leh tukar icon2 lain di http://www.iconspedia.com.

Dah setel tang icon, jom tengok coding untuk letak home & back to top button. Uols nak asignkan pon boleh, or nak paste kat ruang content Html bagi icon kat atas tu pon boleh. Macam saya, saya asingkan.

</p><p><a href='#' style='position: fixed; right: 1px; bottom: <span style="color: rgb(0, 0, 255);">100</span>px;' title='back to top'><img height="21" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Ggv8cUMHQS8iebC1_oIXMhx_zPkLbyN2OfXkn3sgLOKVaDruagAczNtQqwju_AI6eyclVrLkYcdG4LviSIn-XUBMyCrsJJ0bP4sACZeJqsU8V-L6hmOhO4wX28BBeriLZpNfV70K2fU/s320/up.png" width="21" /></a><a href='<span style="color: rgb(255, 0, 0);">http://myapeapeaje.blogspot.com</span>/' style='position: fixed; right: 1px; bottom: <span style="color: rgb(0, 0, 255);">129</span>px;' title='home'><img height="21" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIYvaUX0age05inD_iJrxTcv27VJV1O2pVvBBwEZ_zdQeC5gKJxGPZt6_tABPyJEkqlruE8Yx0c0szINA0MRGsO1JrM3rPtSfLbCxJg_6QE7ogzI1A8M76GzOfBN5RP9dL1eibA7pDyH8/s320/home1.png" width="21" /></a>

Kalau perasan, ade bottom: 100px, yang kaler biru tu uols leh tukar position mengikut kehendak uols. Sekalii lagi, jangan lupa untuk tukar kepada alamat website uols. Selamat mencuba.. ^_^


p/s : Kredit to MariBinaBlog

Nak Letak Icon Comel bagi Button Comment?

Ha, aritu kat Happy Mode, saya ade gitau yang saya telah berjaya letak icon comment kat bawah post. Maklumla, template saya ni link commentnyer kat atas, jadi kekadang orang tak prasan coz biasanya link komen ni duk kat bawah..

So hari ni, saya nak sharelah cara2 utk letak icon comment yang comel lote.. Macam biasa, pi kat Dashboard > Design > Edit Html, then tick Expand Widget Templates. Menggunakan CTRL + F, search <span class='post-comment-link'> macam kat bawah nih..

Copy code kat bawah ni dan paste dekat bawah <span class='post-comment-link'> tadi..

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<center><a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' title='Klik untuk komen!'><img class='post-comment-link' src='URL ICON'/>
</a></center>
</b:if>
</b:if>
</span>

Coding ni saya amik kat Liyana Lunia. Yang kaler hijau tu, uols nak tukar ayat berbunga2 pon boley.. Yang kaler merah tu, url untuk icon comment tu.. Macam saya, saya amik kat glitter graphics.. Kat situ macam2 ade.. Dah siap, save template dan siap sudaaa...

Tapi bagi kes template macam saya, which is link komen kat atas, icon comment uols tu akan berada kat atas. So cane nak solve problem ni? Senang aja, instead of uols paste coding atas tu kat bawah <span class='post-comment-link'>, uols search data:post.body macam kat bawah ni, then paste kat bawah tu..


Hasilnya, jadikla cam blog saya.. Suka tak?

Tutorial Database

Ini merupakan himpunan2 tutorial yang diperolehi dan disimpan untuk rujukan di masa hadapan. Feel free to try them.. ^_^
 

• Tutorial Sticky Post/Mode

• Cara Letak Button Add This @ Facebook Share

• Update Entry Terbaru ke Twitter & Facebook secara Auto

• Cara untuk Letak Ads Nuffnang 

• Tutorial Marquee Code : Scrolling Image

• Tutorial Scroll Box

• Cara Letak Scroll Up & Down di Bloglist & Html Widget

• Tutorial Recent Comments Bergerak

• Cara Letak Scroll Box di Blog Archive

• Letak Icon Comel di Button Comment

• Tutorial Letak Floating Icon di Sisi blog

• Cara untuk Elak Blogwalking Satu Hala

Jom letak Scroll Box di Blog Archive

Last time, saya dah share cara-cara untuk letak scroll box di bloglist & widget2 lain seperti feedjit & popular posts.. Kali ni saya nak share cemana nak letak scroll box di blog archive pulak supaya nampak lagi kemas tetapi dapat tunjuk semua tajuk2 post uols yang best2 tu..

1st skali, cam biasala pi kat Dashboard, klik Design, then klik Edit Html.. Pastu tick Expand Widget Templates. Dengan menggunakan CTRL + F, search <div id='ArchiveList'> macam kat bawah ni..

Copy code warna hijau ni <div style='overflow:auto; width:auto; height:100px;'> dan letak di atas <div id='ArchiveList'> dan code ini </div> sebelum <b:include name='quickedit'/>, macam kat bawah ni..

<div style='overflow:auto; width:auto; height:100px;'>
<div id='ArchiveList'>
  <div expr:id='data:widget.instanceId + "_ArchiveList"'>
    <b:if cond='data:style == "HIERARCHY"'>
     <b:include data='data' name='interval'/>
    </b:if>
    <b:if cond='data:style == "FLAT"'>
      <b:include data='data' name='flat'/>
    </b:if>
    <b:if cond='data:style == "MENU"'>
      <b:include data='data' name='menu'/>
    </b:if>
  </div>
  </div></div>
  <b:include name='quickedit'/>

Yang kaler merah tu, uols leh adjust ketinggian ikut kehendak uols.. Klik Preview dulu untuk tengok jadi ke tak, kalu ok leh save dan voilaaaa.. It's done and cun!!!


Kredit : Kak Syamila

Nak bagi Recent Comments bergerak?

Sebelum saya berkongsi cara-cara untuk letak scroll box di blog archive, saya nak share dulu macamana nak bagi recent comments uols tu bergerak..

Tapi kan, saya guna recent comments dari sini.. Takde problem kalau uols guna recent comments dari website lain pon boleh. Yang saya concern skang ni kalu uols guna recent comments widget kat Blogspot ni, ha yang tu korang kena godek2 sendiri lorr cane nak jadikan ia bergerak..hehehe..

Pada yang takde recent comments widget, leh copy codingnya kat sini..

<script style=text/javascript src=http://www.freewebs.com/filer/blogger/rc1blogger.js ></script><script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=80;</script><script src=http://YOUROWNBLOG.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script><small>↑ <a href=http://www.madtomatoe.com/recent-comments-widget-for-blogger/>Get </a><a href=http://www.madtomatoe.com/ target=_blank title=recent comments widget>Recent Comments Widget</a></small> <style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} </style>

Yang kaler biru tu, gantikan dengan address blog uols. Untuk kaler merah tu, jumlah comment yang uols nak papar. Kalau nak 10, ganti ajela 5 tu kepada 10. Rasenya sumer dah tau cane nak letak coding ni kan, cam bese add html gadget then paste. Nak bagi gerak pula, uols ambil coding bawah ni dan letak seperti yang tertera..

<marquee behavior="scroll" direction="up" onmouseover="this.stop()" scrollamount="2" onmouseout="this.start()">LETAKKAN CODING RECENT COMMENTS DI SINI</marquee>

Kalu uols perasan, coding kat atas ni adalah lebey kurang sama ngan coding Marquee scrolling image, so kalu nak adjust halaju ke, arah comments tu bergerak, sila rujuk kat coding Marquee scrolling image. Selamat mencuba!!

Cara membuat Scroll Box di Bloglist & Html Widget

Mahu memperkemaskan lagi blog dengan memasang scroll up & down pada list blog yang berjela-jela? Kalu uols perasan, kat my bloglist ngan feedjit ada scroll box. Begitu juga kat blog archive, tapi tutorial ni tidak applicable pada blog archive (tunggu next entriii..)

1st skali, uols kena dapatkan id widget yang ingin diletak scroll box. Camane nak dapat id ni? Pi kat dashboard, klik design, pilih page elements. Kat sidebar hangpa ada list2 widget. Klik edit bloglist widget (contoh widget yang ingin diletak scrollbox), hangpa cari widgetId kat atas tu.. biasanya dia duk last skali, cam gambar ni..

id widget ni ialah BlogList1

Dah dapat id tu, hangpa replace kat coding ni di tulisan kaler merah tu.. *sila copy betui2 coz aritu saya gi memandai dekatkan dot dengan BlogList1 trus tak jadi..* Pastekan dulu coding ni di notepad/word or mana-mana yang menyenangkan uols.. Yang kaler hijau tu, uols leh adjust mengikut ketinggian yang uols mahu..

#BlogList1 .widget-content{
height:200px; width:auto;
overflow:auto;
}

Pastu, uols gi kat Edit Html, tick bahagian Expand Widget Templates, dan dengan menggunakan Control + F, search ]]> macam kat bawah ni.. 

Dah jumpa ]]>, maka bolehla uols amik coding dari 1st step tadi dan paste di atas kod ]]>. Di atas yer, bukan di bawah..hihihi.. Buatla kat widget2 lain yang uols nak bagi pendek sket.. 




p/s : Sumber : Kak Syamila
 

Tutorial Scroll Box

Hari tu saya dah share cara-cara untuk buat scrolling image menggunakan Marquee code, kali ni saya nak share mengenai cara-cara untuk membuat scroll box seperti scroll box GA & Contest kat my sidebar tu..

Macam biasa, add html gadget, ikut suka hatila nak bagi title ape, then paste code ini di bahagian content

<div style="overflow:auto; height:400px; width:250px">
<table cellpadding="0" cellspacing="0" style="width:250px;"><tr><td>masukkan text or image di sini</td></tr>
</table></div>

Yang kaler merah tu, uols leh adjust mengikut kehendak & kesesuaian sidebar uols.. Nak taruk scroll box ni kat entry pon boleyy.. Kalau nak taruk image, uols leh rujuk entri scrolling image untuk html coding part image source tu.. Selamat mencuba!!


p/s : Tapi untuk blog archieve & bloglist, saya guna cara lain coz cara ni tak boleh.. Tunggu!!

Tutorial Marquee Code : Scrolling Image

Kali ni, saya nak share bagaimana uols boleh buat blog uols nampak lebey organize dengan bantuan Marquee code.. Apa gunanya Marquee code? Banyak sebenarnya yang leh buat ngan Marquee code nih, tapi untuk entri ni, saya nak kongsi tips membuat scrolling image dengan menggunakan Marquee code..

Kalu uols perasan, kat sidebar blog nih, ade part Won, part ni saya gunakan Marquee code laa.. Actually, nak buat gambar tu gerak dari kiri ke kanan pon buleh, and the other way round pun boleyy..

First skali, copy code ni..

<marquee direction="up" width="200" onmouseover="this.stop()" scrollamount="4" onmouseout="this.start()" height="200" align="center">

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinMKgUyTpfM_STummWpcjeEtp6YQxZi_lwU9Dv2S3tpmM6PVqR4Soo9XkhG5Bu9_10KyfzkMdDW205_e78c9NuJygwI-jT_gy-2gGvK1k0dQ5-3Z9fZicLhvKZdEdHhy7AS0jVx1hrk8Mf/s320/aidilfitri_s.jpg" width="160" height="160" /align="center" /><p><a href="http://myapeapeaje.blogspot.com/2010/10/me-bertuah-in-ramadhan-raya-ga.html">One of the Lucky Winners</a></p>

</marquee>

Yang warna merah tu, uols leh tukar ikut suka hatila.. Cumenyer part scrollamount = 4 tu adalah halaju gambar. Kalau nak lagi laju, guna nombor lagi besau dari 4, cthnyer 5 -10. Kalau nak slow, kurangkanla..

Yang part kaler hijau, img src tu adalah image location (yang ni uols leh dapat ngan right click then select copy image location) bagi gambar tersebut, a href tu adalah link blog/entri..

Yang kaler biru tu adalah text yang dilinkkan kepada url blog/entri.. Ok, sekian suda.. Kalau nak buat cool effects yang lain2 guna coding Marquee leh tengok kat sini..

Cara Untuk Pasang Ad Nuffnang

Walaupun dah ramai yang wat entri on how to add Nuffnang ads kat blog masing2, saya rasa tak salah kalau saya nak wat jugak..ngeee.. Lagipun, saya percaya masih ada kat luar tu yang penin2 nak taruk code Nuffnang tu (ke my imagination only?ngeh..ngeh..tak kiralaa..) Mana tahu, kot2 saya dapat bantu kan..

Orait, klu uols dah reg dengan Nuffnang, uols dah leh log in to website Nuff kan. Kat situ ade icon Ads, ha tekan icon tuh, nanti kuar page yang ade coding utk ditepek ke blog uols..

Ha, saya syorkan anda taruk ketiga-tiga ads unit tuh..(hihihi..tamak nih..) Bukan tamak, tapi klu rase2 nak bnyk masyuk, taruklah ketiga-tiga ads tuh.. Kita mulakan dgn yg paling senang dahulu, which is kat sidebar. Ni uols pegi aje kat dashboard blog masing2, then gi kat Design, klik kat Page Elements, then add a gadget dan semestinya memilih html/javascript. Copy aje lor coding sidebar Nuffnang tu then save.

Ok, tiba2 saya fikir kalu uols rujuk sini pon senang gak. Explanation yang diberi pon jelas. Ikut je step by step. Kat bawah, bahagian kanan tu ade tutorial cane nak pasang ads tuh kat domain masing2. Kalu yang blogspot tu, pilihlah icon blogger, janganla gi pilih wordpress ke..hehehe.. Kat mane? Sinii..

 

Harap membantu..

Update Entry Terbaru ke Twitter & Facebook secara AUTO

Anda gemar lepak sambil chit chat ngan twitter? Anda suka update gambar di Facebook? Anda mahu tingkatkan trafik di blog?

Kalau ya, saya mahu kongsi cara bagaimana mahu entry terbaru uols kat blog tu secara automatik diupdate @ di linkkan kat uols punyer Twitter dan Facebook, tanpa perlu log in kat Twitter @ facebook. Pendek kata, lepas uols publish post terbaru kat blog, secara automatiknya post itu akan appear kat Twitter & Facebook (tapi bukan the whole entry la yang appear..) Saya belajar ni pon semasa saya blogwalking ke halaman Aried, terbacalah entrynyer yang share pasal benda ni.

1st skali, uols kena ada RSS FEED.  Kalau takde, boleh mendaftar diri (free aje..) kat FeedBurner, dan isilah address blog anda kat sini

 
Contoh RSS FEED blog saya seperti di bawah :

 

Dah ade address utk feed tu, uols leh masuk kat TWITTERFEED untuk daftarkan diri. Ikutlah step yang diberikan sehingga uols jumpa ini, masukkan nama blog & feed blog

Then, continue ke Step 2, sila klik Twitter dan page ini akan appear. Uols klik aje Authenticate Twitter untuk acces akaun Twitter uols.

Bila dah appear akaun uols kat no. 1 tu, then klik Create Service. Nanti akan appear page yang mengesahkan akaun Twitter anda aktif. Same step untuk Facebook juga.

Bila uols dah pastikan Twitter & Facebook aktif, lehla tekan all done. Kot2la uols ade gak akaun lain seperti yang tersenarai kat page tu, leh gak kalu nak wat..

Ok, itu aje.. Senang tak? Hehehe.. Semoga dapat membantu kawan2 yang lain..


p/s : Ha, klu nak add saya kat twitter dan facebook pon boleh.. Kalu kawan2 nak tinggalkan id twitter dan facebook kat komen ni pon boleh..

Mahu Pasang Button Add This atau Facebook Share?

Perasan tak kat blog ni sudah banyak berubah sedikit, dah ade widget2 such as twitter la, feedjit la, malah ketiga-tiga nuffnang pon dah diletak..hihiihi..

Ok, sblom tersasar lebih jauh, kali ni saya nak share on how to put button ADD THIS in your every post. Kalu prasan, kat smua entri saya, bahagian bawah je mesti ade button +share. Cemana nak wat? Ok, 1st skali uols kenala gi website ini, untuk dapatkan button kesukaan anda..

Dah buat sampai dapat coding, then uols pegila kat dashboard, klik design. Then, edit html, sila tick kat expand widget templates. Pastu, dengan menggunakan CONTROL + F, type la data:post.body macam kat bawah ni..

Dah jumpa tu, uols lehla copy coding button tu dan tempek kat bawah command tu.. Kalu rasa nak lagi best, tulislah ape2 such as sharing is caring ke.. silalah share kalau suka ke.. before tempek coding tu.. ha, tapi nak bagi ape yang uols tulis tu di perenggan baru aka new line, uols kena type <p>Ayat bunga-bunga hangpa </p>  then paste ajela coding add button tuhh..

Semua dah selesai, sila save aje template kome tu.. Voila!! Dah siap dan ready untuk diklik oleh pembaca2 kowang sumer.. Amacam, anda suker ngan entri ini? Ape lagi..klik ajela button aii tuhh..hihihi.. Harap dapat membantu kawan-kawan sumer..


p/s: Tapi kan.. yang aii konpius2 lagi, adekah kalu kita pasang button nih akan memberatkan lagi loading website kesayangan kite nih?? Hmm..

Tutorial Sticky Post/Mode

Walaupun saya mula menceburkan diri dalam dunia blogging sejak 3 thn lepas, tapi dolu-dolu saya hanya pandai menulis shj, x godek2 pon gadget2 or widget2 yang ade utk memeriahkan memperkemaskan blog nih.. Malah template ni pon saya baru pakai bulan 10 tahun lepas (nak kena tukar dah ke..sayang ar template nih..comey kt mataku ini..) Dolu-dolu saya hanya guna template yang sedia ada tu haa.. Dah cukop menarik bagiku (time tu le..)

Jadi, utk golongan2 seperti saya ni, yang baru nak berjinak-jinak ngan blogging, saya nak share sket on how to make a sticky mode/post.. hehehe, saya tau, ramai yang dah pakar biasa wat sticky mode nih.. Xpela, kot2 berguna nnt utk budak baru belajar cam saya nih..

Ok, caranya mudah aje.. anda publish dulu entry yg anda ingin jadikan STICKY POST, then anda edit balik, tukar post option pada tarikh yg sehingga anda mau STICKY POST melekat. Agak-agak paham dak? Kalu dak paham, leh rujuk kat sini..

Nak tau nape tetibe saya blaja wat sticky post nih, sbb join contestlah..hihihi.. Cari punyer cari cemanala nak wat sticky post, nk tny kawan dah tak sempat sbb due contest dah dekat.. Ade yang suggest suh add widget, tp yang tu tak comeyy, jadi tak sama cam entry yang lain.. Kot2 kawan-kawan ade cara2 yang lain, yang lagi senang, leh share kat sini kay...