Nội quy chuyên mục: - Chuyên mục này chỉ hỗ trợ cho các theme mặc định của hệ thống.
- Các giao diện khác bạn vui lòng tìm đến bài viết chia sẻ theme đó để thảo luận.
#169166 gửi bởi giaiphap
Ngày 21 Tháng 05 2015 , 09:34
Các cao thủ cho mình hỏi vấn đề này chút về menu ngay bằng css và js.
Trong giao diện theme Modern mình mở file header.tpl (trong thư mục themes\modern\layout) lên và thêm vào đoạn code trước </head> như sau:
Mã: Chọn hết
<script type="text/javascript" src="/themes/forum/js/styleswitch.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="/themes/forum/css/style.css" />
<script type="text/javascript" src="/themes/forum/js/jquery.js"></script>

<style type="text/css" media="screen">

#main-nav, #main-nav ul li a{
font-family: '&quot;Times New Roman&quot;, Times, serif';
font-size : 16px;
}

</style>

thay đoạn code [MENU_SITE] trong file header.tpl bằng đoạn code sau:
Mã: Chọn hết
<nav id="main-nav">
<div class="main-menu"><ul id="menu-menu" class="menu"><li id="menu-item-11" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-11"><a title="Thủ thuật" href="http://thuthuattienich.com/">Home</a></li>
<li id="menu-item-7" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-7"><a title="Facebook" href="#">Menu1</a>
<ul class="sub-menu">
<li id="menu-item-7455" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7455"><a title="Menu cap 1" href="#">Menu cấp 1</a></li>
<li id="menu-item-4906" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-4906"><a title="Menu cấp 1" href="#">Menu cấp 1</a></li>
<li id="menu-item-1820" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1820"><a title="Menu cấp 1" href="#">Mwnu cấp 1</a></li>
</ul>
</li>

<li id="menu-item-5817" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-has-children menu-item-5817"><a title="Phần mềm hay" href="#">Menu2</a>
<ul class="sub-menu">
<li id="menu-item-6388" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-6388"><a href="#">Menu cấp 1</a>
<ul class="sub-menu">
<li id="menu-item-6389" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-6389"><a href="#">Menu cấp 2</a>
<li id="menu-item-6390" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6390"><a href="#">Menu cấp 2</a></li>
<li id="menu-item-6391" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6391"><a href="#">Menu cấp 2</a></li>
</ul>
</li>
<li id="menu-item-6392" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-6392"><a href="#">Menu cấp 1<span> »</span></a>
<ul class="sub-menu">
<li id="menu-item-6393" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6393"><a href="#">Menu cấp 2</a></li>
<li id="menu-item-6430" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-6430"><a href="#">Menu cấp 2</a></li>
</ul>
</nav>

Mình chép file jquery.js vào thư mục themes\modern\js, file style.css vào thư mục themes\modern\css, chép 2 file hình home.png và main-menu-bg.png vào thư mục themes\modern\images.
Nhưng khi mở giao diện lên thì menu ngang bị lệch như hình. Mình không biết sửa thế nào, mò mãi vẫn không được. Các cao thủ nào biết chỉ hộ mình.
Hinh.jpg

Và đây là file css, js, và hình ảnh kèm theo.
Du lieu menu.zip
Đính kèm
(51.55 KB) Đã tải về 1 lần
(119.31 KB) Đã tải về 19 lần