Home BlogMybb Menambahkan 4 column Footer Di MyBB

Menambahkan 4 column Footer Di MyBB

by imadenews

NavTutorial cara Menambahkan 4 column Footer Di MyBB. Tutorial ini mungkin banyak para master master mybb sudah mengetahuinya .. ini hanya untuk pengetahuan bagi yang belum tau aja 😛 .. Caranya saya rasa gampang gampang susah, jadi backup dulu file file yang hendak anda ubah agar tidak fatal jika error nantinya,, ok lanjut kebawah

1. Penambahan pada Global.css

Tambahkan code css ini pada paling bawah

 

[php]<code>#foot *{
box-sizing:border-box;
}

#foot {
width: 100%;
height: 250px;
background: #111;
}

.col {
background: #111;
float: left;
padding: 5px 15px;
width: 25%;
}

h3 {
background: none;
color: #FFF;
font: bold 18px Arial, Helvetica, sans-serif;
font-variant: small-caps;
margin: 0 0 20px 0;
padding: 9px 0 0 19px;
height: 33px;
color:#E04006;
}

div.col ul{
list-style: none;
margin: 0;
padding: 0;
}

div.col li {
height: 35px;
margin: 3px 0;
padding: 0;
}

div.col li a {
color: #FFF;
display: block;
font: normal 12px Verdana, Geneva, sans-serif;
padding: 10px 0 0 19px;
text-decoration: none;
}

div.col li:hover {
background: #212121;
}</code>[/php]

 

2. Pengeditan pada Templates

Masuk Ke admin panel Mybb > pilih Templates dan cari Footer, Cari Kode dibawah ini

[php]<code><div class="bottommenu">
<div class="float_right">{$lang_select}</div>
<div>
<span class="smalltext">links here
</div> </div></code>[/php]

Kode diatas Ganti Dengan Kode Dibawah ini

[php]<code><div id="foot">
<div class="col">
<h3>Navigation 1</h3>
<ul>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
</ul>
</div>

<div class="col">
<h3>Navigation 2</h3>
<ul>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
</ul>
</div>

<div class="col">
<h3>Navigation 3</h3>
<ul>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
</ul>
</div>
<div class="col">
<h3>Navigation 4</h3>
<ul>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
<li><a href="link 1">link 1</a></li>
<li><a href="link 2">link 2</a></li>
</ul>
</div>
</div></code>[/php]

Setelah itu Save Templates yang sudah anda ubah ..  anda bisa mengkreasikan code diatas dengan cara anda sendiri nantinya ..

semoga berguna.

 

 

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More