Senin, 02 Juli 2012

Cara membuat artikel terkait pada blogger untuk tampilan seluler

Wajib online – Setelah hampir 30 menit berkeliling didunia maya untuk mencari artikel untuk dijadika bahan pengisi blog. Akhirnya dengan dibantu oleh om google saya menemukan judul artikel yang sedikit berbeda dari judul artikel lain yaitu: cara membuat artikel terkait pada tampilan seluler. Dari sekian banyak artikel blog dari internet yang membahas tutorial baru kali ini saya menemukan judul artikel seperti itu.

Tanpa berpikir panjang saya pun langsung mempraktekan tutorial dari blog tersebut ke blog saya sebagai bahan percobaannya. Alhasil tampilan yang dijanjikan pada blog itupun terwujud, tanpa berpikir panjang saya langsung menulis ulang tutorial tersebut sebagai pengisi blogku ini.
Berikut inilah tutorial tersebut
Pertama: anda login ke blogger dengan akun anda, kemudian anda pilih pengaturan -> email / seluler, pada tab template anda pilih template tersesuai

Kedua: anda menuju ke rancangan -> edit HTML, kemudian centang pada kotak “Expand Template Widget”.(Sebelum anda melangkah ke langkah berikutnya, saya sarankan anda untuk membackup template blog anda)
Ketiga: setelah itu anda cari kode <head> “untuk mempermudah gunakan kombinasi tombol ctrl + F”. Kemudian anda taruh kode dibawah ini tepat diatas kode <head> tersebut
<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;}}}}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];}}
relatedTitles = tmp2;
relatedUrls = tmp;}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' +
relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;}
i++;}
document.write('</ul>');}
//]]>
</script>

Keempat: cari kode <div class='post-footer-line post-footer-line-2'> ( yang terletak diantara kode able id='mobile-post' var='post'> dan </b:includable> ). Kemudian anda taruh kode dibawah ini, tepat dibawah kode <div class='post-footer-line post-footer-line-2'> yang telah anda temukan.
<b:if cond='data:blog.pageType == "item"'>
<div id='mobile-related-posts'>
<div style='text-align: justify;'>
<h4><b>Artikel Terkait: </b></h4>
<b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=10"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script>
</div>
</div>
</b:if>

Kelima: simpan template dan untuk melihat hasilnya anda perlu menambahkan ?m=1 pada akhir url blog anda sehingga menjadi www.bloganda.blogspot.com?m=1. Atau anda bisa melihat di sini

sumber eltelu.blogspot.com

artikel diatas boleh di copas tapi baca dulu di sini

wajib online

Senin, 02 Juli 2012

Cara membuat artikel terkait pada blogger untuk tampilan seluler

artikel diatas boleh di copas tapi baca dulu di sini

Artikel Terkait:

5 komentar: