tag:blogger.com,1999:blog-26092749651353394702024-02-07T19:28:30.719-08:00Arul BorneoTutorial Blog,Komputer,Internet,Blogger,Driver,Applications,Tips dan Trik,SEO,Kabupaten Seruyan,Kecamatan Hanau,Kuala Pembuang,Pembuang Hulu,Samsung,Nokia,Blackberry,Fashion,Album,Travelling,Wisata,DPRD,Twitter,Facebook,FoursquareAnonymoushttp://www.blogger.com/profile/12540636932888560628noreply@blogger.comBlogger2125tag:blogger.com,1999:blog-2609274965135339470.post-61085178854549920942012-05-29T15:29:00.000-07:002012-05-29T16:04:36.765-07:00Cara Membuat Related Posts di Bawah Posting.<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKWhbcASpa76Fnn5j-hQH-CJ8q32N8z1zBb_DUKOa8FjfQSdHvf_KM3cMkfueSAkPm9ophEHgst673hYI70EEJ0MilW7mvaj_pueaC_8zNrx7Bx7eVekrxnwTXVa4yXuFr66cLO4uGx5jE/s1600/Related+Posts.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="136" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKWhbcASpa76Fnn5j-hQH-CJ8q32N8z1zBb_DUKOa8FjfQSdHvf_KM3cMkfueSAkPm9ophEHgst673hYI70EEJ0MilW7mvaj_pueaC_8zNrx7Bx7eVekrxnwTXVa4yXuFr66cLO4uGx5jE/s200/Related+Posts.jpg" width="200" /></a></div>
Pagi ini saya ingin share turotial tentang <a href="http://arulborneosite.blogspot.com/2012/05/cara-membuat-related-posts-di-bawah.html">Cara Membuat Related Posts di Bawah Posting</a>.<br />
Related posts sangat penting keberadaannya pada suatu blog,<br />
karena selain bisa menunjang SEO,<br />
<br />
Related Posts juga berfungsi untuk memudahkan pengunjung untuk mengakses artikel kita yang berkaitan dengan artikel yang sedang di baca oleh pengunjung.<br />
<br />
Jadi si pengunjung lebih bisa berlama-lama menelusuri blog kita sobat,<br />
tentunya dengan <a href="http://arulborneosite.blogspot.com/2012/05/cara-membuat-related-posts-di-bawah.html">Related Posts di Bawah Posting</a> ini akan menunjang profesionalitas blog kita.<br />
<br />
Nah karena begitu vital fungsinya , saya akan share tutorial ini.<br />
Fungsi dari related posts adalah menampilkan artikel yang berkaitan yang ada dalam blog kita.<br />
<br />
Masih belum paham..? Begini lo misalnya sobat memposting artikel dengan label <a href="http://arulborneosite.blogspot.com/2012/05/cara-membuat-related-posts-di-bawah.html">Tutorial Blog, Blogger Tutorial, SEO Blogger,</a> atau apa aja deh maka jika pengunjung mengklik artikel kita yang misalnya<br />
berlabel tutorial blog maka akan muncul menu dibawah postingan kita<br />
yang menyajikan artikel-artikel yang berlabel tutorial blogger.<br />
<br />
<ul>
<li>Log in ke blogger dengan akun yang anda miliki. </li>
<li>Klik rancangan. </li>
<li>Edit Html ยป Centag kotak Expand template widget. </li>
<li>Cari kode <span style="color: red;"></head></span> letakkan kode dibawah ini sebelum kode <span style="color: red;"></head></span> yang anda temukan. </li>
</ul>
<br />
<blockquote class="tr_bq">
<span style="font-size: small;"><style> #related-posts { float : left; width : 540px; margin-top:20px; </span></blockquote>
<blockquote>
<span style="font-size: small;">margin-left : 5px; margin-bottom:20px; font : 11px</span><br />
<span style="font-size: small;">Verdana; margin-bottom:10px; }</span><br />
<span style="font-size: small;"> #related-posts .widget { list-style-type : none;</span><br />
<span style="font-size: small;">margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2,</span><br />
<span style="font-size: small;">#related-posts h2 { font-size : 20px; font-weight : normal;</span><br />
<span style="font-size: small;">margin : 5px 7px 0; padding : 0 0 5px; }</span><br />
<span style="font-size: small;">#related-posts a { text-decoration : none; }</span><br />
<span style="font-size: small;">#related-posts a:hover { text-decoration : none; }</span><br />
<span style="font-size: small;">#related-posts ul { border : medium none; margin : 10px; padding : 0; }</span><br />
<span style="font-size: small;">#related-posts ul li { display : block;</span><br />
<span style="font-size: small;">background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwqn-OfsACzKjLJc3z3FGK-9OMNWYhVYOJnrwixIHs3loXZaWGll8_D7xeoLRnwl3f36XsidMckWQf94xtCsakQF15TcZ-wZYZzzZsOAUAOadwI-nu9CJlJ6KyPQ-WQmo66BaQu84qppc/s1600/1305169909_7.png") no-repeat 0 0; margin :</span><br />
<span style="font-size: small;">0; padding-top : 0; padding-right : 0; padding-bottom : 1px;</span><br />
<span style="font-size: small;">padding-left : 21px; margin-bottom : 5px; line-height : 2em;</span><br />
<span style="font-size: small;">border-bottom:1px dotted #cccccc; }</span><br />
<span style="font-size: small;"></style> <script src=' http://arul-borneo.googlecode.com/files/RelatedPosts.js' type='text/javascript'/> </span></blockquote>
<br />
<br />
<ul>
<li>Sekarang cari kode <span style="color: red;"><data:post.body/></span> jika ada dua pilih yang kedua dan letakkan kode di bawah ini dibawah kode <span style="color: red;"><data:post.body/></span>. </li>
</ul>
<br />
<blockquote class="tr_bq">
<b:if cond='data:blog.pageType == "item"'> </blockquote>
<blockquote>
<div id="related-posts">
<font face='Arial' size='3'><br />
<b>Related Posts : </b></font><font color='#FFFFFF'><br />
<b:loop values='data:post.labels' var='label'><data:label.name/><br />
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><br />
<b:if cond='data:blog.pageType == &quot;item&quot;'><br />
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/><br />
</b:if></b:loop> </font>
<script type='text/javascript'><br />
removeRelatedDuplicates(); printRelatedLabels();
</script><br />
</div></b:if></blockquote>
<br />
<ul>
<li>Save template sobat dan lihat hasilnya. </li>
</ul>
Sekian tutorial tentang <a href="http://arulborneosite.blogspot.com/2012/05/cara-membuat-related-posts-di-bawah.html"><span style="color: red;">Cara Membuat Related Posts Di Bawah Posting</span></a><br />
semoga bisa bermanfaat bagi kita semua.<br />
Jangan lupa untuk meninggalkan komentarya yah...Anonymoushttp://www.blogger.com/profile/12540636932888560628noreply@blogger.com0tag:blogger.com,1999:blog-2609274965135339470.post-84618841659579530932012-05-29T00:24:00.007-07:002012-05-29T04:41:24.142-07:00Cara Membuat Author Box di Blogger<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih1X4_y0IplhzIm8vIAZRRX3pzmJBAnqr01rkIpsTr70en0A5G2OUPsspsgxH0HgemXZbVbpSSLXfiPPFblrdTvP9azhJpsO3OEXm56MLPBwlEVa4DumMhWkUvWmH116MHOuYN9lP7E69Z/s1600/Love+Blogger.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="187" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih1X4_y0IplhzIm8vIAZRRX3pzmJBAnqr01rkIpsTr70en0A5G2OUPsspsgxH0HgemXZbVbpSSLXfiPPFblrdTvP9azhJpsO3OEXm56MLPBwlEVa4DumMhWkUvWmH116MHOuYN9lP7E69Z/s200/Love+Blogger.jpg" width="200" /></a></div><b>Cara Membuat Author Box di Blogger | Keterangan di Bawah Postingan Blog.</b><br />
Author Box Ini adalah Posting Perdana <a href="http://arulborneosite.blogspot.com/2012/05/cara-membuat-author-box-di-blogger.html">Arul Borneo</a>, Tutorial sederhana yang mengupas tentang cara membuat kotak berisi tulisan atau keterangan di bawah postingan blog. sekalipun sederhana mudah-mudahan tetap menarik untuk disimak dan dicoba..<br />
<br />
Bagaimana cara membuatnya? Ikuti petunjuknya dibawah ini....<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvrEGSBT4qTukb8Q_-9fniOyLUSWbA-SovjDbLWm7_x99xM3Z2fXJTKzp5sx8EX2fsteoPMivavvHPZcX3K6vhMEqPAlXqYN7e-96dHxJpCYfqXEjfDnrLxGG-w7M5VB6HAE5AtE961kQP/s1600/Author.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="108" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvrEGSBT4qTukb8Q_-9fniOyLUSWbA-SovjDbLWm7_x99xM3Z2fXJTKzp5sx8EX2fsteoPMivavvHPZcX3K6vhMEqPAlXqYN7e-96dHxJpCYfqXEjfDnrLxGG-w7M5VB6HAE5AtE961kQP/s320/Author.JPG" width="320" /></a></div><br />
<ul><li>Login Ke akun blogger anda </li>
<li>Lalu pilih Rancangan ==> Edit HTML, jangan lupa centang Expand Template Widget ya..? </li>
<li>Langkah selanjut nya , anda cari kode : <span style="color: red;"><div class='post-footer-line post-footer-line-1'></span> menggunakan CTRL + F biar lebih mudah. </li>
<li>Lalu Copy & Paste Kode di bawah ini, letakkan tepat di bawah kode : <span style="color: red;"><div class='post-footer-line post-footer-line-1'> </span></li>
</ul><blockquote class="tr_bq"><!-- Kotak Admin --><br />
<b:if cond='data:blog.pageType == &quot;item&quot;'><br />
<div class='admin-tulisan'> <h4>Ditulis Oleh :<br />
<a expr:href='data:blog.homepageUrl'><data:post.author/><br />
</a> -<span style="color: #073763;"> </span><span style="color: blue;">Inspiring People</span></h4> <div class='kontainer'><br />
<img src=' <span style="color: red;">http://i646.photobucket.com/albums/uu183/seruyan/Arul.jpg</span>' style='border: 2px solid #0000b9;'/> Artikel <a expr:href='data:post.url'><br />
<data:post.title/></a> ini diposting oleh <data:post.author/> pada hari<br />
<data:post.dateHeader/>. Jika artikel <a expr:href='data:post.url'><br />
<data:post.title/></a> ini dirasa menarik, anda bisa sebarluaskan lewat blog anda, tapi mohon mencantumkan sumbernya. Terimakasih. Happy blogging. <p><br />
<span style='float:right;font:italic 10px Arial, Sans-Serif;'><br />
<a href='http://bangarulblog.blogspot.com/2012/05/cara-membuat-author-box-di-blogger.html' target='_blank'>::Get This Widget:: </a></span></p><br />
<div style='clear:both;'/> </div> </div> </b:if><br />
<!-- Kotak Admin --></blockquote><br />
<ul><li>Langkah Selanjutnya adalah cari kode : <span style="color: red;">]]></b:skin></span> pada template anda. </li>
<li>Lalu anda Copy & Paste Kode di bawah ini, tepat di atas kode : <span style="color: red;">]]></b:skin></span></li>
</ul><blockquote class="tr_bq">.admin-tulisan{<br />
display:block; width:auto; background: #585656;<br />
border:2px solid #fff; box-shadow:0 1px 3px #000;<br />
-moz-box-shadow:0 1px 3px #000;<br />
-webkit-box-shadow:0 1px 3px #000; padding:0;<br />
margin:30px 0 10px 0; font:normal 12px<br />
Arial, Sans-Serif; color:#222; }<br />
.admin-tulisan .kontainer{padding:5px;}<br />
.admin-tulisan h4{ background:#8A9C04; border:none;<br />
border-bottom:1px solid #699019;<br />
color:#fff; text-transform:normal;<br />
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);<br />
font:bold 12px Arial,Sans-Serif; padding:5px 10px;<br />
margin:0 0 0 0; display:block; } .admin-tulisan h4 a{color:#FEEA83;}<br />
.admin-tulisan img{ width:70px; height:70px;<br />
margin:0 10px 0 0; float:left; border:1px solid #954B02;<br />
padding:2px; background:#C36702; box-shadow:none;<br />
-moz-box-shadow:none;-webkit-box-shadow:none;<br />
}</blockquote><br />
<ul><li>Langkah selanjutnya anda, Pilih Pratinjau, jika tidak ada masalah baru pilih simpan. </li>
<li>Selamat Mencoba, dan Semoga berhasil... </li>
</ul><br />
<i><b>Catatan :</b></i><br />
Kode yang <span style="color: blue;">Berwarna Biru</span>,<br />
itu Adalah Deskripsi Blog Anda Sedangkan Kode yang <span style="color: red;">Berwarna Merah</span><br />
adalah Photo Author ( Bisa Photo Anda sendiri )Anonymoushttp://www.blogger.com/profile/12540636932888560628noreply@blogger.com2