Facebook Popup Like Box Timer.
Salah satu cara untuk tingkatkan like adalah dengan pasang Facebook Popup dalam blog.

Namun, apabila dicari tutorial berkaitan Facebook Like Popup banyak tutorial yang tidak menjadi.

Jadi, saya ambil inisiatif untuk membantu anda pasang widget Facebook Like Popup Timer yang betul-betul menjadi dan berfungsi.

Saya sudah cuba berkali-kali dan widgetnya terbukti berfungsi. Saya ambil daripada Kaki Network. Boleh lihat demi di bawah:


Tutorial Pasang Widget Facebook Like Popup Timer

Ikut 4 langkah mudah pasang widget:

1. Pergi ke Blogger dashboard > Template > Edit HTML.

2. Cari kod:

<body>

Kalau tidak jumpa, cari yang ini:

<body

Tip: Guna Ctrl + F untuk memudahkan carian anda.

3. Di bawahnya, letak kod ini:

<style type='text/css'>#fblikepop{background-color:#fff;display:none;position:fixed;top:200px;_position:absolute; /* hack for IE 6*/width:450px;border:10px solid #6F6F6F;z-index:200;-moz-border-radius: 9px;-webkit-border-radius: 9px;margin:0pt;padding:0pt;color:#333333;text-align:left;font-family:arial,sans-serif;font-size:13px;}#fblikepop body{background:#fff none repeat scroll 0%;line-height:1;margin:0pt;height:100%;}.fbflush{cursor: pointer;font-size:11px !important;color:#FFF !important;text-decoration:none !important;border:0 !important;}#fblikebg{background:none repeat scroll 0 0 #000000;display:none;height:100%;left:0;opacity:1!important;position:fixed;top:0;width:100%;z-index:100}#fblikepop #closeable{float:right;margin:7px 15px 0 0;}#fblikepop h1{background:#6D84B4 none repeat scroll 0 0;border-top:1px solid #3B5998;border-left:1px solid #3B5998;border-right:1px solid #3B5998;color:#FFFFFF !important;font-size:14px !important;font-weight:normal !important;padding:5px !important;margin:0 !important;font-family:&quot;Lucida Sans Unicode&quot;, &quot;Lucida Grande&quot;, sans-serif !important;}#fblikepop #actionHolder{overflow:hidden;}#fblikepop #buttonArea{background:#F2F2F2;border-top:1px solid #CCCCCC;padding:10px;min-height:50px;}#fblikepop #buttonArea a{color:#999999 !important;text-decoration:none !important;border:0 !important;font-size:10px !important;}#fblikepop #buttonArea a:hover{color:#333 !important;text-decoration:none !important;border:0 !important;}#fblikepop #popupMessage{font-size:12px !important;font-weight:normal !important;line-height:22px;padding:8px;background:#fff !important;}#fblikepop #counter-display{float:right;font-size:11px !important;font-weight:normal !important;margin:5px 0 0 0;text-align:right;line-height:16px;}</style>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
    kakinetworkdotcom01username="pages/Putera-izmancom/329480917076612",
    kakinetworkdotcom01title="Sila Like Untuk Menerima Info Berguna",
    kakinetworkdotcom01skin="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbYm-iPHSRmrHpnaAIRilCYdMQEpypI0FetwyPGVIsJNpX1_EREHj5WBFuMvVnqwJAxuNLoNWSSwQDwUo-oGkqEXZvwbLFHAJq8m09H1c4dTw8bdwAQ89p1H_LxKGF6WJHQ4ltld5RePw/s1600/FBLikePopUp04.png",
    kakinetworkdotcom01time="30",
    kakinetworkdotcom01wait="0",
    kakinetworkdotcom01lang="my"
//]]>
</script>
<script src='http://yourjavascript.com/21313234350/tawaunetwork.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
    $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>

Sebelum nak tambah kod di atas, edit dahulu.

Cari kod:

pages/Putera-izmancom/329480917076612

Gantikan dengan URL Facebook page anda.

4. Save template.

Penerangan Kod

kakinetworkdotcom01title="Sila Like Untuk Menerima Info Berguna",

Boleh ubah:

Sila Like Untuk Menerima Info Berguna

Dengan apa sahaja ayat yang anda mahu.

