Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Code
  2. WordPress Plugins
Code

Tạo một Hệ thống thông báo trong WordPress, Phần 1

by
Difficulty:IntermediateLength:MediumLanguages:
This post is part of a series called Creating a Custom WordPress Messaging System.
Creating a Custom WordPress Messaging System, Part 2

Vietnamese (Tiếng Việt) translation by Dai Phong (you can also view the original English article)

Đầu năm nay, chúng ta đã làm việc trên loạt bài hướng dẫn khái quát tiến trình tạo các trang quản trị tuỳ biến trong WordPress. Tuy vậy, nó không là điều kiện tiên quyết cho những gì mà chúng ta sắp tìm hiểu, chúng ta có thể sẽ không cần phải xem lại nó.

Bên cạnh đó, WordPress còn cung cấp rất nhiều tính năng thông qua những hàm API của nó. Ví dụ, nếu bạn muốn làm việc trên những trang giới thiệu trong phần quản trị bằng cách chỉ tập trung vào các tuỳ chọn mà sẽ được hiện diện cho người dùng, thì bạn có thể làm điều đó bằng cách sử dụng Settings API.

Đồng thời có rất nhiều lợi thế cho việc lựa chọn API cụ thể này. Một số chúng bao gồm:

  • lọc dữ liệu (sanitization) và xác thực (validation)
  • phần tử menu tuỳ biến
  • các trang giới thiệu đơn giản trong phần quản trị
  • làm việc với các kiểu nhập liệu khác nhau
  • thông báo tự động dựa trên thành công hay thất bại
  • và nhiều hơn nữa

Nhưng cũng giống như chúng ta đã tìm hiểu về cách tạo các trang quản trị tuỳ biến, chúng ta còn có thể cài đặt một hệ thống cho phép chúng ta lập trình để thiết lập các thông báo tuỳ biến của chính mình, kiểu của chúng, khi nào và nơi nào để hiển thị chúng trong trang quản trị.

Vì vậy bằng việc tiếp tục với theme tương tự như đã đề cập trong loạt bài trước, chúng ta sẽ tìm hiểu cách tạo hệ thống thông báo tuỳ biến cho chính mình trong các trang quản trị. Để làm điều này, chúng ta sẽ tạo một plugin để minh hoạ các khái niệm, chúng ta sẽ đăng ký các hook tuỳ biến với WordPress, và chúng ta cũng sẽ xem xét cách cài đặt chúng.

Như tôi đã đề cập, bài hướng dẫn trước không phải là một yêu cầu bắt buộc cho loạt bài này, nhưng nếu bạn là người mới, thì vui lòng dành chút ít thời gian để xem lại loạt bài đầu tiên vì nó sẽ cung cấp cho bạn một ít cơ bản để định hướng cho những gì chúng ta sẽ làm sắp tới.

Với những gì đã nói ở trên, chúng ta hãy bắt đầu.

Những gì bạn sẽ cần cho loạt bài này

Nếu như bạn đã đọc các bài viết trước đây của tôi, bạn sẽ biết rằng tôi thích bắt đầu mỗi bài viết (hoặc loạt bài) bằng hai thứ:

  1. Cung cấp một danh sách các phần mềm mà bạn sẽ cần để bắt đầu.
  2. Cung cấp một lộ trình về nơi mà chúng ta đã đi qua vì vậy bạn có thể quyết định có muốn tiếp tục với loạt bài hay không.

Bây giờ chúng ta hãy bắt đầu.

Môi trường Phát triển của bạn

Nói một cách thông thường, điều này là những gì mà bạn sẽ cần để bắt đầu với dự án mà chúng ta sẽ xây dựng.

  • PHP 5.6.25
  • MySQL 5.6.28
  • Apache (hoặc Nginx nếu bạn rành về nó)
  • WordPress 4.6.1
  • Trình soạn thảo hay IDE của bạn

Nếu bạn tò mò về việc làm thế nào để tất cả những điều này kết hợp lại với nhau, thì tôi khuyên bạn nên đọc loạt bài này.

