Advanced Custom Fields is a great plugin for developers, it allows you to create extra fields in the post/page screen or inside the custom post type screen. This plugin unlocks a lot of potential to be able to achieve some great content management for editors or general users.
There is an alternative but it requires writing up some code which can be preferable if you don’t want users messing about with the fields you have set up. Check out the links below.
Custom metaboxes on github
Check out the alternative solution for creating extra metaboxes inside the editor screen for WordPress, this is a pretty powerful library with options like: repeating fields, metaboxes dependent on post type and image upload fields.
https://github.com/WebDevStudios/Custom-Metaboxes-and-Fields-for-WordPress
Advanced Custom Fields
This is the plugin that I will refer to in this post, it is very versatile and can be used by not only developers but also tech savvy users as the fields are created via a user interface in the back end.
http://www.advancedcustomfields.com/
Installing the Advanced Custom Fields plugin
As with every WordPress plugin you will need to upload the files to your website, either by going to Wp-admin > Plugins > Add New > Search for “Advanced Custom Fields” and click “Install Now”. If you are unable to add plugins this way, then you can upload the plugin via FTP. Download the plugin from the link below and upload it to your /wp-content/plugins folder. Once you have successfully installed and activated the plugin then you should see a menu to the left called “Custom Fields”.
Creating custom fields
The interface for the Advanced Custom Fields plugin may initially be a bit underwhelming, this is because you need to add some field groups, once you have added field groups then you will see the magic of the plugin appear. We will create an example group for event fields.
- Create a new post category called “Events”.
- Go to the Custom Fields menu down the left hand side.
- Click “Add New” at the top of the plugin area.
- Type “Event Group” in the title area of our new field group.
- Under the location area, “Post Category” > “Is Equal To” > “Events”. (This will make our custom fields only display on posts with the event category selected)
- Inside the field order section, click “Add New”.
- Give the field a label of “Event Date”.
- In field type, select “Date Picker” underneath the jQuery category.
- Select “Yes” on the Required? field.
- Then click publish.
We now have a custom field group for any post we create inside the event category. It’s time to create some posts. Go into posts and click “Add New” then select the event category, you will notice the extra fields in a metabox underneath the main editor area. Hopefully you should see a nice date picker for the Event Date. Add a date with the date picker and publish the post and click view, you will notice that our new field doesn’t display anywhere… yet.
Displaying custom fields on the front end
Displaying custom fields requires some code, not much but a little. The function we will be using is the_field(‘event_date’); this will retrieve the field we need. You can do this next bit in your favourite code editor, but for simplicity we will be using the editor within wp-admin.
- Go to Appearance > Editor inside the admin area.
- Find the single.php file down the right hand side and click it, this will bring up the single.php code.
- Inside the single.php add the following code, just below the_title() tag.
<?php if( get_field( "event_date" ) ) { ?>
<p class="event-date"><?php the_field( "event_date" ); ?></p>
<?php } ?>
- This will display the event date that we filled in on our new post.
Where to go next with advanced fields?
One of the most powerful things with the advanced fields is the ability to create fields based on the type of content and allow users to populate those fields. There is a great plugin which comes with the pro version of advanced custom fields which is the repeater field. This field adds the ability for users to continually add rows of content, for example gallery images. The repeater field is one thing I would recommend looking into next.
Another thing to check out is the location settings inside the field groups. This area gives you a lot of flexibility with your custom fields, it allows you to specify fields only for certain categories, templates, formats and a whole lot more, definitely worth while checking out.
I hope you enjoyed this article and took something from it, if you would like any more examples on anything in particular then please let me know.
All the best Rob.
Comments