kakinetworkdotcom01skin="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbYm-iPHSRmrHpnaAIRilCYdMQEpypI0FetwyPGVIsJNpX1_EREHj5WBFuMvVnqwJAxuNLoNWSSwQDwUo-oGkqEXZvwbLFHAJq8m09H1c4dTw8bdwAQ89p1H_LxKGF6WJHQ4ltld5RePw/s1600/FBLikePopUp04.png",

Boleh ubah:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbYm-iPHSRmrHpnaAIRilCYdMQEpypI0FetwyPGVIsJNpX1_EREHj5WBFuMvVnqwJAxuNLoNWSSwQDwUo-oGkqEXZvwbLFHAJq8m09H1c4dTw8bdwAQ89p1H_LxKGF6WJHQ4ltld5RePw/s1600/FBLikePopUp04.png

Dengan URL gambar yang anda mahu.

kakinetworkdotcom01time="30",

Boleh ubah:

30

Dengan masa yang anda mahu. 30 itu untuk 30 saat. Andai mahu ia paparkan selama 5 minit, tukar sahaja 30 jadi 300.

Andai Widget-Nya Tidak Berfungsi, Bagaimana?

Punca ia tidak fungsi adalah kerana plugin jquery.

Tambah plugin ini untuk buat ia berfungsi:

1. Cari kod:

</head>

2. Di atasnya, tambah kod ini:

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

3. Save template.

Jika tidak berjaya juga, mohon komen di ruang komenter.

Daripada Penulis

Sebenarnya banyak lagi widget-widget Facebook Popup yang betul-betul berfungsi.

Salah satu yang saya jumpa ialah Facebook Popup (Like Box Widget).

Kalau anda baca diruang komenter dalam blog teresbut, ada jumpa satu lagi widget Facebook Popup versi Twitter Bootstrap.

Dan jangan lupa G+ entri ini. Terima kasih.

Related Post With Thumbnail
Assalamualaikum WBT dan selamat sejahtera kepada tetamu yang dihormati. Sejak sekian lama, blog ini jarang post kerana belajar template thesis theme untuk blogspot. Memang tidak dinafikan template itu sememangnya mesra SEO dam mesra pengguna (Semalaman tak tidor belajar template thesis).

Baiklah, kita kembali kepada tajuk asal. Related ini saya terjump semasa mencari template blogger, dan akhirnya alhamdulillah widget ini boleh digunakan dan diubahsuai sedikit untuk menjadikan ianya sebagai widget related post yang boleh diguna pakai.

Related post ini versi ke-4 kalau anda nak versi lama boleh lihat dengan klik link dibawah.
v1 >  Related Posts Yang Paling Cool Untuk Blogger
v2 >  Link Related Posts Blogger Yang Mengiurkan v2
v3 >  Related Post Mengkagumkan dengan Gambar Untuk Blogger v3

Anda juga perlu mengetahui apakah keistimewaan related post v4 ini

Apakah kelebihan related post ini?
  • Stylish.
  • Akan mengatakan "No related post available" Jika post page anda tidak mempunyai label(Anda boleh mengubah perkataannya nanti).
  • Mempunyai Thumbnail.
  • Mengurangkan bounce rate.

Jika anda nak melihat related post ini secare live boleh klik button demo di bawah.


Pasang Sekarang Widget Related Yang Stylish

1. Pergi ke Blogger Dashboard > Tempate > Klik Edit HTML > Klik Proceed > Klik Expand Widget Templates

2. Cari kod tersebut

<div class='post-footer'>

Nota: Jika anda terjumpa 2 kali, pilih yang mula-mula.

3. Selepas anda sudah jumpa kod di atas. Copy kod di bawah dan letakkan di atas kod <div class='post-footer'>

