<div class='comments' id='comments'>
<div
class='comments-tab' id='fb-comments'
onclick='javascript:commentToggle("#fb-comments");'
title='Comments made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='550'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
.comments-page { background-color: #f2f2f2;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}
}
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='cahdonorejo' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
</head>
Jika sobat sudah menemukannya,tepat diATASnya letakkan script berikut:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var panelSelector = '#comments',
openPanelText = "Tampilkan Komentar",
closePanelText = "Tutup Komentar",
slideDownPanelSpeed = 600,
slideUpPanelSpeed = 400;
//]]>
</script>
<script type='text/javascript'>
</script>
<script src='http://mrpujiajadeh.comze.com/slide-blogger-comment-box.js' type='text/javascript'/>
]]></b:skin>
Jika sudah sobat ketemukan,tepat diATASnya letakkan barisan kode ini:
a.openpanel
{display:block;width:100%;height:40px;padding:0px
0px;text-align:center;font-weight:bold;line-height:30px;background:#ffffff;
url()repeat-x;-webkit-transition: all .15s
ease-in-out;-webkit-transform-origin: 50% 1px;position:relative;
}a.openpanel
em {width:0px;height:0px;display:block;position:absolute;top:15px;
right:15px;border:6px solid transparent;border-top-color:white;
}a.openpanel.active {background-color:#ffffff;}a.openpanel.active em {top:6px;border color:#222222;
}div.paneline
{height:0px;-webkit-transition: all .15s
ease-in-out;-webkit-transform-origin: 50% 1px;}div.hompiPanel
{padding:10px 20px 20px;margin:0px 0px !important;}
Setelah itu simpan template sobat.
<div><input
type="button" value="Lihat Gambar" style="margin:0px;padding:0px;"
onClick="if
(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
!= '') {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
= '';this.innerText = ''; this.value = 'Sembunyikan'; } else {
this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display
= 'none'; this.innerText = ''; this.value = 'Lihat Gambar'; }">
</div>
<div style="background: #ffffff; margin: 10px auto;
border: 0px solid #000;
padding: 5px;">
<div style="display: none;">
<img src="http://4.bp.blogspot.com/-CaS-av0Hsew/T-hcswdKNUI/AAAAAAAABzw/wsiEwZAVFPU/s500/pujiantoro.jpg" alt="Cara Mudah dan Cepat Membuat Spoiler di Blogger" title="Cara Membuat Spoiler di Blogger." width="300" height="200"/>
</div>
</div>
<!-- outside of the include in order to lock Attribution widget --><b:section class='foot' id='footer-3' showaddelement='no'>
<b:widget id='Attribution1' locked='true' title='' type='Attribution'>
<b:includable id='main'>
<b:if cond='data:feedbackSurveyLink'>
<div class='mobile-survey-link' style='text-align: center;'>
<data:feedbackSurveyLink/>
</div>
</b:if>
<div class='widget-content' style='text-align: center;'>
<b:if cond='data:attribution != ""'>
<data:attribution/>
</b:if>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
</b:section>
Untuk platform blogger,blockquote memiliki tampilan default yang dapat dikatakan 'biasa saja'.
]]></b:skin> (untuk mempermudah gunakan keyboard dan tekan Ctrl+F),setelah ketemu,tepat diatas kode tersebut letakkan kode berikut :.post-body blockquote {
margin: 10px 10px 10px 20px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;
color: #000000;
background:
url(http://2.bp.blogspot.com/_n7xseT2-HDU/TTfSVR6DdyI/AAAAAAAAArQ/ZtQUl-i6dhU/s1600/blockquote%2Bpelajaran%2Bblog.png)
no-repeat left top;
border-left: 10px solid #666666;
}.post-body blockquote {,maka tinggal ganti dengan kode diatas. <blockquote></blockquote> dalam kalimat atau paragraf,contohnya,Saya sedang belajar menghias blog blogger dan kali ini saya sedang belajar membuat blockquote dalam postingan di blogspot-ku tersayang ini :D
 Salam kenal ADHI PLAYBOY |