Hướng dẫn tạo dynamic Menu wordpress

Trong bài hôm nay mình hướng dẫn các bạn cách tạo menu động hiển thị dựa theo trạng thái login và cho người dùng truy cập. Cách duy nhất là hiển thị các menu khác nhau cho user đăng nhập, sử dụng template tag để kiểm tra, nhưng trước tiên bạn cần chuẩn bị 2 menu, một menu sẽ hiển thị cho logged user và menu kia cho người viếng thăm đọc nội dung thông thường.

register_nav_menus( array(
  'logged-in'  => __( 'Logged-in Menu Area',  'yourtheme' ),
  'visitor' => __( 'Visitor Menu Area', 'yourtheme' ),
));

Cách đơn giản nhất, bạn sử dụng hàm is_user_logged_in() để switch trực tiếp. Gọi hàm chèn menu wp_nav_menu vào trong file header.php

if (is_user_logged_in()){
  wp_nav_menu( array(
    'menu'            => 'Logged In Menu',
    'container_class' => 'logged-in-menu',
    'theme_location'  => 'logged-in'
  ));
} else {
  wp_nav_menu( array(
    'menu'            => 'Visitor Menu',
    'container_class' => 'visitor-menu',
    'theme_location'  => 'visitor'
  ));
};

Tuy có cách khác không cần thay đổi cấu trúc này, tư duy hướng lập trình nâng cấp code đễ dàng, bạn có thể sử dụng hook wp_nav_menu_args, để sửa lại tham số của hàm wp_nav_menu. Đăng ký thêm menu bằng cách clone từ các menu đã tạo trước đó. Chúng ta có hàm lấy danh sách các menu có đăng ký trong theme của bạn bởi hàm register_nav_menu.

// we're cloning existing theme_locations and creating _loggedin ones. 
add_action( 'init', 'register_loggedin_menus', 9999 );
function register_loggedin_menus() {
  $default_menus = get_registered_nav_menus();
  $loggedin_menus = array();
  
  foreach ($default_menus as $slug => $name){
  $loggedin_menus[$slug . '_dmlu_loggedin'] = $name . ' Loggedin';
  }
  
  register_nav_menus(
	$loggedin_menus
  );
}

Kiểm tra nếu user logged-in, và nội dung menu tạo trong admin có gán vào theme_location mà bạn sẽ hiển thị thay thế menu cũ. Code trong hook wp_nav_menu_args vào file functions.php như sau:

// depending on the current menu arguments, if there exists a _loggedin theme location we're using that when user is logged in.
add_filter('wp_nav_menu_args', 'serve_different_menu');
function serve_different_menu($content){
 
	$loggedin_theme_location = $content['theme_location'] . '_dmlu_loggedin';
	$active_menu_locations = get_nav_menu_locations();
	
	if ( is_user_logged_in() && !empty($content['theme_location']) && $active_menu_locations[$loggedin_theme_location] != 0 && array_key_exists($loggedin_theme_location, $active_menu_locations) ) { 
		$content['theme_location'] = $content['theme_location'] . '_dmlu_loggedin';
		return $content;
	} else {
		return $content;
	}
}

Đó là cách sử lý cơ bản, tùy theo website bạn thiết kế, sẽ thay đổi code. Chúc bạn thành công.

Nếu bạn thấy bài viết này hữu ích, hãy chia sẻ với bạn bè bằng cách nhấn nút chia sẻ ở bên dưới. Theo dõi chúng tôi trên Twitter và Facebook