<style>#related-posts li{border-bottom:1px solid #eee;margin-bottom:10px;padding-bottom:10px}#related-posts a{font-weight:bold;font-size:13px;line-height:1.2em}#related-posts li{display:block;float:left;margin-left:15px;width:47%}#related-posts{margin-bottom:20px}.pthumb{float:left;margin:3px 10px 0 0;border:4px solid #eee;width:72px;height:55px;overflow:hidden;position:related}.heading-border{font-family:oswald;font-size:20px;font-weight:normal;margin:10px 0 15px;padding-left:15px}#related-posts&gt;ul{width:97.7%!important}</style>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<script type='text/javascript'>var ry=&#39;&lt;h3 class=&quot;heading-border&quot;&gt;&lt;span&gt;Post Yang Ditakdirkan Untuk Anda&lt;/span&gt;&lt;/h3&gt;&#39;;rn=&#39;&lt;h3 class=&quot;heading-border&quot;&gt;&lt;span&gt;No related post available&lt;/span&gt;&lt;/h3&gt;&#39;;rcomment=&quot;comments&quot;;rdisable=&quot;disable comments&quot;;commentYN=&quot;yes&quot;;var dw=&quot;&quot;;titles=new Array();titlesNum=0;urls=new Array();timeR=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(k){for(var h=0;h&lt;k.feed.entry.length;h++){var j=k.feed.entry[h];titles[titlesNum]=j.title.$t;for(var i=0;i&lt;j.link.length;i++){if(&quot;thr$total&quot; in j){commentsNum[titlesNum]=j.thr$total.$t+&quot; &quot;+rcomment}else{commentsNum[titlesNum]=rdisable}if(j.link[i].rel==&quot;alternate&quot;){urls[titlesNum]=j.link[i].href;timeR[titlesNum]=j.published.$t;if(&quot;media$thumbnail&quot; in j){thumb[titlesNum]=j.media$thumbnail.url}else{thumb[titlesNum]=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsVHU3mIyBd6XinFatBpcApZIb5cbBE-1NL6TMHaXMplRb78jTTTB8T8PEGMKJ5Nvh0Q3cWiQ7jnqSrZstUS5fx1ipQ4TVr-T7PYLm-iRClIXTjTCAlklPK6pvs4i2UsMLdtJLz7_fu_Su/&quot;}titlesNum++;break}}}}function removeRelatedDuplicates(){var d=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var h=0;h&lt;urls.length;h++){if(!contains(d,urls[h])){d.length+=1;d[d.length-1]=urls[h];c.length+=1;c[c.length-1]=titles[h];e.length+=1;e[e.length-1]=timeR[h];f.length+=1;f[f.length-1]=thumb[h];g.length+=1;g[g.length-1]=commentsNum[h]}}urls=d;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(a,h){for(var i=0;i&lt;a.length;i++){if(a[i]==h){return true}}return false}function printRelatedLabels(h){var j=h.indexOf(&quot;?m=0&quot;);if(j!=-1){h=h.replace(/\?m=0/g,&quot;&quot;)}for(var d=0;d&lt;urls.length;d++){if(urls[d]==h){urls.splice(d,1);titles.splice(d,1);timeR.splice(d,1);thumb.splice(d,1);commentsNum.splice(d,1)}}var i=Math.floor((titles.length-1)*Math.random());var d=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+=&quot;&lt;ul&gt;&quot;;while(d&lt;titles.length&amp;&amp;d&lt;20&amp;&amp;d&lt;maxresults){if(j!=-1){urls[i]=urls[i]+&quot;?m=0&quot;}if(commentYN==&quot;yes&quot;){comments[i]=&quot; - &quot;+commentsNum[i]}else{comments[i]=&quot;&quot;}dw+=&#39;&lt;li&gt;&lt;div class=&quot;pthumb&quot;&gt;&lt;img alt=&quot;&#39;+titles[i]+&#39;&quot; src=&quot;&#39;+thumb[i]+&#39;&quot;/&gt;&lt;/div&gt;&lt;a href=&quot;&#39;+urls[i]+&#39;&quot;&gt;&#39;+titles[i]+&#39;&lt;/a&gt;&lt;div class=&quot;clear&quot;&gt;&lt;/div&gt;&lt;/li&gt;&lt;/div&gt;&#39;;if(i&lt;titles.length-1){i++}else{i=0}d++}dw+=&quot;&lt;/ul&gt;&quot;}urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById(&quot;related-posts&quot;).innerHTML=dw}</script>
<a href="http://danialde4.blogspot.com.com" title="Danialde4 - Diari Motivasi Blog" ><img src="http://img1.blogblog.com/img/blank.gif" /></a>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>var maxresults=6;removeRelatedDuplicates();printRelatedLabels(&quot;<data:post.url/>&quot;);</script>
</div>
<div class='clear'/>
</b:if>
Code Updated: 8:55 > 12/11/2012

4. Preview dahulu. Jika tiada apa-apa masalah SAVE N DONE!!!.

Pengubahsuaian

