Advanced Custom Fields

Introduction to ACF

Why use ACF?

Wordpress Functionality

By default, when you create a new page, Wordpress gives the user 2 fields to input content: the title and the editor.

Wordpress provides an API that can be used to get information stored their database. Using the default Wordpress loop, you can programatically display this content. In index.php write:

<?php 
  if(have_posts()):
    while(have_posts()): the_post(); ?>
    <h1><?php echo the_title(); ?></h1>
    <p><?php echo the_content(); ?></p>
    <?php endwhile;
  endif;
?>

Limitations

The default Wordpress fields will not be enough, if your theme requires sections where additional information can be inputted by the user.

ACF To The Rescue

Advanced Custom Fields, allows you to create fields in the Wordpress admin panel and provides a simple api that can be used to display the information.

ACF Basics

Getting Started

1. Visit the Getting Started Guide to learn the basics of creating up a custom field group.
2. To add fields to your custom field group visit the Field Settings Guide.

Recommended ACF Structure

1. Create a true/false field which will allow the user the enable or disable the custom field.
   

2. Create the needed custom field, where conditional logic is turned on and the custom field is set to display when the true/false field is set to true.
   

3. Set the custom field to display on a specific page.
   

4. Publish the custom field and ensure it is displayed in Wordpress admin panel.
   

5. Use ACF's API to programatically display content in index.php:

<?php
  if(get_field('enable_content_box')):
    if(get_field('content_box')): ?>
      <p><?php echo get_field('content_box') ?></p>
    <?php endif;
  endif;
?>

Using ACF In A Team Environment

After you create a custom field, you must export it and include it in your code for other members on your team to view it.

1. Go to Custom Fields > Tools and under "Export Field Groups", pick your custom field.
2. Click "Generate PHP"
3. Copy and paste the generated code into your functions.php file.
   Note: For better organization, create a new file for your custom field and import it into functions.php

require get_template_directory() . '/path/to/my_custom_field.php';

Next Steps

Visit ACF's full list of field types to see which ones will be useful for your theme.