Tôi không cho rằng phần mềm này tốt hơn phần mềm khác bởi vì có rất nhiều tuỳ chọn, nhưng nếu bạn mới làm quen với những điều này thì tôi thành thật khuyên bạn sử dụng phiên bản miễn phí của MAMP. Nó tương thích với macOS và Windows vì vậy nó sẽ tương thích với nhiều thiết lập của bạn. Nó dễ sử dụng, dễ làm quen, và cung cấp mọi thứ mà bạn cần trong việc cài đặt.

Lộ trình của chúng ta

Với những gì đã nói, dưới đây là các phần của loạt bài:

  1. Trong hướng dẫn này, chúng ta sẽ đặt nền móng cơ bản cho plugin của chúng ta và những gì chúng ta cần để bắt đầu.
  2. Trong phần thứ hai, chúng ta sẽ nâng cấp plugin của chúng ta lên một mức độ cao hơn một chút bằng cách thêm một trang quản trị cơ bản của WordPress. Chúng ta cũng sẽ gọi một hook tuỳ biến mà chúng ta sẽ sử dụng, và chúng ta sẽ gắn nó lên server. Chúng ta cũng sẽ đặt nền móng cho Settings Messenger của chúng ta.
  3. Trong hướng dẫn tiếp theo, chúng ta sẽ bắt đầu cài đặt Settings Messenger của chúng ta bằng cách thêm hỗ trợ cho các thông báo lỗi và thành công cũng như khái quát một số điểm về bảo mật.
  4. Chúng ta sẽ gom tất cả mọi thứ lại với nhau, xem chúng hoạt động, và tạo plugin hoàn chỉnh để có thể tải về.

Lưu ý rằng mỗi bài hướng dẫn bao gồm các tập tin nguồn có thể tải về; tuy nhiên, chúng không hẳn là các tập tin hoàn chỉnh trong đó chúng có thể không bao gồm tài liệu hướng dẫn hoặc các lưu ý khác. Sau tất cả, bài viết của chúng ta sẽ xoay quanh những vấn đề đó.

Nhưng phiên bản hoàn chỉnh đã cung cấp sẽ bao gồm toàn bộ những điều đó.

Bắt đầu Plugin

Ngay bây giờ, chúng ta sẽ cần những thứ sau đây cho plugin của chúng ta:

  • một trang quản trị cơ bản
  • một phần tử menu dẫn chúng ta đến trang quản trị
  • một tập tin khởi động để bắt đầu plugin

Vì vậy hãy gom tất cả những phần này lại với nhau và làm cho chúng hoạt động.

1. Phần tử menu

Điều đầu tiên chúng ta muốn làm là giới thiệu tính năng mà sẽ thêm một phần tử menu con vào menu Options trong thanh menu điều hướng của WordPress.

Để làm điều này, chúng ta cần hai lớp và một tập tin: một lớp sẽ hiện thị menu con, một lớp sẽ hiện trị trang cho menu con đó, và một tập tin sẽ hiển thị nội dung của trang.

Trước khi làm điều này, tôi khuyên bạn nên tạo cấu trúc thư mục như sau:

The plugins directory structure

Điều này có nghĩa là thư mục admin sẽ có một thư mục con tên views. Thư mục admin sẽ có class-submenu.phpclass-submenu-page.php. Chúng ta sẽ nói về trang quản trị trong phần tiếp theo.

Trước tiên, hãy xem xét từng tập tin.

class-submenu.php

Lớp này có nhiệm vụ thêm phần tử menu vào trang tùy chọn:

Nếu bạn đã đọc về việc gọi hàm API trong Codex, bạn sẽ thấy rằng điều này sẽ tạo ra một phần tử menu ở trong menu Tools mà sẽ truy xuất thông qua "Tuts+ Custom Messages" và nó sẽ chứa một tiêu đề mà chúng ta sẽ thấy giây lát nữa.