Anda boleh mengubah beberapa kod/ayat.

ABC - Post Yang Ditakdirkan Untuk Anda

Anda nampak yang saya highlight tu? Mestilah. Anda boleh gantikan ayat tersebut dengan ayat yang anda mahu.

ABC - No related post available

Yang ni juga anda boleh gantikan dengan ayat yang anda mahu

ABC
- maxresults=6

Ha, inilah yang khasnya. Max results, maksudnya berapa banyak yang anda ingin paparkan Thumbnail pada related post tersebut. Saya pilih 6 anda pula bagaimana?


Daripada Penulis

Alhamdulillah, anda sudah siapa memasang widget related post ini. Kesemua kod ini dikreditkan ke Sora Templates. Kerana blog tersebut saya boleh kongsikan kepada anda widget ini.

Kalau anda ada sebarang masalah nak memasang widget ini, silalah komen dibawah. Jangan segan-segan. Komen di blog ini sudah diperbaharui dengan system facebook comment. Tak percaya? Lihat sendiri dibawah.

See?

Assalamualaikum WBT dan selamat sejahtera kepada tetamu yang dihormati. Amat jarang sekali saya mendupate blog sehinggakan menampak aurat(Main2 hehe... ;). Saya ingin meminta maaf sebab jarang update blog. Harap kemaafan saya dapat diterima.

Baiklah, post kali ini ialah tentang widget untuk blogspot. Widget related post ini boleh dikatakan lebih hebat dari sebelum ini. Kalau anda terlepas dengan widget sebelum ini sila lihat dahulu yang pertama dan kedua, manala tahu berkenan di hati... gunalah widget tersebut. Tetapi kali ni widget related post ini lebih hebat.

Jadi Apakah Kelebihan Widget Related Post ini?

  • Cool Hover
  • Large Thumbnail

Kalau guna ayat bukan jelas pun gambarannya. Nak lebih jelas sila lihat demo dibawah


Pasang Sekaranag Kat Blog Anda!

1. Log In Blogger.com

2. Pergi ke "TEMPLATE"

3. Klik "EDIT HTML"

4. Klik "PROCEED"

5. Tik "EXPAND WIDGET TEMPLATES"

6. Cari kod dibawah

<div class='post-footer'>

NOTA: Selalunya terjumpa 2 kali. Pilih yang mula-mula(ke-1) bukan yang ke-2.

