ACF integration

When working with custom blocks in PorterWP, integrating ACF (Advanced Custom Fields) is straightforward. There are two main methods to register ACF fields for your blocks: using the ACF GUI or registering fields via PHP in the block's init.php file.

Recommended Approach: Using the ACF GUI

The recommended way to register fields for a block is by using the ACF GUI. This method allows you to visually create field groups and select the block as the location for the field group.

PorterWP is set up to automatically hook into ACF and save any acf-json files inside the block's folder, under an acf-json directory. This ensures that both the field data and the block content remain in a single location, making it easy to manage.

Steps to Register Fields with the ACF GUI:

1. Create Your Field Group: In the ACF interface, create your field group and define your fields.

2. Set the Location to the Block: Under the "Location" rules for the field group, select the block as the location parameter.

3. ACF JSON Saved Inside the Block Folder: PorterWP will automatically save the ACF JSON for the block inside the block folder, under acf-json. This keeps everything in one place.

Here's how PorterWP manages ACF field groups and saves them inside the block folder:

Loading ACF Field Groups for Blocks

PorterWP hooks into ACF to load field groups stored in the block's acf-json directory. This ensures that any fields registered via the GUI are loaded properly from the block's folder.

Saving ACF Field Groups Back to Blocks

When you create or edit a field group in ACF and associate it with a block, PorterWP ensures the acf-json for that block is saved inside the block folder. This keeps your ACF field data and the block content tightly coupled in one location.

Alternative Approach: Registering ACF Fields via PHP

If you prefer to register your ACF fields programmatically, you can do so in the block's init.php file. Here's an example:

Step-by-Step Example:

1. Define Fields: Use the get_acf_fields() function to define your ACF fields in an array.

2. Define Location: The get_acf_location() function specifies where the field group should be applied, such as to a specific block.

3. Register the Field Group: Use the field_group() function to register the field group with ACF.

/**
 * Define ACF Custom Fields as PHP Array
 * @ref https://www.advancedcustomfields.com/resources/register-fields-via-php/
 */
function get_acf_fields() {
	$fields = [
		[
			'label' => 'Example Field',
			'name' 	=> 'example_field',
			'key' 	=> helpers()->key('example_field'),
			'type' 	=> 'text',
		],
	];
	return $fields;
}

/**
 * Define ACF Field Group Location as PHP Array
 * @ref https://www.advancedcustomfields.com/resources/register-fields-via-php/
 */
function get_acf_location() {
	$location = [
		[
			[
				'param' => 'block',
				'operator' => '==',
				'value' => helpers()->meta('name'),
			],
		],
	];
	return $location;
}

/**
 * Register ACF Field Group as PHP Array
 * @ref https://www.advancedcustomfields.com/resources/register-fields-via-php/
 */
function field_group() {
    acf_add_local_field_group(
    	[
	        'key' => helpers()->key(),
	        'title' => helpers()->meta('title'),
	        'fields' => get_acf_fields(),
	        'location' => get_acf_location(),
    	]
    );
}
add_action('acf/init', __NAMESPACE__.'\field_group');

In this approach, ACF field groups are defined and registered directly within the block, making it a flexible method for advanced users who prefer managing field data via code.

Summary

• Recommended: Use the ACF GUI to register fields and let PorterWP save the acf-json inside the block folder.

• Advanced: Register ACF fields via PHP in the block's init.php file, especially if you want more control over the field definitions.

Both methods provide a seamless way to integrate ACF with your custom blocks in PorterWP, allowing you to manage field data effectively.