Cara Membuat Scroll Box pada Postingan Blog

Scrol Box pada postingan blog memiliki fungsi sebagai pembatas antara postingan pada paragraf tertentu dengan sebuah lampiran yang biasanya cukup panjang, sehingga lampiran tersebut dapat tersusun rapi dalam sebuah box bergulir.

• Sobat login akun Blogger tentunya
• Edit tulisan pada menu HTML bukan Compose
• Tentukan batas tulisan yang hendak diberi scroll box
• Paste code berikut tepat dibawah batas tulisan yang sudah sobat tentukan

<div style="overflow:auto;width:470px;height:60px;padding:10px;border:1px solid #FF0040">letakkan tulisan atau gambar sobat yang hendak diberi scroll box diSini

</div>

• Sobat bisa edit ukuran & warna tepi box yang sesuai : Untuk edit ukuran box =  width:470px & height:60px, Untuk edit warna tepi = solid #FF0040
• Save. 

www.riyanghifar.com Link Sumber Klik DISINI

Silahkan Copas Tutorial Ini Tapi Jangan Lupa Mencantumkan Link Awal :

<div class="post-title entry-title" itemprop="name" style="text-align: justify;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" height="283" width="400" /></a></div>
</div>
<div style="text-align: justify;">
Scrol Box pada postingan blog memiliki fungsi sebagai pembatas antara
 postingan pada paragraf tertentu dengan sebuah lampiran yang biasanya
