Custom Fields cho thông tin thành viên WordPress

Ngày đăng: 19/04/2020
Cập nhật: 05/03/2021

Mặc dù có nhiều Plugin có thể giúp bạn thực hiện việc thêm các trường (field) vào cho mục thành viên, tuy nhiên bạn vẫn nên hạn chế sử dụng Plugin ở mức nhiều nhất có thể.

Một số trường mặc định của WordPress

Một số trường mình thêm vào để người dùng thêm link mạng xã hội.

Để làm việc này mình sẽ sử dụng các Hook Action user_profile. Đầu tiên bạn mở file functions.php và add thêm vào 2 hook như sau:

add_action( 'show_user_profile', 'social_fields' );
add_action( 'edit_user_profile', 'social_fields' );

Giải thích:

  • show_user_profile nó chỉ móc vào cái trang của người dùng hiện tại đăng nhập. Ví dụ mình vào phần user của mình sẽ thấy các trường mình add, còn vào của người ta thì không có.
  • edit_user_profile để hiển thị tất cả.
  • social_fields là một hàm chứa các trường mà mình muốn add vào.

Ví dụ về đoạn code sau:

function social_fields( $user ) { ?>

  <h3>Link mạng xã hội</h3>
   <table class="form-table">
     <tbody>
       <tr>
         <th><label for="facebook">Facebook</label></th>
         <td>
           <input type="text" name="facebook" id="facebook" value="<?php echo esc_attr( get_the_author_meta( 'facebook', $user->ID ) ); ?>" class="regular-text" /><br />
           <span class="description">Nhập link trang cá nhân Facebook.</span>
         </td>
      </tr>
 
      <tr>
        <th><label for="twitter">Twitter</label></th>
        <td>
          <input type="text" name="twitter" id="twitter" value="<?php echo esc_attr( get_the_author_meta( 'twitter', $user->ID ) ); ?>" class="regular-text" /><br />
          <span class="description">Nhập link trang cá nhân Twitter.</span>
        </td>
     </tr>
 
     <tr>
       <th><label for="pinterest">Pinterest</label></th>
       <td>
         <input type="text" name="pinterest" id="pinterest" value="<?php echo esc_attr( get_the_author_meta( 'pinterest', $user->ID ) ); ?>" class="regular-text" /><br />
         <span class="description">Nhập link trang cá nhân Pinterest.</span>
       </td>
     </tr>
 
     <tr>
       <th><label for="youtube">Youtube</label></th>
       <td>
         <input type="text" name="youtube" id="youtube" value="<?php echo esc_attr( get_the_author_meta( 'youtube', $user->ID ) ); ?>" class="regular-text" /><br />
         <span class="description">Nhập link trang cá nhân Youtube.</span>
       </td>
     </tr>
 
     <tr>
       <th><label for="linkedin">Linkedin</label></th>
       <td>
         <input type="text" name="linkedin" id="linkedin" value="<?php echo esc_attr( get_the_author_meta( 'linkedin', $user->ID ) ); ?>" class="regular-text" /><br />
         <span class="description">Nhập link trang cá nhân Linkedin.</span>
       </td>
     </tr>

 <tbody>
 </table>
<?php }

Bạn lưu ý là hàm này mình có cho truyền vào một biến $user, biến này sẽ dùng trong câu lệnh echo esc_attr( get_the_author_meta( ‘name-fields’, $user->ID ) ); để lấy ra giá trị đã lưu. Nếu bạn không làm như thế này thì sau khi lưu bạn sẽ không thấy value của các trường được hiển thị nữa vì bạn không lấy. Các name-fields đó chính là cái tên của trường, bạn phải nhập chính xác với tên trường để nó lấy dữ liệu lên chính xác nhé. Cái hàm esc_attr là một hàm để mình loại bỏ các ký tự không cần thiết để không bị hỏng cấu trúc HTML thôi.

Về cấu trúc thì các bạn có thể Design tùy ý nhưng phải làm sao để nó phù hợp với giao diện của WP-Admin. bạn cũng nên chú ý để tên và id cho các trường này tránh trùng lặp với các name meta của WP hay Plugin khác nhé. Khuyên bạn là nên thêm tiền tố cho nó, chẳng hạn như fu_facebook

Bây giờ bạn có thể thấy các trường này hiển thị trong mục thành viên rồi đấy. Việc tiếp theo là lưu nó xuống cơ sở dữ liệu khi nhấn cập nhật.

Để lưu các trường này xuống cơ sở dữ liệu bạn cũng cần sử dụng 2 hook như personal_options_update edit_user_profile_update tương tự như 2 hook trên thì nếu bạn chỉ sử dụng hook personal_options_update thì bạn chỉ có thể update được cái của mình thôi, còn nếu sử dụng thêm edit_user_profile_update thì bạn có thể update được cho người khác nữa. Ở đây mình dùng cả 2.

add_action( 'personal_options_update', 'save_social_fields' );
add_action( 'edit_user_profile_update', 'save_social_fields' );

function save_social_fields( $user_id ) {

if ( !current_user_can( 'edit_user', $user_id ) )
  return false;
  update_usermeta( $user_id, 'facebook', $_POST['facebook'] );
  update_usermeta( $user_id, 'twitter', $_POST['twitter'] );
  update_usermeta( $user_id, 'pinterest', $_POST['pinterest'] );
  update_usermeta( $user_id, 'youtube', $_POST['youtube'] );
  update_usermeta( $user_id, 'linkedin', $_POST['linkedin'] );
}

Với hàm này bạn cần kiểm tra liệu người dùng này có quyền edit user hay không bằng cách sử dụng hàm current_user_can. nếu không có quyền thì trả về kết quả là false để dừng lại, còn nếu có thì tiếp tục sử dụng hàm update_usermeta để truyền các giá trị vào. Ở đây bạn cần truyền 3 tham số là id người dùng, metaname là tên và id của input, và biến Post lấy name của input. Biến $user_id nó sẽ tự lấy nhé.

Các trường này sau khi lưu sẽ được lưu vào trong bảng usermeta của WordPress. Vì vậy nên để lấy nó ra bạn cần dùng hàm the_author_meta(). trền cái tên meta và id user cần lấy là được.

<?php the_author_meta( 'facebook', $id_user );?>