cara buat background pada related post

Capeknya setelah beberapa hari jarang ngeblog karena lagi ada tugas akhir sekolah dan penjajakan unas,jadi yach coba intip blog persahabatan yang beberapa hari terlantar,maaf ya sob karena belum bisa berkunjung..^_^setelah intip-intip artikel tentang makhluk asing,ada salah satu komentar dari sahabat Rizky yang bertanya tentang cara kasih background pada artikel terkait

Berhubung saya ini masih newbie gak tahu apa-apa dan belum banyak makan garam didunia maya ini,saya coba untuk menjawab mohon maaf jika jawaban yang akan saya utarakan kurang memuaskan…
Berikut cara memberi background pada judul artikel terkait:

1.login ke blogger.com dengan user id sahabat tentunya
2.klik tata letak
3.edit HTML,silahkan sahabat backup dulu template yang akan dirubah.Untuk berjaga-jaga bila terjadi kesalahan
4. Centang kotak kecil Expand Template Widget
5. Cari kode <p><data:post.body/></p>

lalu letakkan kode berikut dibawah kode tadi

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='padding: 5px; background-image: url(http://i29.tinypic.com/1zg5jyr.jpg); background-repeat: repeat; background-position: center;'><span style=';font-size:130%;color:white;'>
related post</span>
</div>
<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 = 50;
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>

sedikit tambahan:silahkan ganti tulisan yang berwarna merah sesuai kehendak sahabat

• related post:silahkan diganti misal:artikel berhubungan atau apa saja
• white:warna huruf yang menjadi tittle related post
• font-size:130%:ukuran huruf pada tittle related post
• URL:ganti dengan url yang akan dijadikan background related post

berikut contoh gambar tittle related post yang udah menggunakan background pada tittlenya

tapi jika ingin memberi background pada related postnya,berikut langkah-langkahnya:

1.login ke blogger.com
2.klik tata letak
3.pilih tab HTML javascript
4.silahkan sahabat cari kode ]]></b:skin>
5.copas kode dibawah ini dan taruh diatas kode ]]></b:skin>

/* Related post
----------------------------------------------- */
.rbbox{border:1px solid silver;background:#e0ffff url(http://i492.photobucket.com/albums/rr288/angger07/EmoExcited.gif) no-repeat right bottom;-moz-border-radius:5px;margin:5px;padding:5px}
.rbbox:hover{background-color:#fff}

berikut contoh gambar background pada related post




URL gambar bisa sahabat rubah sesuai selera,nah semoga bermanfaat,buat sahabat juga bisa costumize sendiri kode yang sudah ada.buat master-master dalam dunia blog mohon kritik dan sarannya.