7. Selepas jumpa kod di, letak kod dibawah(#8) Di ATAS kod #6

8. Kod (#8)

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
/*
Related Post with Thumbnail & Summary 1.0 (May 02, 2011)
copyright (c) 2011 Hendriono from http://modification-blog.blogspot.com/
*/
var relnojudul = 0;
var relmaxtampil = 4;
var numchars = 200;
var reljudul=new Array();var relurls=new Array();var relcuplikan=new Array();var relgambar=new Array();function saringtags(g,h){var e=g.split("<");for(var f=0;f<e.length;f++){if(e[f].indexOf(">")!=-1){e[f]=e[f].substring(e[f].indexOf(">")+1,e[f].length)}}e=e.join("");e=e.substring(0,h-1);return e}function relpostimgcuplik(h){for(var e=0;e<h.feed.entry.length;e++){var g=h.feed.entry[e];reljudul[relnojudul]=g.title.$t;postcontent="";if("content" in g){postcontent=g.content.$t}else{if("summary" in g){postcontent=g.summary.$t}}relcuplikan[relnojudul]=saringtags(postcontent,numchars);if("media$thumbnail" in g){postimg=g.media$thumbnail.url}else{postimg="http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.GIF"}relgambar[relnojudul]=postimg;for(var f=0;f<g.link.length;f++){if(g.link[f].rel=="alternate"){relurls[relnojudul]=g.link[f].href;break}}relnojudul++}}function contains(a,e){for(var f=0;f<a.length;f++){if(a[f]==e){return true}}return false}function artikelterkait(){var v=new Array(0);var w=new Array(0);var x=new Array(0);var A=new Array(0);for(var u=0;u<relurls.length;u++){if(!contains(v,relurls[u])){v.length+=1;v[v.length-1]=relurls[u];w.length+=1;w[w.length-1]=reljudul[u];x.length+=1;x[x.length-1]=relcuplikan[u];A.length+=1;A[A.length-1]=relgambar[u]}}reljudul=w;relurls=v;relcuplikan=x;relgambar=A;for(var u=0;u<reljudul.length;u++){var B=Math.floor((reljudul.length-1)*Math.random());var i=reljudul[u];var s=relurls[u];var y=relcuplikan[u];var C=relgambar[u];reljudul[u]=reljudul[B];relurls[u]=relurls[B];relcuplikan[u]=relcuplikan[B];relgambar[u]=relgambar[B];reljudul[B]=i;relurls[B]=s;relcuplikan[B]=y;relgambar[B]=C}var r=0;var D=Math.floor((reljudul.length-1)*Math.random());var z=D;var q;var t=document.URL;while(r<relmaxtampil){if(relurls[D]!=t){q="<li class='news-title clearfix'>";q+="<a href='"+relurls[D]+"' rel='nofollow' target='_top' title='"+reljudul[D]+"'><div class='overlayb'></div><img src='"+relgambar[D]+"' /></a>";q+="<a class='relinkjdulx' href='"+relurls[D]+"' target='_top'>"+reljudul[D]+"</a>";q+="<span class='news-text'>"+relcuplikan[D]+"</span>";q+="</li>";document.write(q);r++;if(r==relmaxtampil){break}}if(D<reljudul.length-1){D++}else{D=0}if(D==z){break}}};
//]]>
</script>
<style>
#related_posts h4{margin:0;padding:0;font-size:200%;height:39px;color:#181818}
#related_posts{overflow:hidden;margin-top:30px}
#relpost_img_sum{margin:0;padding:0}
#relpost_img_sum:hover{background:none}
#relpost_img_sum ul{list-style-type:none;background:none;margin:0;padding:0}
#relpost_img_sum li{overflow:hidden;margin:0;padding:0;height:124px;list-style:none;width:49.5%;float:left;margin-right:2px;margin-bottom:2px}
#relpost_img_sum li:nth-child(odd){margin-right:2px}
#relpost_img_sum .news-title{font-weight:bold !important;display:block;position:relative;margin:1px}
#relpost_img_sum li .relinkjdulx{position:absolute;font-size:140%;color:white;left:15px;line-height:20px;bottom:30px;text-shadow:0 1px 0 black;z-index:2}
#relpost_img_sum .news-text{display:block;text-align:left;text-transform:none;position:absolute;left:-9999px;bottom:-9999px;font-weight:normal}
#relpost_img_sum img{float:left;width:100%;height:180px;position:absolute;bottom:-30px}
.overlayb{width:100%;height:200px;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk-ML09mUOk8SJ-AawS9DQHBcBgR_aPQxqj7X3N9SeahUtEYhmBfw9w7tG64ua0MbdWTjo6DkS3CcveUWZNhmUt-KJCgRkreIvrdcvL7ifqyI_G85StpOlUkgl4JjoxLoAWLekAwPLrLA/s1600/linebg-fade.png);z-index:1;position:absolute;background-position:0 0;background-repeat:repeat-x;bottom:-10px;transition:all 0.3s ease-in-out 0s;}
#relpost_img_sum li:hover .overlayb{-khtml-opacity:0;-moz-opacity:0;opacity:0}
</style>
<div id='related_posts'>
<h4>Related Post</h4>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=relpostimgcuplik&amp;max-results=99999&quot;' type='text/javascript'/>
</b:loop>
<ul id='relpost_img_sum'>
<script type='text/javascript'>
artikelterkait();
</script>
</ul>
</div>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(e, b) {
var c = document.getElementById(e),
d = c.getElementsByTagName("img");
for (var a = 0; a < d.length; a++) {
d[a].src = d[a].src.replace(/\/s72\-c/, "/s" + b + "");
d[a].width = b;
d[a].height = b
}
}
resizeThumb("related_posts", 328);
//]]>
</script>
</b:if>


9. Klik "PREVIEW"

10. Kalau tidak ada apa-apa error klik SAVE TEMPLATE!!!

Senangkan. Cuma 10 langkah sahaja :D

Dari Penulis

Memang lama saya menghilang, entah kemana tidak ada arah tuju... huhu :(

Tapi, Alhamdulillah Tuhan telah pertemukan anda untuk membaca tutorial ini. Widget ini sebenarnya dari template Extra News. Saya ambil dan edit sikit untuk membuat ianya satu widget yang boleh dikongsikan untuk anda.

Kalau ada apa-apa masalah komen-komen lah di bawah.

Anda ada hak untuk komen, disini ialah blog yang terbuka. Komen anda amat bernilai untuk saya :)

Wallahualam

Link Related Posts Blogger Yang Menguirkan v2

Assalamualaikum WBT dan selamat sejahtera kepada tetamu yang dihormati. Baru sahaja saya post "Related Posts Yang Paling Cool Untuk Blogger", rakan saya request related post serupa seperti saya. Nak tahu siapakah rakan saya tu?

Gemok Imba(Xitox)

Admin kepada eBusuk.blogspot.com

Yang banner kat atas kanan itu ialah blog beliau.

Untuk related post ini cuma ada Link dah hover yang mengiurkan .

Tanpa membuang masa lagi marilah kita menambahkan Widget Related post ini :D

Menambahkan Widget Link Related Post Pada Blogger


1. Log In Blogger.com

2. Drop Down Menu > Template

3. Edit Template

4. Proceed

5. Cek kotak > Expand Widget Templates

6. Cari code tersebut:-

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='clear:both;'/>
<div class='post-share-buttons'>

7. Copy code di bawah dan letakkan code di bawah > di atas code tadi(6):-

<style>
.rbbox{-moz-transition:0.7s;-webkit-transition:0.7s;border:1px solid rgb(192,192,192);padding:5px;background-color:#f0f0f0;-moz-border-radius:5px;margin:5px}
.rbbox:hover{-moz-transition:0.7s;-webkit-transition:0.7s;background-color:rgb(255,255,255)}
#relpostFs{border:1px solid rgb(204,204,204);margin:0;padding:3px 5px;overflow:auto;max-height:200px;-moz-border-radius:5px}
</style>
<!-- RELATED POSTS: http://Danialde4.blogspot.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<H3>Related Post</H3>
<DIV class='rbbox'>
<DIV id='relpostFs'>
<DIV id='albri'/>
<SCRIPT type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 10;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 2;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;albri&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</SCRIPT>
</DIV>
<script type='text/javascript'>RelPost();</script>
</DIV>
</b:if>
<!-- /RELATED POSTS -->

8. Preview Template

9. Kalau tiada Error > Save N Done !

Pengubahsuaian

DE4 - maxNumberOfPostsPerLabel = 100

100 tu boleh tukar ke seberapa banyak link yang kalian mahukan :)

Dikemaskini: Jumlah post yang nak kita paparkan


DE4 - maxNumberOfLabels = 2

2 bermaksud berapa banyak label yang ditunjuk. Kalau, tulis 3. Maka 3 label akan keluar.
Dikemaskini: Jumlah label yang nak kita paparkan


Contok (Kalau tulis 2).

Tutorial
... Link related post ...
... Link related post ...
... Link related post ...

Blogger
... Link related post ...

... Link related post ...
... Link related post ...

Lebih kurang bergitulah :)

