Sử dụng Post Formats trong WordPress

Chào mọi người, hôm nay mình muốn giới thiệu một tính năng cũng khá hay của WordPress tuy nhiên về phần này ít được mọi người chú ý đến, thường sẽ sử dụng cho một theme blog cá nhân, chia sẽ kinh nghiệm và cho doanh nghiệp… đó là Post Formats trong WordPress

Sử dụng Post Formats

Trong lúc trình bày bài viết, ở mỗi định dạng, kiểu bài viết ta có thể sử dụng được icon khác nhau tạo được sự đa dạng, sáng tạo cũng như làm cho theme của chúng ta thêm sinh động và hấp dẫn người xem hơn.

Demo Post Formats trong WordPress

Demo Post Formats trong WordPress

Như hình trên bạn có thể thấy, nếu bài viết chia sẻ về photo thì là biểu tượng icon photo, bài viết chia sẻ audio thì biểu tượng là một audio… rất nhiều kiểu khác nữa cho bạn định dạng, đó là Post Formats trong WordPress, nó tạo cho một sự đặc sắc riêng cho theme của bạn.

Post Formats được tích hợp sẵn trong WordPress, và bạn khai báo, sử dụng bằng cách vào file functions.php của theme đang sử dụng, gõ đoạn code sau vào:

     add_theme_support('post-formats', array( 'aside', 'chat', 'gallery', 'image', 'link', 'quote', 'status', 'video', 'audio'));

Bao gồm các dạng: Standard, Gallery, Aside, Image, Status, Quote, Video, Audio, Chat. Chắc các bạn cũng hình dung ra các kiều và cách đặt tên của nó.

Đây là nói với WordPress là chúng ta đã sử dụng tính năng Post Formats, việc này cũng sẽ làm cho trong phần soạn bài viết cho một tùy chọn cho bạn với tất cả các thuộc tính trên.

Menu option Post Formats trong admin

Menu option Post Formats trong admin

Đến đây bạn vào post thử vài bài để test chức năng này, sau đó bạn debug trong firebug của firefox ta thấy được, phát sinh nhiều class tương ứng.

Các class CSS trong Post Formats WordPress

Các class CSS trong Post Formats WordPress

Áp dụng điều này thì các bạn dễ dàng qui định cho nó một kiểu trình bày tương ưng với những gì mình đã khai báo! Bạn có thể qui định mà khác nhau, tạo các icon khác nhau… bằng CSS

.format-audio .post-icon  {
	background-image: url(images/icon-audio.png);
}
.format-gallery .post-icon {
	background-image: url(images/icon-gallery.png);
}
.format-link .post-icon {
	background-image: url(images/icon-link.png);
}
.format-quote .post-icon {
	background-image: url(images/icon-quote.png);
}
.format-status .post-icon {
	background-image: url(images/icon-status.png);
}
.format-aside .post-icon {
	background-image: url(images/icon-aside.png);
}
.format-video .post-icon {
	background-image: url(images/icon-video.png);
}
.format-image .post-icon {
	background-image: url(images/icon-image.png);
}
.format-chat .post-icon {
	background-image: url(images/icon-chat.png);
}
Cách trình bày Post Formats

Trên là một ví dụ về qui định cách thể hiện Icon bạn có thể phát triển ra nhiều sự khác biệt khác nữa! Lúc này mở rộng thêm về cách bạn bạn tùy chỉnh sự trình bày phân loại theo Post Formats

	if (has_post_format('aside')) {
		 //display aside post
	} elseif (has_post_format('chat')) {
		 //display chat post
	} elseif (has_post_format('gallery')) {
		 //display gallery post
	} elseif (has_post_format('image')) {
		 //display image post
	} elseif (has_post_format('link')) {
		 //display link post
	} elseif (has_post_format('quote')) {
		 //display quote post
	} elseif (has_post_format('status')) {
		 //display status post
	} elseif (has_post_format('video')) {
			 //display video post
	} else {
		 //display standard post
	}

Sử dụng vòng lặp loop WordPress có sử dụng Post Formats

if (have_posts()) :
	while (have_posts()) : the_post();
		if(!get_post_format()) {
			get_template_part('format', 'standard');
		} else {
			get_template_part('format', get_post_format());
		}
	endwhile;
endif;

Trong mỗi phần có nét đặc trưng riêng, ví dụ ở audio thì hiển nhiên có phần nhúng file âm thanh, video cũng vậy, thế bạn sẽ tạo ra các Custom Fields WordPress cho việc nhập file nguồn.

Sau đó qui định về các vòng loop cho nó chuyên nghiệp hơn tí chẳng hạn.

<!--
        <?php $post_format = bcdonline_get('post_format'); ?>
	
	<?php if($post_format == 'quote' || has_post_format( 'quote' )) {
		get_template_part( 'includes/loop-quote');
	} elseif($post_format == 'audio' || has_post_format( 'audio' )) {
		get_template_part( 'includes/loop-audio');
	} elseif($post_format == 'video' || has_post_format( 'video' )) {
		get_template_part( 'includes/loop-video');
	} elseif($post_format == 'image' || has_post_format( 'image' )) {
		get_template_part( 'includes/loop-image');
	} else {
		get_template_part( 'includes/loop-default');
	} ?>

-->

Hiển nhiên bcdonline_get là hàm viết ngoài, phần này chỉ là mở rộng bạn nào có quan tâm thì ngâm cú thêm! 😀

Kết luận: Vậy coi như mình đã hoàn chỉnh xong phần Sử dụng Post Formats trong WordPress có gì góp ý thì comment nha pà con! 😀

Wordpress Post Formats

WordPress Post Formats

Nguồn: http://codex.wordpress.org/Post_Formats

VN:F [1.9.22_1171]
Rating: 9.8/10 (4 votes cast)
Sử dụng Post Formats trong WordPress, 9.8 out of 10 based on 4 ratings
Share This