Hướng dẫn custom post type trong wordpress sử dụng plugin toolset

Custom post type trong wordpress là 1 trong những kiến thức quan trọng mà một lập trình viên wordpress chắc chắn phải biết. Có rất nhiều cách để tạo post type trong wordpress nhưng hôm nay mình sẽ hướng dẫn cho các bạn sử dụng plugin toolset để tạo và quản lý custom post type.

1. Custom post type trong wordpress là gì ?

Mặt định khi cài wordpress lên các bạn sẽ thấy phần post (bài viết) và page (trang). 2 phần này có nhiệm vụ xuất bản nội dung, người ta gọi nó là post type.

Trường hợp 2 phần này chưa đủ đáp ứng nhu cầu của bạn, bạn muốn có thêm 1 phần là sản phẩm để úp sản phẩm của website thì bắt buộc phải tạo thêm 1 post type mới và khi đó phần sản phẩm này sẽ gọi là custom post type.

Custom post type thường được sử dụng trong trường hợp chúng ta muốn phát triên thêm chức năng cho website ví dụ:

• Khu vực để post sản phẩm (làm web shop)
• Khu vực để hiển thị dịch vụ (Web site dịch vụ, công ty)
• Khu vực để hiển thị dự án (Web bất động sản...)

Tài liệu về custom post type trong wordpress.

• Custom post type toàn tập của Thạch Phạm
• Custom post type của Freetuts
• Hướng dẫn custom post type trên trang chính của wordpress

* Phía trên là những tài liệu hướng dẫn custom post type wordpress bằng cách sự dụng code, còn hôm nay mình sẽ hướng dẫn các bạn dùng plugin toolset để làm việc đó.

2. Cài đặt, tổng quan về plugin toolset.

Đây là một trong những plugin mình thường xuyên dùng. Chức năng của nó không chỉ dùng để tạo custom post type mà đồng thời trong 1 plugin này các bạn có thể tạo: custom taxonomy, custom field, custom term field, custom user field...

Các vấn đề trên sẽ được giải quyết 1 cách dễ dàng thông qua 1 giao diện rất trực quan.

Cài đặt plugin toolset:

Cách thức cài đặt rất đơn giản, các bạn vào khu vực cài mới plugin tìm kiếm với tên là Toolset Types sau đó kết quả trả về như hình trên chọn đúng plugin và cài đặt như 1 plugin bình thường. Các bạn có thể download plugin tại đây.

Sau khi cài đặt các bạn sẽ thấy xuất hiện menu toolset trong admin như hình bên dưới là bạn đã cài đặt thành công.

Các bạn có thể thấy rất nhiều menu con như:

• Dạng bài viết - > Custom post type
• Thẻ taxonomy -> Custom taxonomy
• Các trường của bài viết -> Custom field
• Trường thuật ngữ -> Custom term field
• Trường dữ liệu người dùng -> Custom user field

Ở nội dùng bài này chúng ta sẽ đi tìm hiểu menu đầu tiên đó là Dạng bài viết hay là custompost type.

3. Tạo custom post type trong wordpress bằng plugin Toolset Type.

Giả sử khách hàng có yêu cầu 1 chức năng là dịch vụ bao gồm: Tên dịch vụ, ảnh đại diện, nội dung của dịch vụ. Để giải quyết vấn đề trên chúng ta cần đi tạo custom post type dịch vụ như sau:

Bước 1: Vào admin, duy chuyển đến menu toolset chọn menu Dạng bài viết (Đối với tiếng việt)

Bước 2: Click vào button thêm mới để tạo 1 custom post type mới và điền đẩy đủ các thông tin như hình bên dưới.

Ở phần Name and description các bạn có thể điền như hình trên, chú ý phần slug đây được xem là mã của post type này, nó sẽ dùng để lấy dữ liệu ra ngoài. Các bạn có thể thay đổi icon menu hiện trong admin để cho chuyên nghiệp.

Ở phần Các mục cần hiển thị khi chỉnh sửa. Đối với yêu cầu ban đầu phần dịch vụ sẽ có là: Tên dịch vụ, ảnh đại diện, nội dung dịch vụ. Vì thế chúng ta phải điều chỉnh phần này hợp với yêu cầu như sau.

Chúng ta chọn:

• Tiêu đề để làm phần tên dịch vụ,
• Trình soạn thảo để làm nội dung dịch vụ 
• Hình nhỏ để làm hình ảnh của dịch vụ.

Bước 3: Click vào lưu định dạng bài viết và quay lại kiểm tra kết quả.

Sau khi lưu, bên thanh menu của admin xuất hiện menu "Dịch vụ" là thành công.

4. Tạo custom post type sử dụng code

Ngoài sử dung plugin trên chúng ta có thể sử dụng code nha. Copy đoạn code này vào file functions.php của theme đang dùng nhé!

