Assalamu'alaikum . salam hangat sob! , apa kabar? . kali ini saya akan mengepost
Cara membuat box dibawah header v.2 , okkay gmna kah crnya ?? lngsung saja ke topik nya!!
- langkah pertama kamu harus login ke blogger.com dulu
- masuk ke dasboard , pilih page template di samping kiri ,
- dan klik edit html ,
- masukan kode berikut tepat diatas kode </b:skin>
/*box-start*/
#ACbox {
float: right;
border: 3px solid rgb(0, 82, 255);
border-radius: 7px 10px 0px 0px;
background: black;
width: 614px;
height: 273px;
margin-top: 1px;
margin-bottom: 30px;
}
#ACfollow {
background: black;
border: 3px solid rgb(0, 82, 255);
border-bottom: none;
float: left;
position: relative;
margin-bottom: 5px;
transition: 200ms;
transition-delay: 200ms;
margin-left: 190px;
width: 148px;
height: 29px;
display: inline;
margin-top: 241px;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
padding: 0px;
padding-top: 2px;
padding-left: 3px;
padding-left: 3px;}
#ACfollow:hover {background: black;
border: 3px solid rgba(255, 255, 255, 0.16);
border-bottom: none;
transition: 200ms;
transition-delay: 150ms}
.VZkotak {
z-index: 99999;
margin-top: -3px;
margin-left: 515px;
position: absolute;
border: 3px solid rgb(0, 82, 255);
border-top: none;
width: 35px;
height: 60px;
background: black;
}
.VZkotak6 {
z-index: 99999;
margin-top: -33px;
margin-left: 205px;
position: absolute;
border: 3px solid rgb(0, 82, 255);
border-top: none;
border-bottom: none;
width: 287px;
height: 33px;
background: black;
}
.VZkotak1 {
z-index: 99999;
margin-top: 210px;
margin-left: 516px;
position: absolute;
border: 3px solid rgb(0, 82, 255);
border-radius: 3px;
border-bottom: none;
width: 35px;
height: 60px;
background: black;
}
#VZonline {
background: #000;
border: 3px solid rgb(0, 82, 255);
border-left: none;
border-right: none;
float: left;
position: relative;
margin-top: -270px;
margin-left: 300px;
width: 39px;
height: 46px;
display: inline;
padding-left: 8px;
padding-top: 8px;
padding-bottom: 5px;
padding-right: 8px}
#VZonline1 {
background: #000;
border: 3px solid rgb(0, 82, 255);
border-left: none;
border-right: none;
float: left;
position: relative;
margin-top: -109px;
margin-left: 300px;
width: 39px;
height: 46px;
display: inline;
padding-left: 8px;
padding-top: 8px;
padding-bottom: 5px;
padding-right: 8px}
#VZbox {
border: 3px solid rgb(0, 82, 255);
background: black;
width: 303px;
border-radius: 2px;
height: 274px;
margin-top: 26px;
margin-bottom: 30px;
}
.VZkotakb {
z-index: 99999;
margin-top: -33px;
margin-left: 237px;
position: absolute;
border: 3px solid rgb(0, 82, 255);
border-top: none;
border-bottom: none;
width: 35px;
height: 35px;
background: black;
}
.VZkotaka {
z-index: 99999;
margin-top: -33px;
margin-left: 29px;
position: absolute;
border: 3px solid rgb(0, 82, 255);
border-top: none;
border-bottom: none;
width: 35px;
height: 35px;
background: black;
}
#VZads {
background: black;
border: 3px solid rgb(0, 82, 255);
float: right;
position: relative;
margin-top: -271px;
margin-bottom: 5px;
margin-right: 460px;
width: 125px;
height: 125px;
transition:200ms;
transition-delay:150ms;
display: inline}
#VZads:hover {-webkit-box-shadow: 0px 0px 10px rgb(0, 31, 255);
-mox-box-shadow: 0px 0px 10px #ff5600;
-ms-box-shadow: 0px 0px 10px #ff5600;
-o-box-shadow: 0px 0px 10px #ff5600;
box-shadow: 0px 0px 11px rgb(0, 143, 255);
transition:200ms;
transition-delay:150ms;
text-align: center;
-webkit-border-radius: 0px;
border-radius: 1px}
#VZads1 {
background: black;
border: 3px solid rgb(0, 82, 255);
float: right;
position: relative;
margin-top: -270px;
margin-bottom: 5px;
margin-right: 329px;
width: 125px;
height: 125px;
display: inline;
transition:200ms;
transition-delay:150ms;}
#VZads1:hover {-webkit-box-shadow: 0px 0px 10px rgb(0, 31, 255);
-mox-box-shadow: 0px 0px 10px #ff5600;
-ms-box-shadow: 0px 0px 10px #ff5600;
-o-box-shadow: 0px 0px 10px #ff5600;
transition:200ms;
transition-delay:150ms;
box-shadow: 0px 0px 11px rgb(0, 143, 255);
text-align: center;
-webkit-border-radius: 0px;
border-radius: 1px}
#VZads2 {
background: black;
border: 3px solid rgb(0, 82, 255);
float: right;
position: relative;
transition:200ms;
transition-delay:150ms;
margin-top: -141px;
margin-bottom: 5px;
margin-right: 460px;
width: 125px;
height: 125px;
display: inline;}
#VZads2:hover {-webkit-box-shadow: 0px 0px 10px rgb(0, 31, 255);
-mox-box-shadow: 0px 0px 10px #ff5600;
-ms-box-shadow: 0px 0px 10px #ff5600;
-o-box-shadow: 0px 0px 10px #ff5600;
box-shadow: 0px 0px 11px rgb(0, 143, 255);
text-align: center;
-webkit-border-radius: 0px;
transition:200ms;
transition-delay:150ms;
border-radius: 1px}
#VZlike {
box-shadow: inset 0 0 16px rgb(3, 78, 138);
border: 3px solid rgb(0, 92, 255);
border-radius: 24px 19px 34px 1px;
float: right;
position: relative;
margin-top: -135px;
margin-bottom: 5px;
margin-right: 222px;
width: 218px;
height: 75px;
display: inline;
}
- letakan kode berikut tepat dibawah kode <div id='content-wrapper'>
<div id='ACbox'>
<div id='ACfollow'>
<a
href='http://www.Blogger.com/follow-blog.g?blogID=7239184517094172346'
target='_blank'><img alt='Join Us !!'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtLw_ifZVv_EdgXlX941E1ru0WpVhyx1HVw2f5T0tLF6PZ5PSjN3jfoMCpki3_YPNfgftohBBgAnv4hgOHxuWbJZV0md4nwmCq5gfq_Ony5ywz9aev_5czJrtdlpUzE4FqHXW8GRCb1C0/s1600/lesBa.png'/></a></div>
<b:section id='VZalexa' maxwidgets='1' showaddelement='yes'/>
<div class='VZkotak'/>
<div class='VZkotak1'/>
<div class='VZkotak2'/>
<div class='VZkotak3'/>
<div class='VZkotak4'/>
<div class='VZkotak5'/>
<div class='VZkotak6'/>
<div id='VZads'>
<a
href='http://kiritoblogs.blogspot.com/' target='_blank'><img
height='125' src='http://i.imgur.com/1jexwd8.gif' title='KIRITO
BLOG'S | All About Blog, Editing,Template, and Tricks'
width='125'/></a></div>
<div id='VZads1'>
<a
href='http://www.interizers.blogspot.com'><img height='125'
src='http://i.imgur.com/zjuParB.gif' title='EVIL ROXAS|Simple Is My
Life' width='125'/></a> </div>
<div id='VZads2'>
<a
href='http://www.interizers.blogspot.com'><img height='125'
src='http://i.imgur.com/zjuParB.gif' title='EVIL ROXAS|Simple Is My
Life' width='125'/></a></div>
<div id='VZlike'>
<object
allowtransparency='true'
data='//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FInterizers%2F1401819200050546%3F&height=62&show_faces=false&colorscheme=light&stream=false&border_color=%23fff&header=false'
frameborder='0' scrolling='no' style='border:none; overflow:hidden;
width:292px; height:62px;'/></div>
</div>
<div class='VZputar'>
<div class='VZptr'/>
</div>
<div id='VZonline'/>
<div id='VZonline1'/>
<div id='VZbox'>
<b:section id='VZentri' maxwidgets='1' showaddelement='yes'/>
</div>
<div class='VZkotaka'/>
<div class='VZkotakb'/>
- eittzz , sebelum disave pritinjau dlu , eror kgk? , klo kgk eror baru dah disave dan liat hasilnya! :)
Sumber :http://www.interizers.blogspot.com/2014/02/cara-membuat-box-dibawah-header-v2-keren-sob-original-dari-yozers-and-chrystur-2014.html
mkasih sob udah menyertakan sumber nya :)
BalasHapusgan gimana buat fans pagenya kok valid
Hapusadd fb gwa aja sob ,,
Hapushttps://www.facebook.com/Tova.OutSiderS.interizers.blogs
blogermu membantu,,,,,,, http://doni48.blogspot.com/
BalasHapus