Thêm trang mới vào trang my account trong woocommerce – wordpress

125
0

Woocommerce một plugin tạo trang bán hàng khá nỗi tiếng. Nó hỗ trợ đầy đủ mọi chức năng cần có của một trang bán hàng chuyên nguyên từ quản lý sản phẩm, đến thanh toán… và hơn hết có rất nhiều theme hỗ trợ plugin này.

Vấn đề tiếp theo Woocommerce cung cấp 1 trang my-account khá đầy đủ, nhưng ta muốn thêm một trang mới vào trong này ví dụ trang wishlist chẳng hạn. Bài này mình xin trình bày cách thêm mới một trang vào my-account mà không cần dùng plugin

Bước 1: Việc đầu tiên ta cần thêm trang đó vào menu trong my-account bằng cách dùng đoạn code bỏ vào functions.php của theme.

function my_custom_my_account_menu_items( $items ) {
		$items = array(
			'dashboard'         => __( 'Dashboard', 'woocommerce' ),
			'wishlist'         => __( 'My wishlist', 'woocommerce' ),
			'orders'            => __( 'Orders', 'woocommerce' ),
			'downloads'       => __( 'Downloads', 'woocommerce' ),
			'edit-address'    => __( 'Addresses', 'woocommerce' ),
			'payment-methods' => __( 'Payment Methods', 'woocommerce' ),
			'edit-account'      => __( 'Edit Account', 'woocommerce' ),
			'customer-logout'   => __( 'Logout', 'woocommerce' ),
		);

		return $items;
	}
	add_filter( 'woocommerce_account_menu_items', 'my_custom_my_account_menu_items' );

Với đoạn code này ta có thể thêm được bất cứ mục nào vào menu trong my-account.

Bước Tiếp theo ta cần tạo trang để hiển thị nội dung bằng cách dùng đoạn code này.

function my_custom_endpoints() {
		add_rewrite_endpoint( 'wishlist', EP_ROOT | EP_PAGES );
	}

	add_action( 'init', 'my_custom_endpoints' );

	function my_custom_query_vars( $vars ) {
		$vars[] = 'wishlist';

		return $vars;
	}

	add_filter( 'query_vars', 'my_custom_query_vars', 0 );

	function my_custom_flush_rewrite_rules() {
		flush_rewrite_rules();
	}

	add_action( 'after_switch_theme', 'my_custom_flush_rewrite_rules' );

	function my_custom_endpoint_content() {
		include 'woocommerce/myaccount/wishlist.php'; 
	}

	add_action( 'woocommerce_account_wishlist_endpoint', 'my_custom_endpoint_content' );

Chú ý các dòng bôi đỏ ở 2 đoạn code trên đó là tên hiển thị ngoài menu và tên file chứa dữ liệu. Việc tiếp theo ta cần tạo file wishlist.php ngay trong thư mục myaccount của woocommerce. Còn việc custom woocommerce bạn chỉ cần copy thư mục templates trong plugin woocomerce bỏ vào thư mục góc của theme bạn đang sử dụng và đổi tên thanh woocommerce là được.

Và đây là thành quả:

Đối nét về Thắng Nguyễn

Xin Chào, Mình là Nguyễn Việt Thắng người sáng lập và quản lý trang https://iamgvt.com
Mình sinh năm 1994, Đam mê thích học hỏi khám phá và chia sẻ những thứ mình học được. Tham gia vào MMO cũng được gần 1 năm.

| Website | Facebook | Twitter

Share on facebook
Facebook
Share on google
Google+
Share on twitter
Twitter
Share on linkedin
LinkedIn

Viết một bình luận