boulder wordpress websitesI recently had the privilege of speaking at a local Meetup Group here in Boulder.  The Boulder WordPress Meetup is comprised of a fairly wide ranging array of skill sets when it comes to WordPress Development.  A handful of the folks that attend these meetings are casual fans of WordPress and simply want to further their understanding of this awesome software.  Another handful are folks like myself who make a living working on and developing WordPress websites.  And the last group are full-on developers that know more about programming languages than I’ll learn in the next 5 years.  I love all of these groups and creating a course that can touch on each of them is a welcome challenge.  When it comes to Advanced Custom Fields, everyone can join in the fun and take the “nerd” level as high as they want.

I began the class talking about Custom Post Types.  That’s a subject for another blog post so I’ll reserve my blabbing on that for another day. In short, custom post types (CPTs) are posts that allow you to organize your website content in more logical ways.  The example I use is someone creating a website for pizza recipes.  We don’t want to be forced to stuff all the pizza recipes inside the blog “post” section and wrestle with the categories and tags in order to distinguish them.  Custom Post Types allows us to create a special grouping of posts specifically for pizza recipes.  In this way, your blog posts can continue to focus on stories about your dining adventures across the United States, but your pizza recipes will be safely segmented with all the other recipes.

The beauty of Advanced Custom Fields is not that it gives us the ability to create special fields for our posts and pages (which it does quite nicely).  The beauty of ACF is that it provides us with a lovely interface in order to generate and organize those fields.  Whether through your own custom code or through the standard post/page interface, you could muddle your way through the creation of some custom fields.  WordPress affords us that functionality right out of the box.  What ACF does for us is makes it so much easier for those who have no interest in mucking around with their functions.php file and learning a bit of PHP.

In the above pizza example, we can create a group of fields related to our recipes.  The custom fields could be “ingredients”, “preparation instructions” and “baking instructions” as just one example. So when we go to create a new recipe, we have the ability to limit the editing screen to just those fields.  No need for featured images, content areas, other custom fields, etc.  With the ACF plugin, you are able to limit the editing capabilities to a very narrow set of fields (that you created) which makes the display of the content far more easy to manage.

boulder wordpress developerThe second part of the ACF plugin is assigning those fields (or that field group) to a specific area of your website.  We don’t want the recipe fields showing up on our travel blog posts editor.  Within the ACF admin area, you are encouraged to choose a post type, page, template or other identifiable section of the site for which these fields will appear.  In our example, we want the recipe fields to show up in our recipe post type (more on that next time).  So we now have our fields showing up in the editor of our pizza recipe section, let’s take a peek at how we can get these fields to show up on the front of the site.  I mean, we want to share these awesome recipes don’t we!?

boulder wordpressWhat you can see in the image (feel free to click on it and expand it) is a chunk of the code I used to include my ACF fields into my theme template.  You can see this (very crude) example by clicking here.  The “get_field” code is specific to ACF.  That tells the server to grab the contents of the field related to this specific post.  The “the_field” code is also specific to ACF and is telling the server to actually print out the contents of that field for this specific post. The “if” statement that wraps all of this is simply checking to see if there is any content in the field. If there is, then print it out.  If the field is empty, keep moving along.  In one of the examples on the website, you’ll notice that there are less than 5 ingredients in the pizza.  The last one does not show because of this handy if-statement logic. (Hooray PHP!)

You’ll also notice a bit of a cardinal sin in this code. Inline styling. That’s another great blog post for another day, but just know that I only included it in there to save time and this site is clearly not going into production anytime soon!

The creation of ACFs can not only help you organize your content and your admin back-end, but it can allow you to really manipulate the front-facing side of your site.  The beauty of this is you can have a standard blog (which would be the “home” page of my demo site) as well as an archive of yummy pizza recipes.  All within the same website and the same admin interface.  The difference lies in where you tell WordPress you want those fancy new custom fields to show up.

Next time we’ll get into Custom Post Types since that is always a hot topic and will honestly change the way you think about building your next website.









Please follow and like us: