Thêm custom dashboard widget WordPress

4 tháng ago, WordPress Themes, Views
Thêm custom dashboard widget WordPress

Giới Thiệu về Thêm Custom Dashboard Widget WordPress

Dashboard WordPress là trang tổng quan bạn thấy ngay sau khi đăng nhập vào trang quản trị. Nó cung cấp một cái nhìn tổng quan về trang web của bạn, bao gồm các bài viết gần đây, bình luận, và các thông tin quan trọng khác. Nhưng bạn có biết bạn có thể tùy chỉnh dashboard này để hiển thị thông tin bạn cần một cách nhanh chóng và dễ dàng hơn không? Bằng cách thêm custom dashboard widget, bạn có thể biến dashboard thành một trung tâm điều khiển cá nhân hóa cho trang web của mình.

Bài viết này sẽ hướng dẫn bạn từng bước cách thêm custom dashboard widget vào trang web WordPress của bạn. Chúng ta sẽ khám phá các phương pháp khác nhau, từ đơn giản đến phức tạp hơn, và cung cấp các ví dụ cụ thể để bạn có thể bắt đầu xây dựng widget của riêng mình ngay lập tức.

Tại Sao Nên Thêm Custom Dashboard Widget?

Có rất nhiều lý do tại sao việc thêm custom dashboard widget lại hữu ích:

  • Tiết kiệm thời gian: Truy cập nhanh chóng thông tin bạn cần mà không cần phải điều hướng qua nhiều trang khác nhau.
  • Cá nhân hóa trang quản trị: Hiển thị dữ liệu quan trọng nhất đối với bạn và dự án của bạn.
  • Tăng năng suất: Dễ dàng theo dõi tiến độ dự án, hiệu suất trang web, hoặc các chỉ số quan trọng khác.
  • Tích hợp các dịch vụ bên ngoài: Hiển thị thông tin từ các API hoặc dịch vụ khác trực tiếp trên dashboard của bạn.

Ví dụ:

  • Hiển thị thống kê Google Analytics tóm tắt ngay trên dashboard.
  • Hiển thị danh sách các task cần làm từ một plugin quản lý dự án.
  • Hiển thị feed tin tức từ một nguồn cụ thể liên quan đến lĩnh vực của bạn.

Các Phương Pháp Thêm Custom Dashboard Widget

Có một vài cách để thêm custom dashboard widget vào WordPress. Chúng ta sẽ xem xét ba phương pháp chính:

  1. Sử dụng plugin có sẵn.
  2. Sử dụng đoạn mã trong file functions.php của theme.
  3. Tạo một plugin riêng.

Chúng ta sẽ đi sâu vào từng phương pháp một.

Phương Pháp 1: Sử Dụng Plugin Có Sẵn

Đây là phương pháp đơn giản nhất để thêm custom dashboard widget. Có rất nhiều plugin miễn phí và trả phí có sẵn trên WordPress.org và các thị trường plugin khác. Một số plugin phổ biến bao gồm:

  • Custom Dashboard Widgets: Cho phép bạn tạo các widget đơn giản bằng HTML, CSS, và JavaScript.
  • Dashboard Commander: Cung cấp nhiều tùy chọn tùy chỉnh và widget có sẵn.
  • Ultimate Dashboard: Một plugin mạnh mẽ với nhiều tính năng, bao gồm tùy chỉnh dashboard login và menu.

Ưu điểm:

  • Dễ dàng cài đặt và sử dụng.
  • Không cần kiến thức lập trình.
  • Nhiều plugin miễn phí có sẵn.

Nhược điểm:

  • Tính năng có thể hạn chế so với việc viết mã tùy chỉnh.
  • Có thể làm chậm trang web nếu sử dụng quá nhiều plugin.
  • Cần phải cập nhật plugin thường xuyên để đảm bảo an ninh và tương thích.

Để sử dụng một plugin, chỉ cần tìm kiếm plugin bạn muốn trong trang quản trị WordPress (Plugins -> Add New), cài đặt và kích hoạt nó. Sau đó, làm theo hướng dẫn của plugin để tạo và cấu hình widget của bạn.

Phương Pháp 2: Sử Dụng Đoạn Mã trong File functions.php của Theme

Nếu bạn muốn có nhiều kiểm soát hơn đối với widget của mình, bạn có thể thêm mã trực tiếp vào file functions.php của theme. Tuy nhiên, hãy cẩn thận khi chỉnh sửa file này, vì sai sót có thể làm hỏng trang web của bạn. Tốt nhất là sử dụng một child theme để tránh mất các thay đổi khi theme được cập nhật.

Dưới đây là một ví dụ về cách thêm một widget đơn giản hiển thị thông tin về số lượng bài viết, trang, và bình luận:


function my_custom_dashboard_widget() {
  $num_posts = wp_count_posts();
  $num_pages = wp_count_posts('page');
  $num_comments = wp_count_comments();

  echo '

Tổng số bài viết: ' . $num_posts->publish . '

'; echo '

Tổng số trang: ' . $num_pages->publish . '

'; echo '

Tổng số bình luận: ' . $num_comments->total_comments . '

'; } function add_dashboard_widgets() { wp_add_dashboard_widget('my_dashboard_widget', 'Thông Tin Trang Web', 'my_custom_dashboard_widget'); } add_action('wp_dashboard_setup', 'add_dashboard_widgets');

Giải thích mã:

  • Hàm my_custom_dashboard_widget() tạo nội dung của widget. Trong ví dụ này, nó lấy số lượng bài viết, trang, và bình luận và hiển thị chúng.
  • Hàm add_dashboard_widgets() sử dụng hàm wp_add_dashboard_widget() để đăng ký widget. Hàm này nhận ba tham số: ID của widget, tiêu đề của widget, và tên của hàm sẽ tạo nội dung của widget.
  • Hàm add_action('wp_dashboard_setup', 'add_dashboard_widgets') thêm hàm add_dashboard_widgets() vào hook wp_dashboard_setup. Hook này được gọi khi dashboard được tải.

Ưu điểm:

  • Kiểm soát hoàn toàn nội dung và giao diện của widget.
  • Không cần cài đặt plugin.

Nhược điểm:

  • Yêu cầu kiến thức lập trình PHP.
  • Thay đổi trong file functions.php có thể bị mất khi theme được cập nhật (nếu không sử dụng child theme).
  • Mã có thể trở nên khó quản lý nếu bạn thêm nhiều widget.

Phương Pháp 3: Tạo Một Plugin Riêng

Đây là phương pháp tốt nhất nếu bạn muốn tạo một widget phức tạp hoặc nếu bạn muốn sử dụng lại widget trên nhiều trang web. Bằng cách tạo một plugin, bạn có thể dễ dàng quản lý và cập nhật mã của mình.

Dưới đây là một ví dụ về cách tạo một plugin đơn giản thêm một custom dashboard widget:

  1. Tạo một thư mục mới trong thư mục wp-content/plugins của bạn. Đặt tên cho thư mục theo tên plugin của bạn (ví dụ: my-custom-dashboard-widget).
  2. Tạo một file PHP trong thư mục plugin của bạn (ví dụ: my-custom-dashboard-widget.php).
  3. Thêm thông tin plugin vào đầu file PHP:

<?php
/**
 * Plugin Name: My Custom Dashboard Widget
 * Plugin URI: https://example.com/my-custom-dashboard-widget
 * Description: A simple plugin that adds a custom dashboard widget.
 * Version: 1.0.0
 * Author: Your Name
 * Author URI: https://example.com
 */

// Mã plugin của bạn sẽ ở đây

  1. Thêm mã widget vào file PHP của bạn (tương tự như ví dụ trong phần trước):

function my_custom_dashboard_widget_content() {
  echo '

Chào mừng đến với Dashboard tùy chỉnh của tôi!

'; } function my_custom_dashboard_widget() { wp_add_dashboard_widget('my_dashboard_widget', 'Widget Tùy Chỉnh Của Tôi', 'my_custom_dashboard_widget_content'); } add_action('wp_dashboard_setup', 'my_custom_dashboard_widget');
  1. Lưu file PHP và kích hoạt plugin trong trang quản trị WordPress (Plugins -> Installed Plugins).

Ưu điểm:

  • Mã được tổ chức và dễ quản lý.
  • Dễ dàng sử dụng lại widget trên nhiều trang web.
  • Có thể dễ dàng chia sẻ plugin với người khác.

Nhược điểm:

  • Yêu cầu kiến thức lập trình PHP.
  • Tốn thời gian hơn so với các phương pháp khác.

Mẹo và Thủ Thuật

  • Sử dụng AJAX: Để cập nhật nội dung widget một cách động mà không cần tải lại trang.
  • Sử dụng WordPress Transients API: Để lưu trữ dữ liệu được truy xuất từ các API hoặc cơ sở dữ liệu bên ngoài, giảm tải cho máy chủ.
  • Thiết kế giao diện người dùng thân thiện: Đảm bảo rằng widget của bạn dễ sử dụng và trực quan.
  • Kiểm tra kỹ lưỡng: Trước khi triển khai widget của bạn trên trang web trực tiếp.

Kết Luận

Thêm custom dashboard widget là một cách tuyệt vời để cá nhân hóa trang quản trị WordPress của bạn và tăng năng suất. Cho dù bạn chọn sử dụng plugin có sẵn, thêm mã vào file functions.php của theme, hay tạo một plugin riêng, hy vọng bài viết này đã cung cấp cho bạn những kiến thức và kỹ năng cần thiết để bắt đầu. Chúc bạn thành công!