Tạo menu và form nhập liệu vào database trong control panel admin WordPress

Tiếp nối câu chuyện về Plugin, bạn không thể tạo ra một plugin “mù” tức là không cho người dùng cài đặt bất cứ gì được, điều này sẽ làm họ khó chịu, mà cũng chẳng ai làm như vậy cả. Tuy nhiên vẫn có một số Plugin không cần hiển thị tùy chọn nhưng những plugin đó là đặt biệt rồi. Trong bài viết này mình sẽ chia sẻ với bạn cách để tạo ra menu đồng thời tạo ra các page và form để nhập liệu và lưu vào cơ sở dữ liệu của WordPress.

Tạo menu trong control panel admin WordPress

Bạn thường thấy các Plugin sau khi được kích hoạt thường hiện ra những menu riêng của nó trên control panel admin của bạn, để làm được điều này nó phải sử dụng hook này: add_action('admin_menu', 'functions_name'); và trong hàm thì có hai hàm khác được gọi là add_menu_page() để thêm các menu cha và add_submenu_page() để thêm các menu con. Code mẫu như sau:

add_action('admin_menu', 'random_post_setup_menu');
function random_post_setup_menu(){
      add_menu_page( 'Cài đặt random post', 'Random Post', 'manage_options','main-plugin-tdc', 'cpanel_control',plugins_url().'/tuandc-plugin/images/icon.png', 6 ); 
      add_submenu_page( 'main-plugin-tdc', 'Cài đặt số hiển thị', 'Cài đặt', 'manage_options', 'settings-plugin-tdc', 'cpanel_control_tdc_setting');
}

• Add_action ở đây sử dụng là admin_menu, hook này sẽ móc hàm chứa các hàm menu bên dưới.
• Add_menu_page bao gồm các thuộc tính như:
  • $page_title: Tiêu đề hiển thị trên trang.
  • $menu_title: Tiêu đề hiển thị trên menu.
  • $capability: Quyền hạn truy cập. Bạn có thể xem chi tiết tại đây.
  • $menu_slug: Slug trên đường dẫn, cũng có vai trò như ID, bạn lưu ý không đặt trùng.
  • $function: Hàm nó sẽ thực thi vào page.
  • $icon_url: Đường dẫn đến cái Icon sẽ hiển thị.
  • $position: Vị trí menu xuất hiện.
• Add_submenu_page cũng tương tự, tuy nhiên nó có thêm một thuộc tính là $parent_slug tức là cái slug của thằng menu_page. Tuy nhiên với hàm này bạn lưu ý là không có icon và vị trí nhé:
  • $parent_slug: slug của menu_page.
  • $page_title: Tương tự.
  • $menu_title: Tương tự.
  • $capability: Tương tự.
  • $menu_slug: Tương tự.
  • $function: Tương tự.

Kết quả sau khi add menu vào

Tạo form nhập liệu trong control panel admin WordPress

Bây giờ mình đã có menu, việc tiếp theo là mình sẽ tạo ra hai hàm, hàm 1 dành cho menu chính và hàm 2 dùng cho menu phụ.

function cpanel_control(){ echo "<h1>Chào mừng bạn đến với Plugin</h1>";}
function  cpanel_control_tdc_setting(){ echo "<h1>Đây là trang cài đặt của Plugin</h1>";}

Bạn lưu lại và thử F5 lại xem kết quả.

Tiếp theo mình sẽ viết một form nhập liệu và lưu và cơ sở dữ liệu của WordPress. Mình sẽ viết ở hàm thứ hai, code như sau:

function  cpanel_control_tdc_setting(){ 
   echo "<h1>Đây là trang cài đặt của Plugin</h1>";?>
   <div class="wrap">
       <h2>Đặt số bài hiển thị của bạn</h2>
       <form method="post" action="options.php">
          <?php wp_nonce_field('update-options') ?>
          <p><strong>Số bài:</strong><br />
          <input type="text" name="rand-tdc-num" size="45" value="<?php echo get_option('rand-tdc-num'); ?>" /></p>
          <p><input type="submit" name="submit" class="button-primary" value="Lưu cài đặt" /></p>
          <input type="hidden" name="action" value="update" />
          <input type="hidden" name="page_options" value="rand-tdc-num" />
        </form>
    </div> 
<?php}

Trong hàm trên bạn cần chú ý đến những cái sau:

• action="options.php" để chỉ dữ liệu sẽ được gửi tới file này để xử lý.
• <?php wp_nonce_field('update-options') ?>: nó sẽ sinh ra các input để hoạt động. Cái này bạn tìm hiểu về nonce field trong wordpress sẽ hiểu hơn nhé.
• <?php echo get_option('rand-tdc-num'); ?>: Cái này đơn giản là nó sẽ lấy lên lại giá trị đã lưu và hiển thị lên textbox thôi.
• input có name action sẽ đưa một giá trị là update, và input name page_options sẽ đưa một cái giá trị vào database như một cái tên trường vậy.

Để sử dụng giá trị này bạn chỉ cần gọi hàm get_option và truyền vào tên trường được truyền trong cái input có name là page_options.

Kết hợp với bài Hướng dẫn tạo một Plugin đơn giản bằng WordPress, mình đã đưa ra một Plugin cơ bản hoàn chỉnh.