Showing posts with label related. Show all posts
Showing posts with label related. Show all posts
Thursday, December 1, 2016
Cara Membuat Related Post Valid Html 5
Cara Membuat Related Post Valid Html 5
Cara Membuat Related Post Valid Html 5 - Artikel terkait atau related post merupakan widget yang menghubungkan artikel satu dengan artikel yang lainya .sehingga memudahkan pengunjung untuk menemukan artikel terkait tersebut . nah bicara masalah valid html5 nih ya pada umunya widget related post ini hanya valid di home page saja sedangkan di halaman postingan ini widget artikel post nya belum valid .

Oh ya related post ini juga dilengkapa dengan tag alt dan tag title . jadi related post ini sangat mendukung untuk optimasi seo blog anda . Berikut simak caranya ya
Cara Membuat Related Post Valid Html 5
- Masuk ke blog anda dulu
- Pilih menu Template => Edit HTML
- Kemudian cari kode ]]></b:skin>
- Setelah ketemu kode tersebut . kemudian letakan kode css dibawah ini tepat diatas kode ]]></b:skin>
#related-post background:none;width:100%;margin-top:35px;margin-bottom:10px;padding:5px 0 10px 0px}
#related-post h4{font-size:150%;text-transform:uppercase;margin:0 0 15px;padding:0;font-weight:normal}
#related-post li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnxF1xUThm9eKursOV0NHSYB_jMy6I1MId5TFLUkLa5y-lSDeWu_msUR_58nJWuGxA-3xca_p56o-dD03C32b-VyjsKdDsM-RoLI8SJ0EcaHjTLSicSn_q8mKqKD4jB9BbpjnP4Zl1wNM0/s1600/bullet.png) no-repeat 1px 5px;color:#2c3e50;text-indent:0;line-height:1.6em;margin:0;padding:0 0 3px 19px}
#related-post .widget{margin:0;padding:0}
#related-post ul{list-style:none;margin:0;padding:0}
- Setelah itu Klik Save
- Ettt . langkahnya belum selesai brow tinggal sedikit lagi
- Langkah selanjutnya yaitu sobat cari kode <div class=post-footer-line post-footer-line-1>
<!-- Related Post Widget Mulai -->
<b:if cond=data:blog.pageType == "item">
<div id=related-post class=related-post/>
<script type=text/javascript>
var labelArray = [<b:if cond=data:post.labels><b:loop values=data:post.labels var=label>
"<data:label.name/>"<b:if cond=data:label.isLast != "true">,</b:if>
</b:loop></b:if>];
var relatedPostConfig = {
homePage: "<data:blog.homepageUrl/>",
widgetTitle: "<h4>Artikel Terkait:</h4>",
numPosts: 5,
titleLength: "auto",
containerId: "related-post",
newTabLink: false,
widgetStyle: 1,
callBack: function() {}
};
</script>
<script type=text/javascript src=https://kang-is.googlecode.com/svn/trunk/javascript/related-post.min.js/>
</b:if>
<!-- Related Post Widget Selesai-->
- Nah langkah yang terakhir baru klik save
- Done ( selesai ) Taraaa kini sobat sudah bisa Membuat Related Post Valid Html 5
Untuk memastikan related post tersebut valid atau tidak silahkan cek di validator css5 dan html 5 jika tidak ada error itu bearti valid oh , ya nanti kalau udah jadi Artikel terkait nya jadinya kayak gini sob Trims spesial to +Kang Ismet

