{"id":137644,"date":"2015-03-06T08:00:25","date_gmt":"2015-03-06T13:00:25","guid":{"rendered":"http:\/\/premium.wpmudev.org\/blog\/?p=137644"},"modified":"2015-03-04T00:09:26","modified_gmt":"2015-03-04T05:09:26","slug":"creating-content-taxonomies-and-fields","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/creating-content-taxonomies-and-fields\/","title":{"rendered":"Creating Custom Content in WordPress: Taxonomies and Fields"},"content":{"rendered":"<h2>In the <a title=\"Creating Custom Content in WordPress: Custom Post Types\" href=\"https:\/\/wpmudev.com\/blog\/creating-content-custom-post-types\/\" target=\"_blank\" rel=\"noopener\">first part\u00a0of this two-part series<\/a>, we explored the three different types of custom content you can create with WordPress and looked at the uses of each of them.<\/h2>\n<p>These are:<\/p>\n<ul>\n<li>Custom posts<\/li>\n<li>Custom taxonomies<\/li>\n<li>Custom fields<\/li>\n<\/ul>\n<p>That post also looked at custom post types in more detail, explaining how to create them and display them on your site.<\/p>\n<p>In this second and final part of the series, I&#8217;ll move on to custom taxonomies and custom fields: How to create each of them either using a plugin or by coding your own, and how to display them on your site&#8217;s front-end. Let&#8217;s start with custom taxonomies.<!--more--><\/p>\n<h3>Creating a Custom Taxonomy<\/h3>\n<p>As with custom post types, you can either use a plugin to create a custom taxonomy or code your own in your theme or (even better) write a plugin. The plugins you can use to do this are the same as for\u00a0custom post types:<\/p>\n<ul>\n<li><strong><a href=\"https:\/\/github.com\/wpmudev\/custompress\" rel=\"noopener\" target=\"_blank\">CustomPress<\/a><\/strong> gives\u00a0you an interface for creating custom post types, taxonomies, and custom fields and is very user-friendly. If you want to create multiple\u00a0types of custom content, this saves you installing more than one plugin.<\/li>\n<li><strong><a href=\"https:\/\/wordpress.org\/plugins\/custom-post-type-ui\/\" target=\"_blank\">Custom Post Type UI<\/a><\/strong> is the most popular free plugin for adding custom\u00a0post types and taxonomies on the WordPress plugin repository. It lets you add post types and taxonomies, but not custom fields. The interface isn&#8217;t quite as user-friendly as with CustomPress, with more technical terminology for you to get your head around, but it\u00a0does make the process easier.<\/li>\n<\/ul>\n<p>If you want to know more about\u00a0plugins to help you create custom content, see our review of\u00a0<a href=\"https:\/\/wpmudev.com\/blog\/top-wordpress-cms-plugins-reviewed\/\" target=\"_blank\">the best CMS plugins<\/a>.<\/p>\n<p>But if you&#8217;re confident enough to code your own custom\u00a0taxonomies, here&#8217;s how you do it.<\/p>\n<h4>Coding a Custom Taxonomy<\/h4>\n<p>Coding a custom taxonomy isn&#8217;t too different from coding a custom post type: WordPress gives you the <code><a href=\"http:\/\/codex.wordpress.org\/Function_Reference\/register_taxonomy\" target=\"_blank\">register_taxonomy()<\/a><\/code>\u00a0function to do this which you also attach to the <code>init<\/code>\u00a0hook.<\/p>\n<p>You can either add your code to your theme&#8217;s functions file or you can create a separate plugin. It&#8217;s better to create a plugin as then if you change your theme in the future you won&#8217;t lose your taxonomy. So that&#8217;s what we&#8217;ll do here.<\/p>\n<p>Start by creating an empty file called <code>taxonomies.php<\/code> and saving it to the plugins\u00a0folder in your <code>wp-content<\/code> directory.<\/p>\n<p>Now open your file in a code editor and add the following to it:<\/p>\n<div class=\"gist\" data-gist=\"71f771fac7f2ca17435469ef57b55679\" data-gist-file=\"1502 Custom Tax plugin opener\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/71f771fac7f2ca17435469ef57b55679.js?file=1502+Custom+Tax+plugin+opener\">Loading gist 71f771fac7f2ca17435469ef57b55679<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>This tells WordPress what your plugin is called and provides a description which you&#8217;ll see when you activate the plugin later.<\/p>\n<p>Now below the line which reads *\/ and above the ?&gt; line, add this code:<\/p>\n<div class=\"gist\" data-gist=\"cf8e8d31d110437418bfd9596d9a8cca\" data-gist-file=\"1502 Custom Tax container function\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/cf8e8d31d110437418bfd9596d9a8cca.js?file=1502+Custom+Tax+container+function\">Loading gist cf8e8d31d110437418bfd9596d9a8cca<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>This creates an empty function that will contain the code for your taxonomy and attaches it to the <code>init<\/code> hook. Attaching it to a hook-like this makes sure that WordPress runs your function at the right time: without it, nothing will happen.<\/p>\n<p>Now, inside the curly braces, add this:<\/p>\n<div class=\"gist\" data-gist=\"6dda14ee1851947ed55eeed353a8ebb6\" data-gist-file=\"1502 Custom tax internal function\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/6dda14ee1851947ed55eeed353a8ebb6.js?file=1502+Custom+tax+internal+function\">Loading gist 6dda14ee1851947ed55eeed353a8ebb6<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>Let&#8217;s work through that code to understand better what it does.<\/p>\n<p>First, it creates a set of labels for your taxonomy which will be used in\u00a0the admin screens, on links, buttons and page titles. Next it uses the <code>register_taxonomy()<\/code> function to register your taxonomy, with these parameters:<\/p>\n<ul>\n<li>The name of the taxonomy, <code>productcat<\/code> &#8211; you need this for your taxonomy to work.<\/li>\n<li>The post type your taxonomy will apply to. Here I&#8217;ve specified this as <code>product<\/code>, but you could use your taxonomy with more than one post type (including built-in post types like posts, pages, and attachments) by including them all in an array.<\/li>\n<li><code>hierarchical<\/code>: set this to <code>true<\/code> for your taxonomy to behave like categories and be hierarchical. If you want it to not be hierarchical, like tags, set it to <code>false<\/code>.<\/li>\n<li><code>labels<\/code>: here you&#8217;re telling WordPress to use the labels already defined: setting this to <code>true<\/code> gives you more flexibility if you want to <a href=\"https:\/\/wpmudev.com\/blog\/creating-custom-queries-wordpress\/\" target=\"_blank\">write a custom\u00a0query<\/a> to find products with a given taxonomy term.<\/li>\n<li><code>show_admin_column<\/code>: setting this to true means that when you display a list of your products in the WordPress admin, the taxonomy will have a column for you to see which taxonomy terms apply to which products. I&#8217;ll show you what this looks like shortly.<\/li>\n<\/ul>\n<p>Now save your file. The entire plugin will look like this:<\/p>\n<div class=\"gist\" data-gist=\"76e8de2131a47c81f8a05a817841383b\" data-gist-file=\"1502 Custom tax whole plugin\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/76e8de2131a47c81f8a05a817841383b.js?file=1502+Custom+tax+whole+plugin\">Loading gist 76e8de2131a47c81f8a05a817841383b<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>Now that your plugin is complete you need to activate it. In the WordPress admin, go to <strong>Plugins -&gt; Installed Plugins<\/strong> to see your plugin listed:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-ratio-large wp-image-137649\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/activate-taxonomy-plugin-700x106.png\" alt=\"activate-taxonomy-plugin\" width=\"700\" height=\"106\" \/><\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-right cgrid-col-span-2\">\n<div class=\"cgrid-col-wide-right\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-full wp-image-137650\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/product-categories-in-admin-menu.png\" alt=\"Product categories\" width=\"170\" height=\"191\" \/><\/div>\n<\/div>\n<\/div>\n<p>Click the <strong>Activate<\/strong> Link to activate your plugin. You&#8217;ll now see that when you click on <strong>Products<\/strong> in your admin menu, the new taxonomy will be displayed:<\/p>\n<div class=\"image-grid cgrid-row\"><\/div>\n<p>Now all you need to do is add some product categories in the same way as you would add normal categories. You&#8217;ll then be able to select one or more of them every time you create a product.<\/p>\n<p><em>Note: Your new taxonomy is not a category, instead it&#8217;s a taxonomy in the same way\u00a0as &#8216;category&#8217; is. To use it you&#8217;ll have to add terms. Your taxonomy&#8217;s terms (i.e. the product categories you add) are similar to categories themselves, which are terms in the &#8216;category&#8217; taxonomy.<\/em><\/p>\n<h3>Displaying Taxonomy Term Archives on Your Site<\/h3>\n<p>Once you&#8217;ve added some terms to your taxonomy, you&#8217;ll need to display a list of products with each term on your site.<\/p>\n<h4>Refreshing Permalinks<\/h4>\n<p>WordPress won&#8217;t display the archives for your taxonomy term unless you refresh the permalinks settings.<\/p>\n<ol>\n<li>In the WordPress admin, go to <strong>Settings &gt; Permalinks<\/strong>.<\/li>\n<li>Check that the &#8216;post name&#8217; radio button is selected.<\/li>\n<li>Click on the <strong>Save Changes<\/strong> button.<\/li>\n<\/ol>\n<p>Now WordPress will be able to generate\u00a0the correct URLs for your taxonomy terms.<\/p>\n<p><em>Note: you only need to do this once after creating the taxonomy, not each time you add a term.<\/em><\/p>\n<h4>Adding Taxonomy Term Archives to the Navigation Menu<\/h4>\n<p>Adding archive pages for your taxonomy to the navigation menu is easier than adding post type archives (as we did in the last part of this series). Follow these steps:<\/p>\n<ol>\n<li>In the WordPress admin, go to <strong>Appearance &gt; Menus<\/strong>.<\/li>\n<li>On the left of the screen, you&#8217;ll see a list of content types you can add to your menu. One of these will be &#8216;Product Categories&#8217; (if it isn&#8217;t visible, click on the <strong>Screen Options<\/strong> tab at the top right of the screen then tick the checkbox for product categories).<\/li>\n<li>Click on <strong>Product Categories<\/strong> to reveal all of the terms you&#8217;ve added.<\/li>\n<li>Add each of them to the menu and drag them into the place you want them.<\/li>\n<li>Click on <strong>Save Menu<\/strong> to save your changes. Don&#8217;t miss this step!<\/li>\n<\/ol>\n<p>I&#8217;ve added one product category and inserted\u00a0it in the menu under the &#8216;Products&#8217; link I created in the first part of this series:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-137652\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/tax-term-in-nav-menu.png\" alt=\"tax-term-in-nav-menu\" width=\"692\" height=\"590\" \/><\/div>\n<\/div>\n<p>Now when you go to your site&#8217;s front end and click on the links to your taxonomy term archives you&#8217;ll see a list of products with that term:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-ratio-large wp-image-137653\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/taxonomy-archive-front-end-700x517.png\" alt=\"taxonomy-archive-front-end\" width=\"700\" height=\"517\" \/><\/div>\n<\/div>\n<p>This displays my products but might not display them in the way I want to.<\/p>\n<h4>Using Template Files for Term Archives<\/h4>\n<p>If you want to display the archives for your taxonomy terms differently from the way your site displays other archives, you can create a special template file in your theme, or even a set of template files with one for each term.<\/p>\n<p>When WordPress displays the archive page for a taxonomy term, it looks through the files in your theme using the <a href=\"http:\/\/codex.wordpress.org\/Template_Hierarchy\" target=\"_blank\">template hierarchy<\/a>, and uses the first one it comes across:<\/p>\n<ol>\n<li>A file for displaying the archive for a specific taxonomy term: for my featured products term, this would be called <code>taxonomy-productcat-featured-products.php<\/code>\u00a0(a bit of a mouthful, I know!). Note that you use the name of the taxonomy followed by\u00a0the slug\u00a0of the taxonomy term to create the file name.<\/li>\n<li>A file for displaying taxonomy term archives for all terms in a taxonomy, called <code>taxonomy-productcat.php<\/code>.<\/li>\n<li>A file for displaying archives for all custom taxonomies, called <code>taxonomy.php<\/code>.<\/li>\n<li>The file for displaying all kinds of archive, called <code>archive.php<\/code><\/li>\n<li>The generic file for all content, called <code>index.php<\/code>.<\/li>\n<\/ol>\n<p>WordPress will work through this list and use the first one it finds. In my site, I&#8217;m running the twenty fifteen theme which has a file called <code>archive.php<\/code>, so it uses that.<\/p>\n<p>If you wanted to display your taxonomy archives differently from other archives (for example to take out excerpts and add\u00a0featured images), you could create a copy of the <code>archive.php<\/code> file in your theme, call it <code>taxonomy.php<\/code> and edit it to display your archive in the way you wanted. But even if you don&#8217;t do this, the good news is that WordPress will always find a suitable template file to display your term archives.<\/p>\n<p>Now let&#8217;s move on to the final custom content type: custom fields.<\/p>\n<h3>Creating Custom Fields<\/h3>\n<p>You can create custom\u00a0fields in one of two ways: using the default interface provided by WordPress or by using a plugin. Using a plugin can be more user-friendly and offer you some more powerful options for editing and displaying your custom fields, but isn&#8217;t always necessary.<\/p>\n<p>Among\u00a0the best plugins for creating custom fields are:<\/p>\n<ul>\n<li><strong><a href=\"https:\/\/github.com\/wpmudev\/custompress\" target=\"_blank\">CustomPress<\/a>:<\/strong> As well as letting you create custom post types and taxonomies, you can also use this plugin to create custom fields.<\/li>\n<li><strong><a href=\"https:\/\/wordpress.org\/plugins\/advanced-custom-fields\/\" target=\"_blank\">Advanced Custom Fields<\/a>:<\/strong>\u00a0This is the most popular plugin for custom\u00a0fields and the basic version is\u00a0free on the WordPress plugin repository. It offers some powerful features for editing and creating bespoke custom fields.<\/li>\n<\/ul>\n<p>If you don&#8217;t want to use a plugin however, you can create custom fields using the WordPress admin. Here&#8217;s how:<\/p>\n<h4>Creating Custom Fields Using the Default Admin Screens<\/h4>\n<p>If you go to the post editing screen for one of your posts (or you&#8217;re creating a new post), you might see a metabox for custom fields below the main editing pane. If this isn&#8217;t visible, you can display it by opening the <strong>Screen Options<\/strong> tab at the top right of the screen. Click on the &#8216;Custom Fields&#8217; tick box, close the tab and the metabox will appear below your content:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-137654\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/custom-fields-admin-metabox.png\" alt=\"custom-fields-admin-metabox\" width=\"691\" height=\"286\" \/><\/div>\n<\/div>\n<p>To add a custom field, you either select an existing key from the dropdown box on the left\u00a0hand side, or add a new one by clicking\u00a0the\u00a0<strong>Enter New<\/strong>\u00a0link and typing it in. Then you type in the value\u00a0for your custom field.<\/p>\n<p>I&#8217;ve created a custom field for a product I&#8217;ve added whose key is &#8216;Price&#8217; and whose value is &#8216;15.00&#8217;:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-137655\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/custom-field-with-data.png\" alt=\"custom-field-with-data\" width=\"686\" height=\"323\" \/><\/div>\n<\/div>\n<p>Once you&#8217;ve added the key and value, you must click the <strong>Add Custom Field<\/strong> button to save your custom field: it won&#8217;t just save when you hit the <strong>Publish<\/strong> button for your post.<\/p>\n<p>You can add as many custom fields to your posts as you need to store your data. Don&#8217;t forget to save your post after you&#8217;ve saved your custom\u00a0fields.<\/p>\n<p>So that&#8217;s how you add a custom field using the default\u00a0admin interface. Now let&#8217;s take a look at how you display your custom fields on your site&#8217;s front end.<\/p>\n<h3>Displaying Custom Fields on Your Site<\/h3>\n<p>By default, WordPress won&#8217;t display the values you&#8217;ve entered in your custom fields unless your theme is set up to do this. You might find that your theme comes with custom field support and outputs all your custom fields on the single page for each post, but the chances are it won&#8217;t.<\/p>\n<p>So you&#8217;ll need to add a <a href=\"http:\/\/codex.wordpress.org\/Template_Tags\" target=\"_blank\">template tag<\/a> to do this.<\/p>\n<p><em>A template tag is a type of function which you insert into a theme file to tell WordPress to display\u00a0some data.<\/em><\/p>\n<p>WordPress gives you a choice of template tags for displaying your custom fields:<\/p>\n<ul>\n<li><strong><code><a href=\"http:\/\/codex.wordpress.org\/Function_Reference\/the_meta\" target=\"_blank\">the_meta()<\/a><\/code><\/strong> displays all of the custom fields for a post. You use it in the loop and it will output all custom fields&#8217; keys and values without giving you much control.<\/li>\n<li><strong><code><a href=\"http:\/\/codex.wordpress.org\/Function_Reference\/get_post_meta\" target=\"_blank\">get_post_meta()<\/a><\/code> <\/strong>gives you more control. It has parameters you can use to specify which custom fields you want to get and whether you just want to retrieve one value if your post has multiple custom fields with the same key. It doesn&#8217;t actually output your custom fields though, just fetches them: to display your custom fields you have to use <code>echo get_post_meta()<\/code>.<\/li>\n<li><strong><code><a href=\"http:\/\/codex.wordpress.org\/Function_Reference\/get_post_custom_values\" target=\"_blank\">get_post_custom_values()<\/a><\/code> <\/strong>lets you fetch all the values for custom fields with the same key, which you specify. Again it needs to have <code>echo<\/code> before it to output anything.<\/li>\n<\/ul>\n<p>You normally add one of these to the template file in your theme which displays single posts or archives, inside the loop. Alternatively, if you wanted to list custom fields for a number of posts elsewhere in the site, you could use <code>get_post_meta()<\/code> outside the loop.<\/p>\n<p>For now, we won&#8217;t worry about that &#8211; instead, we&#8217;ll look at how you do this in the loop.<\/p>\n<p><em>If you haven&#8217;t come across the loop before, it&#8217;s the block of code in your theme template files which fetches the title and content of each post from the database and displays it.<\/em><\/p>\n<p>The first step is to open your <code>single.php<\/code> file in a code editor and find the loop. It will start with a line of code that looks\u00a0something like this:<\/p>\n<div class=\"gist\" data-gist=\"b12931e6ac5dd296593b0e33b2bdf6ec\" data-gist-file=\"1502 custom tax the loop opening\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/b12931e6ac5dd296593b0e33b2bdf6ec.js?file=1502+custom+tax+the+loop+opening\">Loading gist b12931e6ac5dd296593b0e33b2bdf6ec<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>Below that you&#8217;ll find template tags such as <code>the_title()<\/code> and <code>the_content()<\/code>. You need to add your custom fields between these: I&#8217;m going to add mine\u00a0immediately after the title.<\/p>\n<p><em>Note: If you&#8217;re working with twenty fifteen, you&#8217;ll find that it doesn&#8217;t have the loop cooked in the <code>single.php<\/code> file: instead it&#8217;s in an include file called <code>content.php<\/code>. To edit the display for the product post type, create a copy of <code>content.php<\/code>, name it <code>content-product.php,<\/code> and edit that.<\/em><\/p>\n<p>To display all custom fields for the post, insert this code:<\/p>\n<div class=\"gist\" data-gist=\"807dea2c08c71d7dad84d7dcd5f84236\" data-gist-file=\"1502 custom fields the meta\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/807dea2c08c71d7dad84d7dcd5f84236.js?file=1502+custom+fields+the+meta\">Loading gist 807dea2c08c71d7dad84d7dcd5f84236<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>Save your template file.<\/p>\n<p>Now when I visit my site&#8217;s front end, I can see the custom field I added to my product:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-ratio-large wp-image-137657\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/custom-fields-front-end-700x434.png\" alt=\"custom-fields-front-end\" width=\"700\" height=\"434\" \/><\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<p>By default this is shown\u00a0in a bulleted list: you can style this list however you want using CSS.<\/p>\n<p>But what if I want \u00a0bit more control over the way my custom field is shown? I can use <code>get_post_meta()<\/code>.<\/p>\n<p>Open your <code>single.php<\/code> file again and find the code you just added. Replace it with this:<\/p>\n<div class=\"gist\" data-gist=\"3a5d38cdac024f76dde70098df0e2ea7\" data-gist-file=\"1502 custom fields get_post_meta()\"><a class=\"loading\" href=\"https:\/\/gist.github.com\/3a5d38cdac024f76dde70098df0e2ea7.js?file=1502+custom+fields+get_post_meta%28%29\">Loading gist 3a5d38cdac024f76dde70098df0e2ea7<\/a><div class=\"gist-consent-notice\" style=\"display:none\"><p>Please <a href=\"javascript:Cookiebot.renew()\">update your cookie preferences<\/a> to enable preference cookies to view this gist.<\/p><\/div><\/div>\n<p>Let&#8217;s take a look at what this does:<\/p>\n<ol>\n<li>First, it gets the custom field for this post with the key &#8216;Price&#8217;, and stores it as a variable called <code>$price<\/code>.<\/li>\n<li>It checks that the custom field isn&#8217;t empty<\/li>\n<li>If not, it outputs the price inside a paragraph tag with some text before it.<\/li>\n<\/ol>\n<p>Now save your file and take a look at your page. Mine looks like this:<\/p>\n<div class=\"image-grid cgrid-row\">\n<div class=\"cgrid-col cgrid-col-span-full\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-ratio-large wp-image-137658\" src=\"https:\/\/wpmudev.com\/blog\/wp-content\/uploads\/2015\/02\/cusotm-fields-get-post-meta-output-700x412.png\" alt=\"cusotm-fields-get-post-meta-output\" width=\"700\" height=\"412\" \/><\/div>\n<\/div>\n<p>As you can see, that&#8217;s given me more control. Not only can I specify which custom\u00a0field I want to display, I can add text before it, put it inside a paragraph element if I want to, and if I have more custom\u00a0fields to show, I can repeat similar code in any order I like.<\/p>\n<p><em>Note: As I&#8217;m using the Twenty Fifteen theme, for this example I didn&#8217;t directly edit the file\u00a0in my theme but instead I created a child theme and made\u00a0new files. This means that when I update Twenty Fifteen, the new files I&#8217;ve added won&#8217;t be lost. If you&#8217;re going to do the same, I suggest you follow this <a href=\"https:\/\/wpmudev.com\/blog\/how-to-create-wordpress-child-theme\/\" target=\"_blank\">great guide to child themes<\/a>.<\/em><\/p>\n<h3>Summary<\/h3>\n<p>If you&#8217;ve been following both parts of this series, you&#8217;ll know how useful and powerful custom content can be in WordPress. Each of custom post types, custom taxonomies, and custom fields has its own uses and methods for getting the most from the content type.<\/p>\n<p>In this second part, you&#8217;ve learned how to register a custom taxonomy and display its archive pages on your site; and how to create custom fields and display those on your site too.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>What makes WordPress a powerful CMS is the ability to create custom content and display that content in exactly the way you need to. In this second part of a two-part series, we look at custom taxonomies and custom fields.<\/p>\n","protected":false},"author":347011,"featured_media":138498,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[263],"tags":[390,131,2125],"tutorials_categories":[],"class_list":["post-137644","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-code","tag-developers","tag-taxonomy"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/137644","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/347011"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=137644"}],"version-history":[{"count":5,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/137644\/revisions"}],"predecessor-version":[{"id":188447,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/137644\/revisions\/188447"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/138498"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=137644"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=137644"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=137644"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=137644"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}