cukup panjang, sehingga lampiran tersebut dapat tersusun rapi dalam
sebuah box bergulir. </div>
<ul>
<li>
Sobat login akun Blogger tentunya</li>
<li>Edit tulisan pada menu HTML bukan Compose</li>
<li>Tentukan batas tulisan yang hendak diberi scroll box</li>
<li>Paste code berikut tepat dibawah batas tulisan yang sudah sobat tentukan</li>
</ul>
<div style="border: 1px solid #F4FA58; height: 100px; overflow: auto; padding: 10px; width: 580px;">
<span style="font-size: 100%;"><b>&lt;div style="overflow:auto;width:470px;height:60px;padding:10px;border:1px solid </b></span><b>#FF0040</b><span style="font-size: 100%;"><b>"&gt;<span style="color: #0070c0;"><span style="color: #cc0000;">
letakkan tulisan atau gambar sobat yang hendak diberi scroll box diSini</span></span></b></span><span style="font-size: 100%;"><b> </b></span><br />
<div class="separator" style="clear: both; text-align: center;">
<span style="font-size: 100%;"><b><a href="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" height="226" width="320" /></a></b></span></div>
<span style="font-size: 100%;"><b>&lt;/div&gt;</b></span></div>
<br />
<ul>
<li>
Sobat bisa edit ukuran &amp; warna tepi box yang sesuai : Untuk edit ukuran box =&nbsp; width:470px &amp; height:60px, Untuk edit warna tepi = solid #FF0040</li>
<li>Save.&nbsp;</li>
</ul>
<span style="font-family: inherit;"><a href="http://www.riyanghifar.com/"><blink>www.riyanghifar.com<blink></blink></blink></a> Link Sumber Klik <a href="http://tricahyamedia.blogspot.com/2013/03/cara-membuat-scroll-box-pada-postingan.html" rel="nofollow" target="_blank"><blink>DISINI</blink></a></span><br />
<br />
<span style="font-family: inherit;"><blink></blink></span><blink></blink><span style="font-family: inherit;"><span style="font-family: inherit;"><span style="font-family: inherit;">Silahkan Copas Tutorial Ini Tapi Jangan Lupa Mencantumkan Link Awal :</span></span></span><br />
<br />
<div style="border: 2px solid #f00418; height: 350px; overflow: auto; padding: 10px; width: 580px;">
<span style="font-size: 100%;">&lt;div class="post-title entry-title" itemprop="name" style="text-align: justify;"&gt;<br />&lt;div class="separator" style="clear: both; text-align: center;"&gt;<br />&lt;a href="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"&gt;&lt;img border="0" src="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" height="283" width="400" /&gt;&lt;/a&gt;&lt;/div&gt;<br />&lt;/div&gt;<br />&lt;div style="text-align: justify;"&gt;<br />Scrol Box pada postingan blog memiliki fungsi sebagai pembatas antara<br />&nbsp;postingan pada paragraf tertentu dengan sebuah lampiran yang biasanya <br />cukup panjang, sehingga lampiran tersebut dapat tersusun rapi dalam <br />sebuah box bergulir. &lt;/div&gt;<br />&lt;ul&gt;<br />&lt;li&gt;<br />Sobat login akun Blogger tentunya&lt;/li&gt;<br />&lt;li&gt;Edit tulisan pada menu HTML bukan Compose&lt;/li&gt;<br />&lt;li&gt;Tentukan batas tulisan yang hendak diberi scroll box&lt;/li&gt;<br />&lt;li&gt;Paste code berikut tepat dibawah batas tulisan yang sudah sobat tentukan&lt;/li&gt;<br />&lt;/ul&gt;<br />&lt;div style="border: 1px solid #F4FA58; height: 100px; overflow: auto; padding: 10px; width: 580px;"&gt;<br />&lt;span style="font-size: 100%;"&gt;&lt;b&gt;&amp;lt;div style="overflow:auto;width:470px;height:60px;padding:10px;border:1px solid &lt;/b&gt;&lt;/span&gt;&lt;b&gt;#FF0040&lt;/b&gt;&lt;span style="font-size: 100%;"&gt;&lt;b&gt;"&amp;gt;&lt;span style="color: #0070c0;"&gt;&lt;span style="color: #cc0000;"&gt;<br />letakkan tulisan atau gambar sobat yang hendak diberi scroll box diSini&lt;/span&gt;&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;span style="font-size: 100%;"&gt;&lt;b&gt; &lt;/b&gt;&lt;/span&gt;&lt;br /&gt;<br />&lt;div class="separator" style="clear: both; text-align: center;"&gt;<br />&lt;span style="font-size: 100%;"&gt;&lt;b&gt;&lt;a href="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"&gt;&lt;img border="0" src="http://2.bp.blogspot.com/-kxKmPeKYedg/UZtvVJQoTWI/AAAAAAAAAn4/78FF1t04eGg/s1600/capture-20130521-195413.png" height="226" width="320" /&gt;&lt;/a&gt;&lt;/b&gt;&lt;/span&gt;&lt;/div&gt;<br />&lt;span style="font-size: 100%;"&gt;&lt;b&gt;&amp;lt;/div&amp;gt;&lt;/b&gt;&lt;/span&gt;&lt;/div&gt;<br />&lt;br /&gt;<br />&lt;ul&gt;<br />&lt;li&gt;<br />Sobat bisa edit ukuran &amp;amp; warna tepi box yang sesuai : Untuk edit ukuran box =&amp;nbsp; width:470px &amp;amp; height:60px, Untuk edit warna tepi = solid #FF0040&lt;/li&gt;<br />&lt;li&gt;Save.&amp;nbsp;&lt;/li&gt;<br />&lt;/ul&gt;<br />&lt;span style="font-family: inherit;"&gt;&lt;a href="http://www.riyanghifar.com/"&gt;&lt;blink&gt;www.riyanghifar.com&lt;blink&gt;&lt;/blink&gt;&lt;/blink&gt;&lt;/a&gt; Link Sumber Klik &lt;a href="http://tricahyamedia.blogspot.com/2013/03/cara-membuat-scroll-box-pada-postingan.html" rel="nofollow" target="_blank"&gt;&lt;blink&gt;DISINI&lt;/blink&gt;&lt;/a&gt;&lt;/span&gt;&lt;br /&gt;<br />&lt;br /&gt;<br />&lt;span style="font-family: inherit;"&gt;&lt;blink&gt;&lt;/blink&gt;&lt;/span&gt;&lt;blink&gt;&lt;/blink&gt;&lt;span style="font-family: inherit;"&gt;&lt;span style="font-family: inherit;"&gt;&lt;span style="font-family: inherit;"&gt;Silahkan Copas Tutorial Ini Tapi Jangan Lupa Mencantumkan Link Awal :&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;br /&gt;</span><span style="font-size: 100%;"><b></b></span></div>
<span style="font-family: inherit;"><span style="font-family: inherit;"><span style="font-family: inherit;">&nbsp;</span></span><blink> </blink></span><br />
<span style="font-family: inherit;"><blink><blink></blink></blink></span> <br />
<ul>
</ul>