Go to link Download
Saturday, November 26, 2016
Cara Membuat related Post Di Bawah Postingan
Cara Membuat related Post Di Bawah Postingan
Cara mudah membuat related post - Cara Baru Membuat Artikel Terkait dibawah Posting merupakan suatu cara baru yang harus kita terapkan pada blog yang kita punya jika dalam templete yang kita gunakan tidak ada related post / artikel terkait ini.
Fungsi dari memasang artikel terkait dalam setiap posting mempunyai pengaruh yang besar terhadap jumlah pageview setiap pengunjung. Bisa dibayangkan jika satu orang pengunjung blog anda membuka 2-4 artikel anda maka trafiik pun akan meningkat dan ini semakin membuat website / blog anda lebih disukai oleh search engine seperti google.
Jika anda tidak terlalu percaya dengan apa kata saya diatas, perhatikan sekarang dengan apa yang terjadi pada blog saya ini. Lihat pada widget Statistik Blog dan perhatikan aplikasi Histat saya yang menunjukkan counter Visitor dan Page View. Jika dihitung perbandingan antara keduanya adalah 1:4. sehingga dapat disimpulkan, pengunjung blog saya ini rata rata membuka 4 halaman artikel setiap berkunjung. Tentunya selain artikel terkait yang saya pasang, saya juga Membuat Recent Post / Artikel yang terbaru saya terbitkan.
Jika anda tertarik ingin meningkatkan page view seperti saya tersebut, maka simak saja langkah dalam membuat artikel terkait dibawah ini karena sangat mudah dilakukan.
Cara membuat Related Post Artikel Terkait :
1. Login ke Akun Blog Anda, dalam hal ini blogger karena saya menggunakan blogspot
2. Klik Templete, lalu pilih Edit HTML
3. Kemudian anda cari kode <data:post.body/>,
Gunaka CTRL+F agar pencarian lebih Mudah dan jika menemukan kode tersebut lebih dari satu, gunakan kode yang ke-2 dari atas
4. Copy-paste kode berikut ini di bawah kode <data:post.body/> yang sudah saya jelaskan pada point nomor 2
<b:if cond=data:blog.pageType == "item">
<p style=font-style:bold;>ARTIKEL TERKAIT:</p>
<div class=rbbox>
<div style=margin:0; padding:10px;height:150px;overflow:auto;border:1px solid #ccc;>
<div id=albri/>
<script type=text/javascript>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 15;
maxNumberOfPostsPerLabel = 50;
maxNumberOfLabels = 3; function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
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 < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('albri').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
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 = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type=text/javascript>RelPost();</script>
</div>
</b:if>
5. Selanjutnya cari kode ]]></b:skin>
6. Copy-paste semua code berikut ini tepat diatasnya kode ]]></b:skin>
.rbbox{border: 1px solid #000000;padding: 5px;
background-color: #F2F2F2;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: #EFFBEF;}
.rbbox ul li {
display : block;
background : url(http://i1237.photobucket.com/albums/ff469/indolaron/icon/005.png) no-repeat 0px 0;
margin-left : -10px;
padding-top : 0;
padding-right : 0px;
padding-bottom : 1px;
padding-left : 20px;
margin-bottom : 5px;
line-height : 1em;
border-bottom:1px dotted #cccccc;}
7. Klik Save/Simpan Templete
KETERANGAN TAMBAHAN:
*ARTIKEL TERKAIT, = bisa diganti sesuai keinginan. misal: Related Post, Baca Juga, Read more ataupun yang lain terserah
*maxNumberOfPostsPerLabel = 50; = jumlah posting atau artikel terkait yang ingin Anda tampilkan
*maxNumberOfLabels = 3; = jumlah label terkait yang ingin ditampilkan
*background-color: #F2F2F2; = warna background kotakan artikel terkait dan bisa diganti sesuai selera
*background-color: #EFFBEF; = warna background saat kursor menyorot olom tersebut
*http://i1237.photobucket.com/albums/ff469/indolaron/icon/005.png = icon didepan link
Go to link Download
Sunday, November 20, 2016
Cara Membuat Related Post Berupa Gambar Thumbnail
Cara Membuat Related Post Berupa Gambar Thumbnail
UNTUK melengkapi posting Cara Membuat Recent Post (Lates Post, Posting Terbaru) dengan Gambar yang cocok buat blog foto dan toko online, kali ini CB share tentang Related Postnya (Posting Terkait) yang juga dengan gambar (thumbnail image).
Jenis Posting Terkait ini HANYA berupa gambar. Judul akan muncul saat cursor mouse diarahkan ke gambar.
Ini penampakan Related Posts dengan gambar yang sudah coba diterapkan dan berhasil di CB Blogger Lab.
Untuk blogger biasa --bukan blog foto/toko online, sebaiknya tidak menggunakan Related Post dengan Thumbnail Image biar lebih cepat loadingnya.
Related Post sendiri adalah bagian dari navigasi dan internal link blog yang bagus buat seo dan user. Google menganjurkan navigasi dan internal linking di halaman situs web. Related Post juga memudahkan user mencari informasi lain denga tag, label. atau topik yang sama.
Cara Membuat Related Post Berupa Gambar Thumbail di Blogger
1. "Template" > "Edit HTML"2. Copy & Paste kode berikut ini di atas kode ]]></b:skin>
/* Related Posts dengan Gambar */
.related-post .post-thumbnail {
z-index: 1;
position: relative;
width: 98px;
height: 98px;
margin: 0;
display: block;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: inset 2px 2px 5px #444;
-moz-box-shadow: inset 2px 2px 5px #444;
box-shadow: inset 2px 2px 5px #555;
}
.related-post {
float: left;
position: relative;
width: 98px;
height: 98px;
margin: 0 10px 10px 0;
background: #F6F6F6;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.related-post .related-post-title {
display: none;
float: left;
background: #000;
color: #fff;
text-shadow: none;
font-weight: bold;
padding: 10px;
position: absolute;
top: -20px;
left: 40px;
z-index: 2;
width: 200px;
-webkit-box-shadow: 0 0 2px #444;
-moz-box-shadow: 0 0 2px #444;
box-shadow: 0 0 2px #444;
}
.related-post:hover .related-post-title {display: block;}
.related-post .post-thumbnail {
z-index: 1;
position: relative;
width: 98px;
height: 98px;
margin: 0;
display: block;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: inset 2px 2px 5px #444;
-moz-box-shadow: inset 2px 2px 5px #444;
box-shadow: inset 2px 2px 5px #555;
}
.related-post {
float: left;
position: relative;
width: 98px;
height: 98px;
margin: 0 10px 10px 0;
background: #F6F6F6;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.related-post .related-post-title {
display: none;
float: left;
background: #000;
color: #fff;
text-shadow: none;
font-weight: bold;
padding: 10px;
position: absolute;
top: -20px;
left: 40px;
z-index: 2;
width: 200px;
-webkit-box-shadow: 0 0 2px #444;
-moz-box-shadow: 0 0 2px #444;
box-shadow: 0 0 2px #444;
}
.related-post:hover .related-post-title {display: block;}
Keterangan:
Yang berwarna merah adalah ukuran gambar.
2. Cari (Ctrl+F) kode yang seprti berikut ini:
2. Cari (Ctrl+F) kode yang seprti berikut ini:
<div class=post-footer>
<div class=post-footer-line post-footer-line-1/>
<div class=post-footer-line post-footer-line-2/>
<div class=post-footer-line post-footer-line-3/>
</div>
</div>
<div class=post-footer-line post-footer-line-1/>
<div class=post-footer-line post-footer-line-2/>
<div class=post-footer-line post-footer-line-3/>
</div>
</div>
3. Copy & Paste kode berikut ini di bawah kode tersebut:
Keterangan:
4. Baca basmalah biar berhasil dan berkah... dan Save Template!
<div id=related-posts>
<b:if cond=data:blog.pageType == "item">
<script type=text/javascript>//<![CDATA[
var ry=<h3>Related Posts</h3>;rn=<h3> No related post available</h3>;rcomment=comments;rdisable=disable comments;commentYN=no;
var dw=;titles=new Array();titlesNum=0;urls=new Array();timeR=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if(thr$total in d){commentsNum[titlesNum]=d.thr$total.$t+ +rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;timeR[titlesNum]=d.published.$t;if(media$thumbnail in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmGuZt_XD7lgxAtb0yxjQy8taeluRg1KG9Bo-f5mQfYE4WeVK5_Tcr2qj8hkE9HdjzK_5QNzhPXpARDiRcHBbcBXib5A-n7SlOrjz6h6-3CvQam2Xx8C4eObjap7sru_8MN6y2-3rUKm76/};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=timeR[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf(?m=0);if(y!=-1){a=a.replace(/?m=0/g,)}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);timeR.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+=<div class="clear"/></div><ul>;while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+?m=0}if(commentYN==yes){comments[c]= - +commentsNum[c]}else{comments[c]=};dw+=<div class="related-post"><div class="related-post-title">+titles[c]+</div><a href="+urls[c]+" rel="nofollow"><img border="0" class="post-thumbnail" alt="+titles[c]+" src="+thumb[c]+"/></a></div></div>;if(c<titles.length-1){c++}else{c=0}b++}dw+=</ul>};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById(related-posts).innerHTML=dw};
//]]></script>
<b:loop values=data:post.labels var=label>
<script expr_src="/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels" type=text/javascript/>
</b:loop>
<script type=text/javascript>varmaxresults=5;removeRelatedDuplicates();printRelatedLabels('<data:post.url/>');</script>
</b:if>
</div>
<div class=clear/>
<b:if cond=data:blog.pageType == "item">
<script type=text/javascript>//<![CDATA[
var ry=<h3>Related Posts</h3>;rn=<h3> No related post available</h3>;rcomment=comments;rdisable=disable comments;commentYN=no;
var dw=;titles=new Array();titlesNum=0;urls=new Array();timeR=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if(thr$total in d){commentsNum[titlesNum]=d.thr$total.$t+ +rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;timeR[titlesNum]=d.published.$t;if(media$thumbnail in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmGuZt_XD7lgxAtb0yxjQy8taeluRg1KG9Bo-f5mQfYE4WeVK5_Tcr2qj8hkE9HdjzK_5QNzhPXpARDiRcHBbcBXib5A-n7SlOrjz6h6-3CvQam2Xx8C4eObjap7sru_8MN6y2-3rUKm76/};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=timeR[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf(?m=0);if(y!=-1){a=a.replace(/?m=0/g,)}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);timeR.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+=<div class="clear"/></div><ul>;while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+?m=0}if(commentYN==yes){comments[c]= - +commentsNum[c]}else{comments[c]=};dw+=<div class="related-post"><div class="related-post-title">+titles[c]+</div><a href="+urls[c]+" rel="nofollow"><img border="0" class="post-thumbnail" alt="+titles[c]+" src="+thumb[c]+"/></a></div></div>;if(c<titles.length-1){c++}else{c=0}b++}dw+=</ul>};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById(related-posts).innerHTML=dw};
//]]></script>
<b:loop values=data:post.labels var=label>
<script expr_src="/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels" type=text/javascript/>
</b:loop>
<script type=text/javascript>varmaxresults=5;removeRelatedDuplicates();printRelatedLabels('<data:post.url/>');</script>
</b:if>
</div>
<div class=clear/>
Keterangan:
Yang berwarna merah adalah jumlah Related Post atau Jumlah Thumbnail Image yang ingin ditampilkan.
4. Baca basmalah biar berhasil dan berkah... dan Save Template!
Mestinya, jika keempat langkah di atas dilakukan dengan baik dan benar, maka Related Post berupa Thumbnail Image (gambar) akan muncul di postingan blog. Good Luck!
Sumber
Sumber
Go to link Download
Sunday, November 13, 2016
Cara Membuat Artikel Terkait Related Post di Blog dengan Thumbnail
Cara Membuat Artikel Terkait Related Post di Blog dengan Thumbnail
Hai sobat blogger semua !!! Kali ini fahrurrozi18 akan berbagi cara untuk membuat daftar Artikel Terkait / Related Post. Humh... Udah pada tau nggk, yang mana itu Related Post. Yang belum tau, silahkan lihat screenshot di bawah ini :

