expr:class='"loading" + data:blog.mobileClass'>

Halaman

Selasa, 25 Desember 2012

Cara Membuat Artikel Terkait

Cara membuat ArtikeL Terkait (Related Post) Di blogspot - aga kareba sobat ? heheeh apa kabar, malam ini japarus dot com berbagi tips sedikit yaitu Cara membuat ArtikeL Terkait (Related Post) Di blogspot, pada postingan Sebelum nya saya juga sudah pernah post tentang cara menambahkan artikel terkait otomatis dibawah postingan dan Cara Membuat artikeL Terkait via Mobile (seluler) Untuk Blogspot namun kali ini tidak menggunakan gambar untuk versi komputer.

Cara membuat ArtikeL Terkait (Related Post) Di blogspot

Berikut cara membuat Artikel Terkait dengan border melengkung dengan Fungsi Scroll



  • Seperti biasa, masuk dulu ke Akun blog anda.
  • Pada halaman Dasbor, cari kata "RANCANGAN" lalu klik
  • Pada halaman Rancangan, klik tombol "EDIT HTML"sebaik nya aman kan dulu template sobat
  • Beri tanda checklist pada kotak kecil yg ada di depan tulisan Expand Template Wdget yang terletak diatas kotak kode HTML template blog anda
  • Cari kode ]]></b:skin> (Gunakan tombol F3 pada keyboard untuk melakukan pencarian cepat).
  • Copy kode dibawah ini, lalu paste DI ATAS kode ]]><b/:skin> berikut kodenya :
kode:


  • Selanjutnya, cari kode <data:post.body/> gunakan control F
  • copy code ini di bawah <data:post.body/>
kode:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<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 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;
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>


Selanjut nya SIMPAN TEMPALATE
Jika ingin mengganti warna background kotaknya, ganti kode warna ( #f10c0c; ) Dengan warna yang di ingin kan silakan ke SINI untuk melihat kode warna nya, UNTUK melihat DEMO nya ada di bawah POSTINGAN ini, Sekian Kali ini Tentang Cara membuat ArtikeL Terkait (Related Post) Di blogspot

Cara Membuat Corsur Bertaburan Bintang

Crusor Bertabur Bintang
Banyak cara yang dibuat oleh setiap blogger untuk membuat tampilan blognya terkesan cantik, unik dan macam-macam deh. Diantaranya dengan modifikasi template yang sudah ada, memasang ragam widget dan ragam aksesoris blog termasuk mengganti tampilan cursor. pernah lihat suatu blog dengan cursor bertabur bintang? Pingin mencobanya? Mudah kok, ikuti langkah-langkah berikut:
Membuat cursor bertabur bintang

1. Login ke blogger.
2.Masuk ke Layout-->Page Element
3.Tambahkan gadget HTML/JavaScript
4.Pilih kode taburan bintang dibawah ini.

Bintang Hijau
<script src="http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.hijau.js" type="text/javascript"></script>
Bintang Ungu

<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.ungu.js' type="text/javascript"></script>
Bintang Merah
<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.merah.js' type="text/javascript"></script>
Bintang Biru
<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.biru.js' type="text/javascript"></script>
Bintang Putih
<script src='http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.putih.js' type="text/javascript"></script>
 
5.Kopi salah satu kode diatas dan simpan.

6. Jangan lupa save dan save lagi.

Senin, 24 Desember 2012

Cara Pasang Kotak Iklan Banner Pada Blog

Pertama log in ke akun blogger anda.

Lalu klik Rancangan / Design kemudian klik Edit HTML

Berikutnya cari ]]></b:skin>, setelah ketemu Copy kode dibawah diatas kode ]]></b:skin>



/* Kotak Banner
===================== */
#Box-Banner-ads {
margin: 0px;
padding: 5px;
text-align: center; }


#Box-Banner-ads img {
margin: 0px 8px 4px 0px;
padding: 3px;
text-align: center;
border: 3px outset #c0c0c0; }


#Box-Banner-ads img:hover {
margin: 0px 8px 4px 0px;
padding: 3px;
text-align: center;
border: 3px inset #333; }


Kemudian Save Template

Setelah itu klik Elemen Laman / Page Elemen

Lalu add a gadget Pilih HTML/JavaScript

Copy semua kode di bawah ini dan letakkan di HTML/JavaScript



<a href="http://www.epuljapanese.co.cc/2010/08/pasang-iklan-disini.html" target="new"><img border="0" alt="ads" src="https://sites.google.com/site/epuljapanese/epul-1/PostAds.jpg" /></a>


<a href="http://www.epuljapanese.co.cc/2010/08/pasang-iklan-disini.html" target="new"><img border="0" alt="ads" src="https://sites.google.com/site/epuljapanese/epul-1/PostAds.jpg" /></a>


<a href="http://www.epuljapanese.co.cc/2010/08/pasang-iklan-disini.html" target="new"><img border="0" alt="ads" src="https://sites.google.com/site/epuljapanese/epul-1/PostAds.jpg" /></a>


<a href="http://www.epuljapanese.co.cc/2010/08/pasang-iklan-disini.html" target="new"><img border="0" alt="ads" src="https://sites.google.com/site/epuljapanese/epul-1/PostAds.jpg" /></a>


Catatan: Ganti yang berwarna merah dengan alamat blog atau Link anda yang ingin di tuju bila gambar tersebut nantinya akan di klik.

Maka Hasil Dari Coding di atas adalah seperti ini:

pasang iklan

Ganti yang berwarna biru dengan alamat dimana kamu menghosting/menyimpan banner tersebut. Atau gunakan alamat yang sudah tersedia juga tidak apa.

Minggu, 23 Desember 2012

Anyyeong !! Ni Blog Baru Ane Semoga Betah Ya :D