Akhirnya... dalam sehari ni macam tidak percaya yang saya post 2 kali.

Wasalam ^_^ 

DikemasKini = 7/10/2012 - 3:42 Malaysia

Related Posts Yang Paling Cool Untuk Blogger

Assalamualaikum WBT dan selamat sejahtera kepada tetamu yang dihormati. Related post ini ialah daripada rakan saya dari Indonesia iaitu Mas Maskolis. Siapa yang tidak kenal dengan Maskolis. Kehebatan beliau mencipta template yang mengiurkan menyebabkan seluruh dunia mengenalinya. Semalam saya ada post artikel "Bagaimana nak menambah traffik blog". Hari ini, alhamdulillah saya ada sedikit kelapangan masa untuk berkonsikan bersama anda Related post yang direka oleh Mas Maskolis dan diubahsuai oleh Saya.




Menambahkan Related Posts Pada Blogger

1. Log In Blogger.com

2. Drop Down Menu > Template

3. Edit Template

4. Proceed

5. Cek kotak > Expand Widget Templates

6. Cari code tersebut:-

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='clear:both;'/>
<div class='post-share-buttons'>

7. Copy code di bawah dan letakkan code di bawah > di atas code tadi(6):-

<style>
ul#related-posts{background:none repeat scroll 0 0 #F9FAFB;border:1px solid #DDDDDD;border-radius:10px 10px 10px 10px;box-shadow:0 0 5px buttonshadow inset;float:left;font:17px verdana;list-style:none outside none;margin:10px 0;padding:10px}
ul#related-posts li{float:left;height:auto;list-style-type:none;margin:0 5px;padding:2px 1px}
ul#related-posts li a{border:4px solid #BBBBBB;color:#EAEAEA;display:block;height:100px;position:relative;text-decoration:none;text-shadow:0 1px 0 #000000;width:100px}
ul#related-posts li .overlay{height:95px;line-height:16px;padding:6px 0 0 6px;position:absolute;width:95px;z-index:10}
ul#related-posts li a:hover .overlay{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg303tvj97IJPYvKKLOh-OMpSpePe5-levTCMtbAeeBJwbqsMDIze4zfBPzt4oXD9UV9_i8-UYaQ0tCRipBnviYkNLktSfTS7GViumrK9LhY1ktz4pSc3iv4079n4R8FuTDESmQ450eHkw/s1600/transparant.png") repeat scroll 0 0 transparent;display:block !important}
ul#related-posts li img{bottom:0;padding:0 !important}
ul#related-posts li a:hover{border:4px solid #666666}
</style>
<!-- RELATED POSTS: http://Danialde4.blogspot.com-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP7KL_dLyqlqT5aJBlSzZX6CNhL1zq7nq0XCirAJrdj0o8d8rBbbe8VmwNyKK0jNKLz-LAQRs1b6HDTZ-C86ZSDwJgkO5k2d3-SeamO3M00jVuiR2ecnsu2h6LeNFNLw3g69G0Aig3vDM/s1600/no+image.jpg&quot;;
var maxresults=5;
</script>
<script src='http://dl.dropbox.com/u/77764861/relatedimage.js' type='text/javascript'/>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/>
</b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</b:if>

