Advancing Advanced Custom Fields
A few years ago, I had the privilege of speaking at a local Meetup group 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 meetups 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 five 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 on the fun and take the “nerd” level to 11—or as high as they want!
Let’s start with custom post types.
I began the presentation by talking about custom post types (CPTs). I cover that topic more completely in this YouTube video, so I’ll reserve my blabbing on that for another day (or video). In short, CPTs are posts that allow you to organize your website content in more logical ways.
The example I like to 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. CPTs allow 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 country, but your pizza recipes will be safely segmented with all the other recipes.
And now on to Advanced Custom Fields.
The beauty of Advanced Custom Fields (ACF) 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 make it so much easier for those who have no interest in mucking around with their functions.php file and learning a bit of PHP.
1. Creating ACF groups
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’re 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.
2. Assigning ACF fields
The 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’re 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. So, now that we 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!?
3. Making ACF fields display on the frontend.
What you can see in the image above (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.
- 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.
- You’ll notice that there are less than five ingredients in the pizza. On the frontend, the last one wouldn’t 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 as I prepared for my Meetup presentation—and this site wasn’t going into production anyway!
The beauty of ACFs
The creation of ACFs not only helps you organize your content and your admin backend, but it can also 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.
Featured image credit: Pinar Kucuk on Unsplash
Want to learn even more about WordPress?
Check out our WordPress for Beginners series.
. . .
