Trả phải biết giới thiệu như thế nào nữa . Chỉ biết mục đích chính của bài viết này là hướng dẫn anh em dùng mã nguồn
Bo-blog tạo thanh menu dạngdrop down ( sử dụng css và Javascript ) từ danh mục phân loại trên
blog một cách tự động.
Hiện tại có nhiều kiểu menu drop down khác nhau nhưng mình sẽ làm theo kiểu Chrome CSS Drop Down Menu (v2.5) được cung cấp miễn phí trên Dynamic Drive Kiểu menu này hoạt động tốt trên nhiều trình duyệt web khác nhau bao gồm cả IE 6.
Các bạn nên thực hiện trên localhost trước khi đưa lên host để tránh lỗi nhé
Các bước thực hiện
1.
Bước 1: Bạn hãy download file bên dưới về máy và giải nén sau đó upload thư mục menu lên thư mục gốc của
host
Download :
2.
Bước 2 : Chỉnh sửa và cài đặt.
- Mở file index.php trong thư mục gốc sau đó tìm đoạn mã sau :
|
# //Section: Top - ở dòng thứ 99
# $section_head_components="<li>".@implode("</li>\r\n<li>", $section_header)."</li>"; |
Thay thế bằng :
|
# //Section: Top
# include_once ("menu/menu.php");
# if (file_exists('data/cache_categories.php')) {
# $section_head_components=makemenu();
# }
# else
# $section_head_components="<div id='menu'>"."<li>".@implode("</li>\r\n<li>", $section_header)."</li>"."</div>"; |
Download :
- Mở file elements.php ( của giao diện bạn đang sử dụng)
Thêm đoạn mã sau vào trước thẻ </head>
|
<script type="text/javascript" src="menu/menu.js"></script>
<link rel="stylesheet" type="text/css" href="menu/chrometheme/chromestyle.css" /> |
Trong thư mục "menu/chrometheme" có sẵn 4 file css tương ứng với 4 mẫu giao diện khác nhau . Nhưng bạn nên chỉnh sửa các thông số trong file chromestyle.css sao cho giao diện của menu drop down phù hợp với giao diện của
blog ( để làm được đều này bạn cần phải có kiến thức về css ).
- Tìm tiếp đoạn mã
|
<div id="menu">
<ul>
{section_head_components}
</ul>
</div> |
Thay bằng
|
{section_head_components}
<script type="text/javascript">cssdropdown.startchrome("chromemenu")</script> |
Sau khi chỉnh sửa xong bạn save lại và upload đè các file này lên
host
nguồn : canthoIT
View more the latest threads: