- Hướng dẫn chỉnh sửa WordPress Admin : Trang login
- Hướng dẫn chỉnh sửa WordPress Admin : Dashboard admin
- Hướng dẫn chỉnh sửa WordPress Admin : Custom Admin Menus
- Hướng dẫn chỉnh sửa WordPress Admin : Help Text
- Hướng dẫn chỉnh sửa WordPress Admin: Listing Screen
- Hướng dẫn chỉnh sửa WordPress Admin: Adding Styling
Tiếp theo loại bài về customize wordpress admin, hôm nay sharecodeweb hướng dẫn các bạn customize trang dashboard của wordpress theo cách tạo plugin.
Demo hình ảnh kết quả
Sau khi học xong bài này chúng ta sẽ làm được một số việc như sau:
- Gỡ bỏ một số metabox không cần thiết
- Di chuyển metabox sang vị trí khác
- Thêm metabox phù hợp với người dùng
Nếu chỉ có vậy thì chắc chắn các bạn sẽ nghĩ rằng là tại sao mình phải viết một bài hướng dẫn như thế này. Thực ra mình muốn cho các bạn một cách tiếp cận khác ngoài việc sử dụng tính năng Screen Option của wordpress. Nhưng điều hạn chế của cách này là user không có quyền administrator sẽ không thể remove được. Do đó,bài này sẽ cho các bạn cách thiết kế theo plugin riêng, như vậy sẽ cho các bạn học thêm về bộ core của wordpress nhiều hơn và có thể tùy biến nhiều hơn
Nguyên liệu cần cho bài học
Cũng như bài trước, nguyên liệu cho bài học chúng ta cần như sau:
- Bộ cài wordpress
- Quyền truy cập vào folder plugin trên host của bạn
- Và một text editor để có thể code
Setting up plugin
Các bước tạo một file plugin các bạn xem lại bài trước tại đây nhé. Mình sẽ không đưa lại nữa.
Gỡ một số metabox không mong muốn
Để remove một metabox nào đó không mong muốn, chúng ta thêm đoạn mã sau
|
1 2 3 4 5 6 7 8 9 10 11 12 |
// remove unwanted dashboard widgets for relevant users function wptutsplus_remove_dashboard_widgets() { $user = wp_get_current_user(); if ( ! $user->has_cap( 'manage_options' ) ) { remove_meta_box( 'dashboard_recent_comments', 'dashboard', 'normal' ); remove_meta_box( 'dashboard_incoming_links', 'dashboard', 'normal' ); remove_meta_box( 'dashboard_quick_press', 'dashboard', 'side' ); remove_meta_box( 'dashboard_primary', 'dashboard', 'side' ); remove_meta_box( 'dashboard_secondary', 'dashboard', 'side' ); } } add_action( 'wp_dashboard_setup', 'wptutsplus_remove_dashboard_widgets' ); |
Như vậy, ở đây, tôi đã thực hiện gỡ bỏ các metabox sau
- Recent Comments
- Incoming Links
- QuickPress
- WordPress Blog
- Other WordPress News
Lúc này, nhìn dashboard của bạn sẽ trông sáng sủa hơn rất nhiều.
Di chuyển một Metabox bất kỳ
Giả sử mình muốn di chuyển metabox Right Now sang bên phải, thì làm thế nào. Trong plugin của bạn, bạn thêm đoạn code sau:
|
1 2 3 4 5 6 7 8 9 10 11 |
// Move the 'Right Now' dashboard widget to the right hand side function wptutsplus_move_dashboard_widget() { $user = wp_get_current_user(); if ( ! $user->has_cap( 'manage_options' ) ) { global $wp_meta_boxes; $widget = $wp_meta_boxes['dashboard']['normal']['core']['dashboard_right_now']; unset( $wp_meta_boxes['dashboard']['normal']['core']['dashboard_right_now'] ); $wp_meta_boxes['dashboard']['side']['core']['dashboard_right_now'] = $widget; } } add_action( 'wp_dashboard_setup', 'wptutsplus_move_dashboard_widget' ); |
Thêm mới một metabox
Để thêm mới một metabox, chúng ta sử dụng hàm wp_add_dashboard_widget(), và active hook của wordpress lên.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
// add new dashboard widgets function wptutsplus_add_dashboard_widgets() { wp_add_dashboard_widget( 'wptutsplus_dashboard_welcome', 'Welcome', 'wptutsplus_add_welcome_widget' ); wp_add_dashboard_widget( 'wptutsplus_dashboard_links', 'Useful Links', 'wptutsplus_add_links_widget' ); } function wptutsplus_add_welcome_widget(){ ?> This content management system lets you edit the pages and posts on your website. Your site consists of the following content, which you can access via the menu on the left: <ul> <li><strong>Pages</strong> - static pages which you can edit.</li> <li><strong>Posts</strong> - news or blog articles - you can edit these and add more.</li> <li><strong>Media</strong> - images and documents which you can upload via the Media menu on the left or within each post or page.</li> </ul> On each editing screen there are instructions to help you add and edit content. <?php } function wptutsplus_add_links_widget() { ?> Some links to resources which will help you manage your site: <ul> <li><a href="http://wordpress.org">The WordPress Codex</a></li> <li><a href="http://easywpguide.com">Easy WP Guide</a></li> <li><a href="http://www.wpbeginner.com">WP Beginner</a></li> </ul> <?php } add_action( 'wp_dashboard_setup', 'wptutsplus_add_dashboard_widgets' ); |
Ở đây, mình thực hiện thêm 2 metabox là Welcome và Userful links. Các bạn cũng có thể tùy biến theo cách của mình.
Download code
Vậy là các bạn đã học xong cách remove một metabox không mong muốn, chỉnh sửa vị trí của nó, và thêm mới một số metabox theo ý bạn. Bài học tới đây kết thúc!
Nếu bạn nào còn không hiểu thì có thể download demo bên dưới về để tham khảo chi tiết hơn cách viết nhé
