- Back to Home »
- Tutorial blog »
- Cara Membuat Box Di bawah Header
Posted by : Unknown
6 Jul 2013
Langkah-langkah:
1. Login Dashbor Blogger
2. Pilih Template
3. Edit Template
4. Cari kode ]]></b:skin>
Letakkan kode dibawah ini diatas ]]></b:skin>
#MODchat{-moz-transition: all 0.7s ease-in-out;-webkit-transition: all 0.7s ease-in-out ;border:5px solid #0c0c0c;float:left;background:#232222;padding-left:15px;width:170px;height:70px;margin-left: 800px;margin-top:-15px;border-top:5px solid #0c0c0c; border-radius:5px 5px 30px 30px; position: absolute;}
#MODjoin{-moz-transition: all 0.7s ease-in-out;-webkit-transition: all 0.7s ease-in-out ;border:5px solid #0c0c0c;float:right;background:#232222;padding-left:0px;width:180px;height:70px;margin-left: 800px;margin-top:135px;border-top:5px solid #0c0c0c; border-radius:30px 30px 5px 5px; position: absolute;}
#MODbanner2{-moz-transition: all 0.7s ease-in-out;-webkit-transition: all 0.7s ease-in-out ;border:5px solid #0c0c0c;float:right;background:#232222;padding-left:0px;width:180px;height:auto;margin-left: 180px;margin-top:35px; border-radius:10px; position: absolute;}
#MODrangka1{ margin-top:20;margin-left: 0px ;margin-bottom:50px ;border:5px solid #0c0c0c;border-radius:10px 10px 10px 10px ;width:1090px;height:200px; background: #232222; position:relative;}
#MODbox1{-moz-transition: all 0.7s ease-in-out;-webkit-transition: all 0.7s ease-in-out ;border:5px solid #0c0c0c;border-bottom:5px #232222;float:left;background:#171717; padding-top:30px;width:300px;height:340px;margin-left: 400px;margin-top:-240px; border-radius:20px 20px 10px 10px; position: absolute;}
#MODbox2{-moz-transition: all 0.7s ease-in-out;-webkit-transition: all 0.7s ease-in-out ;border:5px solid #0c0c0c;float:left;background:#171717;padding:5px;width:auto;height:auto;margin-left: 10px;margin-top:35px; border-radius:10px 10px 10px 10px; position: absolute;}
#MODlike{margin-left:790px;width:180px;margin-top:-80px;background:#0c0c0c;border: 7px dashed #171717;border-radius:30px;padding:10px;padding-left:35px}
#MODmusic{margin-left:20px;width:320px;margin-top:-10px;background:#0c0c0c;border: 7px dashed #171717;border-radius:30px;padding:10px;}
5. Lalu sekarang kita aktifkan kode CSS-nya yaitu dengan kode HTML
6. Cari kode <div id='content-wrapper'>
Letakkan kode dibawah ini diatas <div id='content-wrapper'>
<div id='MODrangka1'>
<b:section id='MODbox2' maxwidgets='5' showaddelement='yes'>
<b:widget id='HTML8' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
<div id='MODchat'>
<a href='http://monster-shared.blogspot.com'><img alt='cbox' src='http://didil-cyber.googlecode.com/files/Guest-Book-Ichigo.png' title='Click here to open Guest Book'/></a>
</div>
<div id='MODjoin'>
<a href='http://www.Blogger.com/follow-blog.g?blogID=2038011248359714008' onclick='window.open(this.href, 'dmfollow', 'toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=no,width=599,height=521');return false;' style='text-align:center;font-weight:bold;text-decoration:none;' title='Join This Site / Follow This Site'><img alt='Join This Site' src='http://didil-cyber.googlecode.com/files/Join-This-Site-Ichigo.png' style='vertical-align:center;border:0px;cursor:pointer;'/></a>
</div>
<div id='MODbanner2'><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a><a href="http://monster-shared.blogspot.com/" target="_blank"><img src="https://monster-shared.googlecode.com/files/MonsterMini.png" alt="Monster-Shared™" title="Monster-Shared™ | More About Share" /></a></div>
</div>
<b:section id='MODbox1' maxwidgets='5' showaddelement='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
7. gue kasi bonus nih nuat kalian, tambahan extra kan! gak enak kalau setengah-setengah xD
8. letakkan kode dibawah ini diatas <div id='content-wrapper'>
<div id='MODmusic'><embed allowscriptaccess='never' flashvars='autostart=true' height='0' src='http://www.4shared.com/embed/3432989025/6e5815ae' style='width:320px;height:25px;border:0px;display:block;margin:5px auto;' type='application/x-shockwave-flash' width='0'/></div>
<div id='MODlike'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' layout='box_count' show_faces='false'/><script src='https://apis.google.com/js/plusone.js' type='text/javascript'/><g:plusone size='tall'/><a class='twitter-share-button' data-count='vertical' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></div>
9. Pratinjau dulu kalau udah mantep
10. Simpan template
Sumber : klik
You will most likely be unable to use to deal with supports raised on Gdax and end up in an astounding circumstance. You don't need to stress over a circumstance like that. What you require is to call our committed and all around prepared Gdax client bolster group on our devoted without toll number and converse with our client specialists. Clients can approach the all around experienced group by means of our Gdax Toll-free Number AT-1800-665-6722 specialists. The specialists do their best to give appropriate direction and best quality answers for the clients whenever
BalasHapus