Cara Memasang Apple Style Breadcrumb Navigation MyBB
Fungsi daripada Memasang Apple Style Breadcrumb Navigation untuk forum MyBB ini berfungsi untuk mempercantik tampilan dari Breadcrumb itu sendiri, sehingga tampilan forum MyBB anda akan terlihat lebih menarik. berikut contoh Apple Style Breadcrumb Navigation yang akan kita buat.
Baiklah, langsung saja ke pokok bahasan yaitu bagaimana Cara Memasang Apple Style Breadcrumb Navigation MyBB.
Sebelumnya anda harus download dulu ketiga gambar dibawah ini dan upload ke cpanel. tepatnya letakan di public_html
Gambar1, Gambar2, Gambar3
Gambar1, Gambar2, Gambar3
Setelah semua gambar di upload melalui cpanel selanjutnya silahkan lakukan langkah langkah dibawah ini :
Langkah Pertama :
Silahkan masuk Admin CP > Templates & Style > Themes
selanjutnya copy kode dibawah ini dan letakan pada global.css
#breadcrumb{
font: 11px Arial, Helvetica, sans-serif;
background-image:url(images/sundaboy_bg.png);
background-repeat:repeat-x;
height:30px;
line-height:30px;
color:#9b9b9b;
border:solid 1px #cacaca;
width:100%;
overflow:hidden;
margin:0px;
padding:0px;
}
#breadcrumb li
{
list-style-type:none;
float:left;
padding-left:10px;
}
#breadcrumb a
{
height:30px;
display:block;
background-image:url(images/sundaboy_separator.png);
background-repeat:no-repeat;
background-position:right;
padding-right: 15px;
text-decoration: none;
color:#454545;
}
.home
{
border:none;
margin: 8px 0px;
}
#breadcrumb a:hover
{
color:#35acc5;
}
font: 11px Arial, Helvetica, sans-serif;
background-image:url(images/sundaboy_bg.png);
background-repeat:repeat-x;
height:30px;
line-height:30px;
color:#9b9b9b;
border:solid 1px #cacaca;
width:100%;
overflow:hidden;
margin:0px;
padding:0px;
}
#breadcrumb li
{
list-style-type:none;
float:left;
padding-left:10px;
}
#breadcrumb a
{
height:30px;
display:block;
background-image:url(images/sundaboy_separator.png);
background-repeat:no-repeat;
background-position:right;
padding-right: 15px;
text-decoration: none;
color:#454545;
}
.home
{
border:none;
margin: 8px 0px;
}
#breadcrumb a:hover
{
color:#35acc5;
}
Langkah Kedua :
Pilih Templates & Style > Templates
selanjutnya pilih template yang anda gunakan lalu Expand Templates dan cari Navigation Template, setelah ketemu silahkan di Expand, didalamnya terdapat 5 bagian dari Navigation, lalu copy kode dibawah ini kemasing masing bagian pada navigation.
Pertama : Edit nav lalu ganti semua kode yang ada didalamnya dengan kode dibawah ini
<ul id="breadcrumb">
<li><a href="{$mybb->settings['bburl']}" title="Home"><img src="images/home.gif" alt="Home" class="home" /></a></li>
{$nav}{$activebit}
</ul>
<li><a href="{$mybb->settings['bburl']}" title="Home"><img src="images/home.gif" alt="Home" class="home" /></a></li>
{$nav}{$activebit}
</ul>
Kedua : Edit nav_bit lalu ganti semua kode yang ada didalamnya dengan kode dibawah ini
<li><a href="{$navbit['url']}" title="{$navbit['name']}" alt="{$navbit['name']}">{$navbit['name']}</a></li>
<li>{$navbit['name']}</li>
Kempat : pastikan nav_sep_active dan nav_sep kosong
Langkah Terakhir : Simpan Template dan lihatlah hasilnya.
Langkah Terakhir : Simpan Template dan lihatlah hasilnya.
Sebelum Memasang Apple Style Breadcrumb Navigation MyBB diatas, alangkah baiknya backup terlebih dahulu template yang anda gunakan, supaya apabila terjadi eror dapat dengan mudah dikembalikan seperti semua.
Nah itulah seditkit tentang Cara Memasang Apple Style Breadcrumb Navigation untuk forum MyBB, kalau ada yang kurang paham anda bisa bertanya melalui kotak komentar dibawah ini. Mudah mudahan tutorial ini dapat bermanfaat untuk kita semua. Amin
Ditulis Oleh : Yudus | Media Sharing Sundaboy
Sahabat sedang membaca tulisan Cara Memasang Apple Style Breadcrumb Navigation MyBB. Yang ditulis oleh sundaboy Grt. Apabila sahabat ingin menyebar luaskan artikel ini untuk kepentingan umum, dimohon untuk menyertakan Link sumber dibawah ini. Untuk Kritik dan sarannya sahabat bisa mengirimkan pada kotak komentar dibawah, atau melalui email sundaboy88@gmail.com. tengkyu
0 komentar — Klick Untuk Berkomentar
Posting Komentar Atau Kembali Ke Atas
Terimakasih Atas Kunjungan Sahabat
=================================
- Berkomentarlah Yang Sopan
- Tidak Diperkenankan Memasukan Link Aktif Pada Isi Komentar
- Berkomentarlah Sesuai Dengan Content
=================================