How to install ACF

How to install ACF

Here is a quick guide on installing Advanced Custom Fields plugin (ACF) pro or free version on your WordPress website.

1. If you haven't already, install the ACF Plugin

Install ACF Plugin
Install ACF Plugin
ACF Plugin
ACF Plugin - Pro Version

2. Under the Custom Fields Settings, you will want to add a new Field Group in the left side navigation bar.

Add new Custom Fields
Add new Custom Fields

Or use the "Add New" on the top right of the page:

Add new Custom Fields
Add new Custom Fields

3. In the new Field Group, Select the Page (Location) you wish to have custom field groups added on.

Select a Page to have ACF Display on.
Select a Page to have ACF Display on.

4. Add a Field; this could be text, images, emails, phone numbers, etc...
ACF Pro adds more features like WYSIWYG editors.

Add Field
Select Field Type (Pro Version)

4a. Add content to your field(s). This field is found on your selected page (location) you picked in step #3.

Add Content to your field
Add Content to your field

5. Create a new WordPress template, or add the custom fields to a current template.

To do this, you will need to have FTP to your hosting set up; within your hosting environment; you will need to navigate to:

/wp-content/themes/your-theme/

Adding your desired layout to a new or existing template.

Custom Template
Custom Template Example
the_field Name
the_field Name

Example

Here is an example of a production templated page section:

ACF Example
ACF Example

6. Within the new or updated template, you will need to add custom fields to pull. I've added a basic examples below:

Advanced ACF Code

Advanced Integration

To give you an advanced example, I typically buy a theme on Bootstrap Themes, convert it to WordPress, and then replace specific sections I want to be dynamic with ACF Pro.

Bootstrap Themes
Bootstrap Themes

Here is an example of replacing the text with a ACF field:

ACF Example

I hope this helps to make Advanced Custom Fields more user friendly.

For a deeper dive into adding ACF to WordPress, please read How to Convert a Static Website into WordPress, using Advanced Custom Fields