function tao_custom_post_type(){
    /*
     * Biến $label để chứa các text liên quan đến tên hiển thị của Post Type trong Admin
     */
    $label = array(
        'name' => 'Các sản phẩm', //Tên post type dạng số nhiều
        'singular_name' => 'Sản phẩm' //Tên post type dạng số ít
    );
 
    /*
     * Biến $args là những tham số quan trọng trong Post Type
     */
    $args = array(
        'labels' => $label, //Gọi các label trong biến $label ở trên
        'description' => 'Post type đăng sản phẩm', //Mô tả của post type
        'supports' => array(
            'title',
            'editor',
            'excerpt',
            'author',
            'thumbnail',
            'comments',
            'trackbacks',
            'revisions',
            'custom-fields'
        ), //Các tính năng được hỗ trợ trong post type
        'taxonomies' => array( 'category', 'post_tag' ), //Các taxonomy được phép sử dụng để phân loại nội dung
        'hierarchical' => false, //Cho phép phân cấp, nếu là false thì post type này giống như Post, true thì giống như Page
        'public' => true, //Kích hoạt post type
        'show_ui' => true, //Hiển thị khung quản trị như Post/Page
        'show_in_menu' => true, //Hiển thị trên Admin Menu (tay trái)
        'show_in_nav_menus' => true, //Hiển thị trong Appearance -> Menus
        'show_in_admin_bar' => true, //Hiển thị trên thanh Admin bar màu đen.
        'menu_position' => 5, //Thứ tự vị trí hiển thị trong menu (tay trái)
        'menu_icon' => '', //Đường dẫn tới icon sẽ hiển thị
        'can_export' => true, //Có thể export nội dung bằng Tools -> Export
        'has_archive' => true, //Cho phép lưu trữ (month, date, year)
        'exclude_from_search' => false, //Loại bỏ khỏi kết quả tìm kiếm
        'publicly_queryable' => true, //Hiển thị các tham số trong query, phải đặt true
        'capability_type' => 'post' //
    );
 
    register_post_type('sanpham', $args); //Tạo post type với slug tên là sanpham và các tham số trong biến $args ở trên
 
}
add_action('init', 'tao_custom_post_type');

5. Cách hiện thị nội dung của custom post type ra ngoài giao diện.

Cách đặt tên cho file hiển thị nội dung custom post type là: archive-{slug_postype}.php. Trong đó slug_postype tên slug của post type được đặt trong quá trình tạo post type. Ví dụ ở trường hợp custom post type dịch vụ thì tên file cần đặt là: archive-dich-vu.php

Nội dung của file archive-dich-vu.php sẽ là:

<?php get_header(); ?>
<div id="content">
	<?php if (have_posts()) : ?>
	<?php while (have_posts()) : the_post(); ?>
		<?php the_title(); ?>
	<?php endwhile; else : ?>
	<p>Không có dịch vụ nào</p>
	<?php endif; ?>
</div>
<?php get_footer(); ?>

Để xem nội dung post type chúng ta truy cập đường dẫn: domain.com/{slug_postype}. Trong trường hợp này để xem danh sách các dịch vụ chúng ta truy cập đường dẫn: domain.com/dich-vu

Hiển thị nội dung của custom post type tại 1 vị trí bất kỳ trên website.

Ví dụ: Hiển thị 5 dịch vụ mới nhất.

<div class="widget">
	<h3>Dịch vụ</h3>
	<ul>
		<?php $getposts = new WP_query(); $getposts->query('post_status=publish&showposts=5&post_type=dich-vu'); ?>
		<?php global $wp_query; $wp_query->in_the_loop = true; ?>
		<?php while ($getposts->have_posts()) : $getposts->the_post(); ?>
			<li>
				<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
			</li>
		<?php endwhile; wp_reset_postdata(); ?>
	</ul>
</div>

Ở ví dụ này:

• post_type=dich-vu đây là phần định nghĩa lấy ra các dịch vụ.
• showposts=5 lấy 5 dịch vụ mới nhất.

Ví dụ: Lấy 5 dịch vụ mới nhất có hình đại diện

<div class="widget">
	<h3>Dịch vụ</h3>
	<ul>
		<?php $getposts = new WP_query(); $getposts->query('post_status=publish&showposts=5&post_type=dich-vu'); ?>
		<?php global $wp_query; $wp_query->in_the_loop = true; ?>
		<?php while ($getposts->have_posts()) : $getposts->the_post(); ?>
			<li>
				<div class="img">
					<a href="<?php the_permalink(); ?>">
						<?php echo get_the_post_thumbnail( get_the_id(), 'full', array( 'class' =>'thumnail') ); ?>
					</a>
				</div>
				<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
			</li>
		<?php endwhile; wp_reset_postdata(); ?>
	</ul>
</div>

6. Tóm lại

Ở bài này mình đã giới thiệu cho các bạn khái niệm về custom post type trong wordpress, plugin toolset và cách sử dụng nó để tạo custom post type. Hy vọng với chút ít kiến thức này có thể giúp các bạn 1 phần trong trong quá trình học wordpress cũng như là lập trình theme wordpress.

Nếu còn thắc mắc gì về custom post type trong wordpress các bạn có thể cmt phía bên dưới để trao đổi thêm. Facebook của mình là Blog Huy Kira like để cùng học wordpress và nhận code wordpress miễn phí nhé!

Chào thân ái và quyết thắng!!!

Update:

Plugin hiện tại ko cho download free nữa mình có lưu 1 bản ở đây bạn nào cần thì download nhé => Download plugin toolset types