8. Preview Template

9. Kalau tiada Error > Save N Done !

Pengubahsuaian

Untuk pengubahsuaian, kita boleh mengubah

DE4 - Kode warna merah yang ditulis 5 kepada jumlah yang kita mahukan. Kalau kita tulis 10 maka 10 lah yang akan keluar related post nanti.
Dikemaskini: Jumlah post yang nak kita paparkan

DE4 - Kode highlighting itu dutilis 6. Kalau kita mahu tulis pada code merah tadi 10, maka code kuning mesti kena lebih 1 daripada jumlahnya.

Tak faham?

Okey. Kalau saya tulis

var maxresults=10;

yang max-results=6 akan lebih satu


max-results=11


Harapa anda faham. Yang penting faham


Maka berakhirlah tutorial saya hari ini ^_^
Wasalam

Widget Radio RCFM Untuk Blogger/Blogspot
Assalamualaikum WBT dan selamat sejahtera kepada tetamu yang dihormati. Alhamdulillah, hari ini saya berkesempatan untuk berkongsikan bersama anda tentang widget Radio RCFM. Radio ini ialah salah sebuah produk keluaran Rileks Community.
Sebenarnya radio ini memang best. Kalau and berasa bosan bolehlah pasang pada blog :)


Ok, itu cuma sekadar pembukaan post ini. Baiklah sekarang anda tidak sabar untuk memasang widget ini :P


DEMO

P.S: Kalau anda pengguna chrome sila allow dahulu pop-up. Lihat contoh dibawah:


Widget Radio RCFM

Lets start the tutorial ^_^

Just follow step by step

>> Login Blogger
>> Pergi Ke page layout
>> Click Add a widget
>> Pilih HTML/JavaScript
>> Masukkan code di bawah

Radio RCFM


Pengubahsuaian

Kalau anda ingin membuat radio tersebut auto-play anda perlu cari kod:
autostart=false

Dan gatikan dengan kod dibawah:
autostart=true

Dari Penulis

Alhamdulillah, akhirnya blog anda tidaklah kesunyian sekepas ini. Adakah anda merasakan post ini berguna untuk anda? Kalau ya apa kata kongsikan bersama rakan semuka buku anda.

Kalau tidak?

Tinggalkan komen dibawah :)

Kredit kepada: Rileks Community