Đồng thời lưu ý rằng có một phương thức init. Hàm này đăng ký add_options_page với hook admin_menu của WordPress do đó nó được đăng ký (và được hiển thị) một cách thích hợp trong quá trình hoạt động của trang WordPress.

Thứ hai, menu này có thể được truy xuất thông qu bất kỳ người nào với khả năng manage_options, và nó sẽ gọi phương thức kết xuất trên submenu_page nào thuộc về nó.

Có vấn đề gì chăng? Chưa trang cho menu con. Do đó hãy tạo lớp đó ngay bây giờ.

class-submenu-page.php

Code cho lớp này sẽ như sau:

Lớp Submenu_Page rất đơn giản. Tất cả những gì mà nó làm là hiển thị trang settings.php, chúng ta sẽ xem xét nó trong giây lát nữa.

Lưu ý rằng không phải tất cả các trang cho menu con sẽ đơn giản như thế này; tuy nhiên, sự phức tạp của plugin của chúng ta vẫn chưa cao. Chúng ta sẽ thấy điều đó trong bài viết tiếp theo.

2. Trang quản trị

Giống như Submenu_Page, trang thiết lập cũng đơn giản như vậy. Thực tế, nếu bạn quen với mã đánh dấu cơ bản, thì sẽ dễ dàng hiểu được một cách chính xác điều gì đang xảy ra:

Một cách ngắn gọn, điều này chỉ đơn giản là hiển thị một thông báo trong WordPress mà chúng ta sẽ không sử dụng trang này cho bất cứ điều gì khác ngoài hiển thị những thông báo tùy biến.

Sau tất cả, đó những gì chúng ta sẽ làm.

3. Làm cho nó hoạt động

Tại thời điểm này, chúng ta đã sẵn sàng thiết lập tập tin khởi động để làm cho plugin hoạt động. Dưới đây là tập khởi động cơ bản:

Lưu ý phần chú thích ở trên vòng lặp foreach. Mặc dù chúng ta đã khái quát về autoloading trong loạt bài trước, nhưng tôi không muốn giả định là bất kỳ ai cũng đã đọc loạt bài đó.

Một khi điều này đã được hiện xong, bạn sẽ có thể đăng nhập vào tài khoản WordPress của bạn, kích hoạt plugin, và xem màn hình dưới đây:

An example of the administration page

Nếu không, kiểm tra lại tất cả mã nguồn của bạn xem có giống với nguồn đính kèm bài viết này hay không.

Nếu không, hãy sửa lại những cái cần thiết và thử lại. Nếu phải thử nhiều lần, thì cũng đừng nên nản. Lập trình đôi khi có những tác vụ làm chúng ta cảm thấy nản lòng, đặc biệt khi bạn vừa mới bắt đầu.

Kết luận

Nếu bạn làm theo hầu hết những gì tôi làm đến thời điểm này, rất nhiều những thứ này có thể bạn đã quan với chúng. Nếu không, tôi rất sẵn lòng giúp đỡ bạn. Trong khi bạn đang chờ đợi cho bài hướng dẫn thứ hai, tôi khuyên bạn hãy tìm hiểu một số bài khác mà tôi đã xuất bản để có một sự hiểu biết về những gì tôi muốn khái quát và hướng dạy những khái niệm này.

Tôi cũng luôn sẵn lòng trả lời những câu hỏi thông qua phần bình luận, và bạn cũng có thể mạnh dạn xem blog của tôi và theo dõi tôi trên Twitter. Tôi thường nói về việc phát triển phần mềm bên trong WordPress cũng như những chủ đề liên quan.

Từ đây cho đến bài hướng dẫn tiếp tiếp theo, hãy nghiên cứu về code, tải về các tập tin, và xem cách nó chạy trên máy chủ cục bộ của bạn. Trong phần tiếp theo, tôi sẽ tiếp tục từ nơi mà chúng ta còn đang dang dở.

Nguồn tài nguyên

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.