Loading...

Cara Membuat Related Post di Bawah Posting

ajatshare 01:17 | | | 4 Comments

Cara Membuat Related Post di Bawah Posting


AjatShare kali ini mencoba posting mengenai Cara Membuat Related Post di Bawah Posting dengan background warna berubah jika mouse didekatkan. Langsung saja tanpa basa-basi inilah caranya:

Cara Membuat Related Post di Bawah Postingan

1. Bukalah blog anda jika sudah
2. Pilihlah Elemen Template. Lalu Pilit Edit HTML, jangan lupa centang Expand Template Widget
3. Carilah kode ]]</b:skin> (Gunakan Ctrl+F untuk mempermudah pencarian),
    setelah anda menemukannya.


.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;}

4. Selanjutnya cari lagi kode berikut : <data:post.body/>,
    Kode <data:post.body/> mungkin lebih dari 1 (satu) atau banyak, pilih salah satu saja.
    jika sudah ketemu, letakkan lagi kode di bawah ini tepat di bawah
    kode <data:post.body/>


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 15;
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>
<br/><span style='float:right;font:italic 10px Arial, 
Sans-Serif;'><a 
href='http://ajatshare.blogspot.com/2013/07/cara-membuat-related-post-di-bawah.html'
 target='_blank'><b>Get This 
Widget</b></a></span>
</b:if>

5. Setelah selesai, lalu simpan template blog anda.

Demikian posting hari ini semoga bisa memberikan manfaat.

Masukan email Anda untuk Dapatkan Update terbaru dari AjatShare BloggerPrint PDF
Cara Membuat Related Post di Bawah Posting
Cara Membuat Related Post di Bawah Posting - written by ajatshare, published at 01:17, categorized as Blogging, CSS, HTML, Widget . And have 4 comments
Facebook Twitter Google+ Linkedin Technorati Digg DMCA.com

4 comments

Tambah komentar

Keren gan terimaksih banyak sudah berbagi

Terima kasih kembali bila artikel dari kami bisa bermanfaat. Jangan lupa mampir lagi...!

agak njelimet juga ya, mampir ke sini dong www.creamputih.blogspot.com terima kasih atas kunjungan baliknya

ikuti saja intruksinya dan coba letakan kode html-nya di yang terakhir biasanya berhasil. Langsung ke meluncur.

  • Berkomentarlah dengan baik, sopan dan sesuai dengan isi konten serta tidak [SPAM].
  • Untuk menyisipkan kode dalam komentar harap di [Konversi] terlebih dahulu.
  • Jika ingin bertanya di luar judul artikel "Cara Membuat Related Post di Bawah Posting". Harap menggunakan tombol [OOT].

Forum DiskusiOut Off Topic (OOT)Formulir KontakArsip Blog
-->