Làm thế nào để di chuyển Admin bar xuống đáy của website sử dụng mã nguồn WordPress? Qua bài viết này Websitequangngai sẽ hướng dẫn cho các bạn.
Đôi khi vì một lý do đơn giản mà người quản trị hoặc thành viên đăng nhập website WordPress không thích thanh Admin bar xuất hiện ở phần top của website( dưới thanh địa chỉ website của trình duyệt).
Hoặc vì lý do giao diện website của bạn có hỗ trợ chức năn floating menu và bạn chỉ muốn thanh menu này ở phần top còn thanh Admin bar thì di chuyển xuống phần đáy (bottom) của website.
Đôi khi giao diện của bạn không cho floating menu first (menu top) mà lại cho floating menu second( menu dưới menu top) thì một phần của thanh menu floating của website sẽ bị thanh Admin bar che mất. Giống như trường hợp giao diện mà Websitequangngai hiện đang dùng này.
Nguyên nhân là do cả hai thanh menu này đều được ghim lên phần top của website nên xảy ra tình trạng xung đột và gây chiếm chỗ. Đương nhiên, chỉ người quản trị hoặc user đăng nhập website thấy khó chịu với điều này còn khách thì không.
Bây giờ, hãy xem những gì ta cần làm để đưa thanh Admin bar từ phần top của website xuống bottom của website nhé. Mình sẽ hướng dẫn cho các bạn một cách đơn giản và ngắn gọn nhất.
Để làm được điều này, ta cần thêm một đoạn code và file functions.php của theme hiện tại. Có hai cách để mở file này lên và edit đó là:
+ Đăng nhập vào trang Dashboard=> Appearance (Giao Diện)=> Editor (Công cụ biên tập) và tìm đến file functions.php ở góc bên phải màn hình rồi click vào nó để chỉnh sửa.
+ Nếu như bạn cài các plugin bảo mật và nó xóa quyền chỉnh sửa file php (644) trên trang Dashboard thì bạn có thể đăng nhập trực tiếp vào host trên trình duyệt và duyệt đến đường dẫn sau: thư_mục_root/wp-content/themes/tên_theme_đang_dùng/functions.php và mở nó lên để edit, hoặc bạn có thể đăng nhập vào host bằng mềm ftp Filezila để mở file này lên và edit.
Ta cần thêm đoạn code sau vào cuối file functions.php, tức là trước dấu đóng tab php “?>” ở cuối file.
[php]
//code di chuyển thanh admin bar xuống dưới cuối màn hình
function move_wp_admin_bar() {
echo ‘
<style type="text/css">
body {
margin-top: -28px;
padding-bottom: 28px;
}
body.admin-bar #wphead {
padding-top: 0;
}
body.admin-bar #footer {
padding-bottom: 28px;
}
#wpadminbar {
top: auto !important;
bottom: 0;
}
#wpadminbar .quicklinks .menupop ul {
bottom: 28px;
}
</style>’;
}
add_action( ‘admin_head’, ‘move_wp_admin_bar’ );
add_action( ‘wp_head’, ‘move_wp_admin_bar’ );
[/php]
Sau khi thêm đoạn code này vào bạn lưu lại là được.
Bây giờ hãy xem kết quả ở hình bên dưới, thanh Admin bar đã nằm ở cuối màn hình rồi đó.
Cảm ơn các bạn đã quan tâm tới bài viết này.