Nah... Gimana sob, udah tau kan ?!?!
Ya sudah deh, gak pakek lama, langsung aja sob terjun ke langkah-langkahnya !!!
Cara Membuat Artikel Terkait / Related Post :
1. Login BLOGGER sobat.
2. Klik Template => Edit HTML.
3. Cari kode di bawah ini :
</head>4. Kalau sudah menemukan kode di atas, Copy script di bawah ini lalu paste di atas kode </head>
<b:if cond=data:blog.pageType == "item">5. Selanjutnya cari kode di bawah ini, Gunakan Ctrl+F untuk mempermudah pencarian :
<style>
#related_posts{}
#related_posts h4{ border-top:1px solid #333; border-bottom:1px solid #333; color:#333; font-size:14px; letter-spacing:0; line-height:20px; margin:0 0 5px; padding:5px 10px; background:#03C}
#relpost_img_sum{/* height:320px; overflow:auto; */margin:0; padding:0px; line-height:16px}
#relpost_img_sum:hover{background:none}
#relpost_img_sum ul{list-style-type:none; margin:0; padding:0}
#relpost_img_sum li{border:1px solid #ccc; background:#fff; margin:0 0 5px; padding:5px; height:65px; list-style:none}
#relpost_img_sum .news-title{display:block; font-weight:bold !important}
#relpost_img_sum .news-text{display:block; text-align:justify; font-weight:normal; text-transform:none; color:#333}
#relpost_img_sum img{float:left; margin-right:5px; padding:4px; border:solid 1px #ccc; width:50px; height:50px; background:#fff}
</style>
<script type=text/javascript>//<![CDATA[
var relnum = 0;
var relmaxposts = 5;
var numchars = 150;
var morelink = "selengkapnya";
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?:e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){returnw+};c=1};while(c--)if(k[c])p=p.replace(new RegExp(b+e(c)+b,g),k[c]);return p}(2 4=f g();2 5=f g();2 9=f g();2 b=f g();s K(L,M){2 7=L.19("<");l(2 i=0;i<7.3;i++){8(7[i].N(">")!=-1){7[i]=7[i].O(7[i].N(">")+1,7[i].3)}}7=7.1a("");7=7.O(0,M-1);y 7}s 1b(z){l(2 i=0;i<z.P.6.3;i++){2 6=z.P.6[i];4[n]=6.A.$t;u="";8("Q"B 6){u=6.Q.$t}C 8("R"B 6){u=6.R.$t}9[n]=K(u,1c);8("S$T"B 6){D=6.S$T.1d}C{D="1e://1f.1g.1h/1i/1j/1k/1l/d/1m.1n"}b[n]=D;l(2 k=0;k<6.E.3;k++){8(6.E[k].U==1o){5[n]=6.E[k].v;F}}n++}}s V(a,e){l(2 j=0;j<a.3;j++)8(a[j]==e)y 1p;y 1q}s 1r(){2 m=f g(0);2 o=f g(0);2 p=f g(0);2 q=f g(0);l(2 i=0;i<5.3;i++){8(!V(m,5[i])){m.3+=1;m[m.3-1]=5[i];o.3+=1;o[o.3-1]=4[i];p.3+=1;p[p.3-1]=9[i];q.3+=1;q[q.3-1]=b[i]}}4=o;5=m;9=p;b=q;l(2 i=0;i<4.3;i++){2 c=w.W((4.3-1)*w.X());2 Y=4[i];2 Z=5[i];2 10=9[i];2 11=b[i];4[i]=4[c];5[i]=5[c];9[i]=9[c];b[i]=b[c];4[c]=Y;5[c]=Z;9[c]=10;b[c]=11}2 x=0;2 r=w.W((4.3-1)*w.X());2 12=r;2 h;2 13=14.1s;1t(x<15){8(5[r]!=13){h="<16 G=H-A 1u>";h+="<a v="+5[r]+" U=1v I=J A="+4[r]+"><1w 1x="+b[r]+" /></a>";h+="<a v="+5[r]+" I=J>"+4[r]+"</a>";h+="<17 G=H-18>"+9[r]+" ... <a v="+5[r]+" I=J>"+1y+"</a><17 G=H-18>";h+="</16>";14.1z(h);x++;8(x==15){F}}8(r<4.3-1){r++}C{r=0}8(r==12){F}}},62,98,||var|length|reljudul|relurls|entry|cuplik|if|relcuplikan||relgambar|informasi|||new|Array|relhasil||||for|tmp|relnum|tmp2|tmp3|tmp4||function||postcontent|href|Math|rangkumanPosts|return|json|title|in|else|postimg|link|break|class|news|target|_top|saringtags|suchas|panjang|indexOf|substring|feed|content|summary|media|thumbnail|rel|contains|floor|random|tempJudul|tempUrls|tempCuplikan|tempGambar|rini|dirURL|document|relmaxposts|li|span|text|split|join|relpostimgthum|numchars|url|http|lh3|ggpht|com|_xcD4JK_dIjU|SnamIh0KTCI|AAAAAAAADMA|hLjqmEbdtkw|noimagethumb|gif|alternate|true|false|relatpost|URL|while|clearfix|nofollow|img|src|morelink|write.split(|),0,{}))
//]]></script>
</b:if>
<data:post.body/>6. Lalu, copy script di bawah ini tepat di bawah kode tadi. Dalam pencarian, sobat akan menemukan beberapa script yang sama... Gunakan script yang Kedua atau Ketiga :
<b:if cond=data:blog.pageType == "item">7. Klik Simpan.
<div id=related_posts style=margin-top:35px;>
<h4 style=color:#ffffff; text-shadow:none; border-radius:5px; border:2px solid #ddd; background:#6fa8dc;>Artikel Terkait</h4>
<b:loop values=data:post.labels var=label>
<script expr_src="/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=relpostimgthum&max-results=50" type=text/javascript/>
</b:loop>
<ul id=relpost_img_sum>
<script type=text/javascript>relatpost();</script>
</ul>
</div>
</b:if>
Nah... Sudah selesai deh membuatnya, sekarang coba lihat blog sobat... :)
Sekian dulu ya tips dariku, Bye... bye... :)
Keterangan :
- var relmaxposts = 5, jumlah artikel terkait yang ditambilkan
- var numchars = 150, jumlah dari ringkasan artikel
- Untuk mengubah style dari widget seperti ukuran huruf, warna, dll. Edit pada script yang ada didalam tag <style> ... </style>
Go to link Download
Saturday, October 29, 2016
Cara Membuat Related post dengan LinkWithin Bawah Posting Tidak Muncul di Homepage
Cara Membuat Related post dengan LinkWithin Bawah Posting Tidak Muncul di Homepage
Selamat malam sobat blogger !!! Kali ini aq akan memposting tentang Cara Membuat Related post. Setelah dulu aq sudah pernah posting tentang Cara Membuat Artikel terkait/Related Post di blog, sekarang juga gak jauh berbeda tuh. Cuman ini dengan LinkWithin Bawah Posting (Tidak Muncul di Homepage).
Yang berminat, silahkan disimak ya !
Cara Membuat Related post dengan LinkWithin Bawah Posting :
1. Silahkan kunjungi www.linkwithin.com
2. Kalau sudah, isi data seperti gambar dibawah ini
3. Lalu klik tombol "Get Widget"

4. Klik "Install Widget"
5. Pada kolom Pilih sebuah blog, silahkan isi dengan nama blog anda
6. Klik Edit Template

7. Ganti kode pada Edit Template dengan kode dibawah ini :
<b:includable id="main"><b:if cond=data:blog.pageType == "item"><data:content/></b:if></b:includable>
8. Lalu klik "Add Widget/Memasang Widget"
9. Maka secara otomatis widget link within akan terpasang di gadget, lalu simpan dan lihat hasilnya.
Selamat mencoba sobat... :)
Go to link Download
Friday, October 28, 2016
Cara Membuat Related Post di Bawah Posting
Cara Membuat Related Post di Bawah Posting
Pertama-tama seperti biasanya login ke blogger lalu Edit Html
Yang kedua cari kode dibawah ini
<p><data:post.body/></p>
Trus taruh kode dibawah ini dibawah kode <p><data:post.body/></p>
<b:if cond=data:blog.pageType == "item">
<H2>Artikel Terkait:</H2>
<DIV class=rbbox>
<DIV style=margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;>
<DIV id=albri/>
<SCRIPT type=text/javascript>
var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
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 < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('albri').appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
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 = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</SCRIPT>
</DIV>
<script type="text/javascript">RelPost();</script>
</DIV>
</b:if>
Jika sudah cari kode dibawah ini
]]></b:skin>
Setelah ketemu, letakkan kode di bawah ini diatas kode ]]></b:skin>
.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #000;-moz-border-radius:5px; margin:5px;}
Lalu letakkan kode dibawah ini dibawah ]]></b:skin>
<SCRIPT src=http://strip-ads.googlecode.com/files/relatedpost-versi2.js type=text/javascript/>
Selesai
Semoga berhasil dan bermanfaat...:D
Go to link Download
Subscribe to:
Posts (Atom)