Assalamualaikum w.b.t dan salam sejahtera. Membuat duit secara online merupakan salah satu side income yang popular pada masa kini. Antara laman web yang popular untuk mebuat membuat duit secara online yang popular di Malaysia ialah Churp Churp, Says, dan Nuffnang. Para blogger di Malaysia giat membuat duit secara online menggunakan servis di atas, walaupun begitu ramai juga ingin mencari bagaimana nak membuat duit dengan cepat, ringkas dan senang. Oleh itu Danialde4 akan memberi trik yang simple dan mudah untuk membuat RM 1 dengan seklik sahaja.

Tabel of contents

Customize link for Churp Churp and Says

Open multiple windows in single click

Mari kita berlajar belajar bagaimana nak mebuka multiple windows dengan single click

1) Firstly, cari dekat HTML kod serupa mcm ni <a>
<a href="URL_ANDA" target="_blank">Link pertama</a>
Bila tekan link serupa itu dia akan membuka new tab/window.

target="_blank" ialah code pada html untuk membuka new tab/window.

2) Untuk menambah link, cuma tambah code di bawah sebelum code ini {">}
onclick="window.open(&quot;LINK_KE2_ANDA&quot;);
Note: code onclick=" hanya tambah pada link ke2. link ke3, ke4, ke5 dan seterusnya tak payah buat cuma copy selepas onclick="

So, code di atas akan menjadi macam ini

<a href="URL_ANDA" target="_blankonclick="window.open(&quot;LINK_KE2_ANDA&quot;);">Link Multiple</a>
3) Untuk menambah link ketiga, ke4, ke5 dan seterusnya cuma tambah code yang sama pada #2 tadi

4) Dan contoh selepas gabungan code di atas akan menjadi macam ni
<a href="URL_ANDA" target="_blank" onclick="window.open(&quot;LINK_KE2_ANDA&quot;); window.open(&quot;LINK_KE3_ANDA&quot;);">Link Multiple</a>
NOTE: Anda boleh membuat contoh menggunakan Real-time HTML Editor
Untuk Contoh

Customize link for Churp Churp and Says

Bagaimana pula nak "Membuat RM 1 Di Says/Churp2 Dengan Satu Klik" menggunakan kaedah di atas?

1) Dapatkan mana2 link Churp2 atau Says gantikan LINK_KE2_ANDA / LINK_KE3_ANDA dengan link yang anda dapat.

Contoh:
<a href="http://danial-ar.blogspot.com/" target="_blank"  onclick=" window.open(&quot;http://my.churpchurp.com/Danialde4/share/churpchurp-invite&quot;);
window.open(&quot;http://my.churpchurp.com/Danialde4/share/FordVote&quot;);"
>
Please Vote to get PRIZE!!</a>

2) Dan code di atas apabila link sebenar dia akan jadi mcm di bawah

Please Vote to get PRIZE!!

3) Itu cuma 3 link, hanya dapat 60 sen. Kalau nak buat RM 1 macam mana pula? Cuma tambah code #2 seperti yang sebelumnya. (Tak semestinya dapat RM 1!)

Contoh:
<a href="http://danial-ar.blogspot.com/" target="_blank"  onclick="window.open(&quot;http://my.churpchurp.com/Danialde4/share/churpchurp-invite&quot;); window.open(&quot;http://my.churpchurp.com/Danialde4/share/FordVote&quot;); window.open(&quot;http://my.churpchurp.com/Danialde4/share/FordVote&quot;); window.open(&quot;http://my.churpchurp.com/Danialde4/share/FordVote&quot;);">
Please Vote to get PRIZE!!</a>
Dan link di atas anda boleh copy, paste kat  Real-time HTML Editor
Untuk Contoh

Kesimpulan

Kebanyakan Blogger di Malaysia meggunakan trik ni, tetapi jangan lah tamak sangat nak buat banyak2 kerana kemungkinan besar anda boleh di BAN. So akhir kata daripada saya gunakanlah ilmu sebaik-baik mungkin untuk menolong orang.

Wasalam Danialde4 ^_^

P/S: Pening? tidak boleh buat? confuse? just comment kat bawah 2. Jangan segan2 jangan malu2 nak bertanya

NOTE: Saya syorkan anda menggunkan bit.ly untuk mengetahui berapa banyak orang dah click link anda

[Updated] Pada 15/8/2012 5:44 AM

Hubungi Saya

Nama

E-mel *

Mesej *

100% Percuma Ebook

[FREE] Ebook Rahsia Google PageRank
Email *

Sumber Inspirasi

Danial Abdul Rahim