{"id":21834,"date":"2017-10-09T22:53:56","date_gmt":"2017-10-09T15:53:56","guid":{"rendered":"http:\/\/tom.ji42.com\/?p=21834"},"modified":"2017-10-09T22:53:56","modified_gmt":"2017-10-09T15:53:56","slug":"how-to-display-blog-post-meta-data-in-your-wordpress-themes","status":"publish","type":"post","link":"https:\/\/tom.tomwork.net\/?p=21834","title":{"rendered":"How to Display Blog Post Meta Data in Your WordPress Themes"},"content":{"rendered":"

Do you want to learn how to display post meta data in WordPress blog posts? Post meta data are relevant information about your blog post such as published date, category, author name, etc. In this article, we will show you how to display post meta data in WordPress posts.<\/p>\n

\"Displaying<\/p>\n

What is Post Meta Data in WordPress?<\/h4>\n

Post meta data is information about a post that is not part of the actual content. This includes information like post date, author,\u00a0categories and tags<\/a>, or custom taxonomies.<\/p>\n

<\/p>\n

\"Post<\/p>\n

Depending on your WordPress theme, this information can be displayed on different locations. For example, below post title,\u00a0after post content<\/a>, in a sidebar column, and more.<\/p>\n

This information helps your users learn more about the content they are viewing. If used correctly, post meta data can\u00a0increase page views<\/a>, improve user experience, and make your site look more professional.<\/p>\n

On the downside, too much meta data can make your website look messy.<\/p>\n

\"Messy<\/p>\n

Depending on your website, you can add or remove information and add\u00a0custom css styles<\/a>\u00a0to make it more useful.<\/p>\n

Let\u2019s take a look at how to display post meta data in WordPress.<\/p>\n

Note: This article requires basic understanding of how WordPress themes work. You\u2019ll also need to edit WordPress files. If you haven\u2019t done this before, then take a look at our guide on\u00a0how to copy and paste code in WordPress<\/a>.<\/p>\n

How WordPress Themes Display Post Meta Data?<\/h4>\n

There are multiple ways to display post meta data. Some themes have simpler code located below the post title.<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
By <?php the_author_posts_link(); ?> on <?php the_time(<\/code>'F jS, Y'<\/code>); ?>\u00a0 in <?php the_category(<\/code>', '<\/code>); ?> <?php edit_post_link(__(<\/code>'{Edit}'<\/code>), <\/code>''<\/code>); ?><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

This code simply displays author\u2019s name, post date, and category(s).<\/p>\n

Other themes may define their own\u00a0template tags<\/a>, functions, and classes to display post meta data. These functions are then called in the theme files responsible for displaying posts.<\/p>\n

Usually, you will find post meta data code in your theme\u2019s index.php, single.php, archive.php, and content templates.<\/p>\n

You can\u00a0create a child theme<\/a>\u00a0to override these theme files. If you are creating your own custom theme, then you can directly add or modify the code in your existing theme files.<\/p>\n

Let\u2019s take a look at some examples of how to display different post meta data in WordPress.<\/p>\n

How to Display or Hide Post Date in WordPress<\/h4>\n

To display the publish date of a post, you need to add this code to your theme.<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<p>This article was published on: <?php the_time(<\/code>'m\/j\/y g:i A'<\/code>) ?><\/p><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

Notice the characters inside\u00a0the_time<\/code>\u00a0function. These are called format characters, and they tell PHP how to format the date and time. To learn more, see our article on\u00a0how to change date and time format in WordPress<\/a>.<\/p>\n

\"Showing<\/p>\n

Want to remove dates from your WordPress posts? You\u2019ll need to locate the code with\u00a0the_time<\/code>\u00a0or\u00a0the_date<\/code>\u00a0functions in your theme files and delete those lines.<\/p>\n

How to Display Last Update Date for WordPress Posts<\/h4>\n

If you frequently update old articles on your website, then you may want to display the last updated date of your posts. This helps your content look fresh and attract readers who who may not read a post that was published years ago.<\/p>\n

Simply add the following code to your theme files where you want to display the last updated date:<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n
2<\/div>\n
3<\/div>\n
4<\/div>\n
5<\/div>\n
6<\/div>\n
7<\/div>\n
8<\/div>\n
9<\/div>\n<\/td>\n
\n
\n
$u_time<\/code> = get_the_time(<\/code>'U'<\/code>); <\/code><\/div>\n
$u_modified_time<\/code> = get_the_modified_time(<\/code>'U'<\/code>); <\/code><\/div>\n
if<\/code> (<\/code>$u_modified_time<\/code> >= <\/code>$u_time<\/code> + 86400) { <\/code><\/div>\n
echo<\/code> \"<p>Last modified on \"<\/code>; <\/code><\/div>\n
the_modified_time(<\/code>'F jS, Y'<\/code>); <\/code><\/div>\n
echo<\/code> \" at \"<\/code>; <\/code><\/div>\n
the_modified_time(); <\/code><\/div>\n
echo<\/code> \"<\/p> \"<\/code>; <\/code><\/div>\n
} <\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

\"Showing<\/p>\n

For alternate methods and more detailed instructions, see our guide on how to\u00a0display the last update date of your posts in WordPress<\/a>.<\/p>\n

How to Show or Hide Author Name in WordPress<\/h4>\n

To display\u00a0author name<\/a>, you need to add the following code to your theme files.<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<p>This article was written by <?php the_author(); ?><\/p><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

This code uses\u00a0the_author<\/code>\u00a0tag, which only displays author name.<\/p>\n

You can also display author name linked to all posts written by that author. Simply replace\u00a0the_author<\/code>\u00a0tag with the\u00a0the_author_posts_link<\/code>:<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<p>View all articles by <?php the_author_posts_link(); ?><\/p><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

\"Showing<\/p>\n

If you want to remove the author\u2019s name from your theme, then you will need to locate these tags in your theme files and delete them.<\/p>\n

How to Show or Hide Categories in WordPress Posts<\/h4>\n

To display\u00a0categories<\/a>, you need to add the following code to your theme files:<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<p>This post was filed under: <?php the_category(<\/code>', '<\/code>) ?><\/p><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

This code will display post categories separated by a comma. You can replace the comma with any character you want to use as a separator between category names.<\/p>\n

\"Showing<\/p>\n

Another way to display post categories is by displaying one category at a time. This gives you more control over styling.<\/p>\n

For example, you can add the following code to your WordPress theme files:<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n
2<\/div>\n
3<\/div>\n
4<\/div>\n
5<\/div>\n
6<\/div>\n<\/td>\n
\n
\n
<?php<\/code><\/div>\n
$categories<\/code> = get_the_category( <\/code>$post<\/code>->ID );<\/code><\/div>\n
foreach<\/code> ( <\/code>$categories<\/code> as<\/code> $category<\/code> ) {<\/code><\/div>\n
echo<\/code> '<span class=\"wpb-category\"><a href=\"'<\/code> . get_category_link( <\/code>$category<\/code>->term_id ) . <\/code>'\">'<\/code> .\u00a0 <\/code>$category<\/code>->name\u00a0 . <\/code>'<\/a><\/span>'<\/code>;<\/code><\/div>\n
}<\/code><\/div>\n
?><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

Now you can use\u00a0wpb-category<\/code>\u00a0class in your\u00a0custom CSS to style category<\/a>names.<\/p>\n

Want to remove category names from WordPress posts? You\u2019ll need to locate the line with\u00a0the_category<\/code>\u00a0tag in your theme files and delete it.<\/p>\n

How to Show or Hide Tags in WordPress Posts<\/h4>\n

To display post tags, you need to add the following code to your theme files:<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<p>Tags: <?php the_tags(); ?><\/p><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

This code will simply show all tags associated with the post separated by a comma. You can replace the comma with any character you want to use as a separator.<\/p>\n

For example, the following code will show tags separated by a slash.<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<?php the_tags( <\/code>'Tags: '<\/code>\/ <\/code>', '<\/code>, <\/code>'<br \/>'<\/code> ); ?><\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

As you can see, the_tags function accepts three parameters.<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
the_tags(<\/code>$before<\/code>, <\/code>$separator<\/code>, <\/code>$after<\/code>)<\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

You can use the before and after parameter to add any text or HTML you want to add. This allows you to add CSS classes, which you can later use to style tags in WordPress.<\/p>\n

Take a look at the following example:<\/p>\n

\n
\n\n\n\n
\n
1<\/div>\n<\/td>\n
\n
\n
<?php the_tags(<\/code>'<div class=\"wpb-tags\">Tags: '<\/code>, <\/code>'\u00a0 '<\/code>, <\/code>'<\/div>'<\/code>);<\/code><\/div>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n

\"Showing<\/p>\n

If you don\u2019t want to display tags before or after each post, then locate the line with\u00a0the_tags()<\/code>\u00a0code and delete it from your theme files.<\/p>\n

Doing More with Post Meta Data in WordPress<\/h4>\n

So far we showed you how to display or hide the basic default post meta data items. Theme developers can use the same basic template tags to display post meta data in many different ways.<\/p>\n

For example, you can use post meta data to display\u00a0author info box<\/a>, or\u00a0replace post date with relative dates<\/a>.<\/p>\n

Want to take it to the next level? Check out\u00a0custom fields<\/a>, which allow you to add your own meta data to WordPress posts. You can even create\u00a0custom meta boxes<\/a>\u00a0to easily add those custom fields.<\/p>\n

That\u2019s all for now.<\/p>\n","protected":false},"excerpt":{"rendered":"

Do you want to learn how to display post meta data in WordPress blog posts? Post meta data are relevant information about your blog post such as published date, category, author name, etc. In this article, we will show you how to display post meta data in WordPress posts. What is Post Meta Data in […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[13],"tags":[],"class_list":["post-21834","post","type-post","status-publish","format-standard","hentry","category-13"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p6cOVM-5Ga","_links":{"self":[{"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=\/wp\/v2\/posts\/21834","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=21834"}],"version-history":[{"count":1,"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=\/wp\/v2\/posts\/21834\/revisions"}],"predecessor-version":[{"id":21835,"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=\/wp\/v2\/posts\/21834\/revisions\/21835"}],"wp:attachment":[{"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=21834"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=21834"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tom.tomwork.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=21834"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}