Rabu, 18 April 2012

Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot

Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot - Assalamualaikum gan, kesempatan kali ini saya mau coba berbagi sedikit tips blogspot di tampilan via mobile atau via seluler, jarang sekali para blogger yang membahas artikel tentang Cara modipikasi atau mempercantik blog via mobile atau via seluler, dan pada postingan kali ini tentang Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot. tapi saya belum menerapkan trik ini sobat blogger, hehehe .. tapi jangan ragu dengan trik ini, karna berjalan sukses di blog yang udah temukan trik ini (http://eltelu.blogspot.com)

Cara Membuat artikeL Terkait via Mobile (seluler

Bagai mana Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot

Sebelum sobat blogger ingin mencoba trik ini, bisa liat DEMO Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot nya disni
Pertama, Login ke akun blogger dan selanjutnya pada menu ‘Template’ ubahsesuaikan konfigurasi pada template seluler yang digunakan. Dalam hal ini aktifkan pilihan yang digunakan untuk menampilkan versi seluler pada blog yang dimaksud, kemudian pilih template seluler ‘Tersesuai’ dan selanjutnya klik tombol ‘Simpan’, seperti yang tampak pada gambar di bawah ini.

Pilihan Template Seluler
Screenshot: blogger.com

Kedua, klik tombol ‘Edit HTML’ untuk menambahkan script pada template yang digunakan, dan kemudian klik tombol ‘Lanjutkan’.

Ketiga, klik pilihan ‘Expand Template Widget’ sehingga muncul tanda check list pada kotak yang terdapat di samping pilihan tersebut. Dan selanjutnya letakkan kode berikut ini persis di atas kode </head>.

kode:
kode:
<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, lakukan pencarian untuk kode <div class='post-footer-line post-footer-line-2'>, yang terletak di antara kode <b:includable id='mobile-post' var='post'> dan </b:includable>.

Kelima, tepat di bawah kode <div class='post-footer-line post-footer-line-2'> masukkan kode di bawah ini.

kode:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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 != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'><script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script>
</div>
</div>
</b:if>



Catatan: Bila letak daftar artikel terkait yang dihasilkan kurang sesuai, maka dapat dilakukan kustomisasi pada penempatan kode di atas, dengan ketentuan bahwa kode tetap diletakkan di antara <b:includable id='mobile-post' var='post'> dan </b:includable>.

Keenam, simpan template dan lakukan pengecekan dengan menambahkan ?m=1 pada URL blog sehingga menjadi http://namablog.blogspot.com?m=1, untuk membuka blog dengan tampilan versi seluler.

Semoga artikel Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot bisa membantu sobat blogger semua, anda juga bisa baca Cara membuat ArtikeL Terkait (Related Post) Di blogspot - Thank untuk http://eltelu.blogspot.com yang sudah menemukan trik ini Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot.


Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot
Oleh japarus blog pada .
Rating: 4.5

0 komentar:

Poskan Komentar