ACF Integration with Community Events Plugin (The Events Calendar)

• jsteckler

• October 12, 2017 at 3:23 am

Hello All,

First of all, sorry, I’m not quite sure whether this is a front-end or backend issue, because it is designed to be a user submitted form.

Can anybody help me get ACF PRO to show up with the rest of the default fields in the Community Events add-on to The Events Calendar Pro?

It shows up in the standard “Edit Events” backend, but I cannot get it to display on the https://www.cfany.org/events/community/add page where users submit event proposals.

I have tried ever rule combination imaginable with no luck, and tried pasting the exported PHP code into both wp-content/plugins/the-events-calendar-community-events/src/views/community/edit-event.php as well as wp-content/plugins/the-events-calendar-community-events/src/views/community/modules/custom.php with no luck. Perhaps I am pasting it in the wrong area of these php files? Or is it some other issue entirely?

• John Huebner

• October 13, 2017 at 1:40 am

ACF uses standard WP hooks to add fields to known forms. The problem is that the front end forms for the other plugin are not known forms and probably does not use standard WP hooks for allowing the addition of extra fields.

None of the built in location rules are going to help you.

In order to do this, the first thing you need to figure out is if the other plugin provides hooks that allow you to make changes and add fields. If it does then you need to add an action/filter for their hook and use acf_form() https://www.advancedcustomfields.com/resources/acf_form/ to insert the ACF form inside of their form (set ‘form’ to false).

If they do not provide a hook that lets you add additional fields then you need to edit the code of the plugin where it shows the form to include the acf_form() call. This would not be a good idea to do though as you’ll need to re-code it every time the plugin is updated.

Most plugins offer a way to make changes so I’d ask the other plugin’s devs or look at their documentation before making making changes to their code.

• jsteckler

• October 13, 2017 at 3:09 am

John,

Can’t thank you enough for the thorough response—I sincerely appreciate it.

If you wouldn’t mind taking a look:

I’ve put together a couple of answers I’ve received from the devs (attached) of the Community Events plugin, as well as some of the resources and documentation they point to.

Additionally, here is the untouched template file that I believe additional fields can be added to:

<?php
/**
 * Event Submission Form
 * The wrapper template for the event submission form.
 *
 * Override this template in your own theme by creating a file at
 * [your-theme]/tribe-events/community/edit-event.php
 *
 * @since    3.1
 * @version  4.5
 *
 * @var int|string $tribe_event_id
 */

if ( ! defined( 'ABSPATH' ) ) {
	die( '-1' );
}

if ( ! isset( $tribe_event_id ) ) {
	$tribe_event_id = null;
}

?>

<?php tribe_get_template_part( 'community/modules/header-links' ); ?>

<?php do_action( 'tribe_events_community_form_before_template', $tribe_event_id ); ?>

<form method="post" enctype="multipart/form-data" data-datepicker_format="<?php echo esc_attr( tribe_get_option( 'datepickerFormat', 0 ) ); ?>">
	<input type="hidden" name="post_ID" id="post_ID" value="<?php echo absint( $tribe_event_id ); ?>"/>
	<?php wp_nonce_field( 'ecp_event_submission' ); ?>

	<?php tribe_get_template_part( 'community/modules/title' ); ?>

	<?php tribe_get_template_part( 'community/modules/description' ); ?>

	<?php tribe_get_template_part( 'community/modules/datepickers' ); ?>

	<?php tribe_get_template_part( 'community/modules/image' ); ?>

	<?php tribe_get_template_part( 'community/modules/taxonomy', null, array( 'taxonomy' => Tribe__Events__Main::TAXONOMY ) ); ?>

	<?php tribe_get_template_part( 'community/modules/taxonomy', null, array( 'taxonomy' => 'post_tag' ) ); ?>

	<?php tribe_get_template_part( 'community/modules/venue' ); ?>

	<?php tribe_get_template_part( 'community/modules/organizer' ); ?>

	<?php tribe_get_template_part( 'community/modules/website' ); ?>

	<?php tribe_get_template_part( 'community/modules/custom' ); ?>

	<?php tribe_get_template_part( 'community/modules/cost' ); ?>

	<?php tribe_get_template_part( 'community/modules/spam-control' ); ?>

	<?php tribe_get_template_part( 'community/modules/submit' ); ?>
</form>

<?php do_action( 'tribe_events_community_form_after_template', $tribe_event_id ); ?>

Here is the Events Calendar Themer’s Guide (Community Events is considered an Add-On to The Events Calendar plugin): https://theeventscalendar.com/knowledgebase/themers-guide/

I found the above code in /wp-content/plugins/the-events-calendar-community-events/src/views/community/edit-event.php

Does this make sense? If that is the correct location for the ACF hook, how/where would I place it? The field group I would like to add is titled “Event Proposals” but, for whatever reason, when I use inspector, the div id comes up as “acf-group_59dd13c80be9e” so I’m not sure if that’s what needs to be used in the hook.

I was unsuccessful with the following code:

<?php
/**
 * Event Submission Form
 * The wrapper template for the event submission form.
 *
 * Override this template in your own theme by creating a file at
 * [your-theme]/tribe-events/community/edit-event.php
 *
 * @since    3.1
 * @version  4.5
 *
 * @var int|string $tribe_event_id
 */

if ( ! defined( 'ABSPATH' ) ) {
	die( '-1' );
}

if ( ! isset( $tribe_event_id ) ) {
	$tribe_event_id = null;
}

?>

<?php tribe_get_template_part( 'community/modules/header-links' ); ?>

<?php do_action( 'tribe_events_community_form_before_template', $tribe_event_id ); ?>

<form method="post" enctype="multipart/form-data" data-datepicker_format="<?php echo esc_attr( tribe_get_option( 'datepickerFormat', 0 ) ); ?>">
	<input type="hidden" name="post_ID" id="post_ID" value="<?php echo absint( $tribe_event_id ); ?>"/>
	<?php wp_nonce_field( 'ecp_event_submission' ); ?>

	<?php tribe_get_template_part( 'community/modules/title' ); ?>
	
	<?php acf_form( $options );
	$settings = array(

	/* (string) Unique identifier for the form. Defaults to 'acf-form' */
	'id' => 'acf-group_59dd13c80be9e',
	
	/* (boolean) Whether or not to create a form element. Useful when a adding to an existing form. Defaults to true */
	'form' => false
			
);?>

	<?php tribe_get_template_part( 'community/modules/description' ); ?>

	<?php tribe_get_template_part( 'community/modules/datepickers' ); ?>

	<?php tribe_get_template_part( 'community/modules/image' ); ?>

	<?php tribe_get_template_part( 'community/modules/taxonomy', null, array( 'taxonomy' => Tribe__Events__Main::TAXONOMY ) ); ?>

	<?php tribe_get_template_part( 'community/modules/taxonomy', null, array( 'taxonomy' => 'post_tag' ) ); ?>

	<?php tribe_get_template_part( 'community/modules/venue' ); ?>

	<?php tribe_get_template_part( 'community/modules/organizer' ); ?>

	<?php tribe_get_template_part( 'community/modules/website' ); ?>

	<?php tribe_get_template_part( 'community/modules/custom' ); ?>

	<?php tribe_get_template_part( 'community/modules/cost' ); ?>

	<?php tribe_get_template_part( 'community/modules/spam-control' ); ?>

	<?php tribe_get_template_part( 'community/modules/submit' ); ?>
</form>

<?php do_action( 'tribe_events_community_form_after_template', $tribe_event_id ); ?>

If there’s any other information I can provide, I’d be more than happy to do so.

Thanks so much!

1.png.png

2.png.png

3.png.png

• jsteckler

• October 13, 2017 at 3:17 am

Following up:

I tried registering the form first with <?php acf_register_form( $settings ); ?> but this did not work either. I’m not sure if I’m entering the code wrong, or if I’m on the wrong path entirely.

Here it is with acf_register_form:

<?php
/**
 * Event Submission Form
 * The wrapper template for the event submission form.
 *
 * Override this template in your own theme by creating a file at
 * [your-theme]/tribe-events/community/edit-event.php
 *
 * @since    3.1
 * @version  4.5
 *
 * @var int|string $tribe_event_id
 */

if ( ! defined( 'ABSPATH' ) ) {
	die( '-1' );
}

if ( ! isset( $tribe_event_id ) ) {
	$tribe_event_id = null;
}

?>

<?php tribe_get_template_part( 'community/modules/header-links' ); ?>

<?php do_action( 'tribe_events_community_form_before_template', $tribe_event_id ); ?>

<?php acf_register_form( $settings );

$settings = array(
/* (string) Unique identifier for the form. Defaults to 'acf-form' */
	'id' => 'acf-group_59dd13c80be9e',
	
	/* (boolean) Whether or not to create a form element. Useful when a adding to an existing form. Defaults to true */
	'form' => false
			
);?>

<form method="post" enctype="multipart/form-data" data-datepicker_format="<?php echo esc_attr( tribe_get_option( 'datepickerFormat', 0 ) ); ?>">
	<input type="hidden" name="post_ID" id="post_ID" value="<?php echo absint( $tribe_event_id ); ?>"/>
	<?php wp_nonce_field( 'ecp_event_submission' ); ?>

	<?php tribe_get_template_part( 'community/modules/title' ); ?>
	
	<?php acf_form( $options );
	$settings = array(

	/* (string) Unique identifier for the form. Defaults to 'acf-form' */
	'id' => 'acf-group_59dd13c80be9e',
	
	/* (boolean) Whether or not to create a form element. Useful when a adding to an existing form. Defaults to true */
	'form' => false
			
);?>

	<?php tribe_get_template_part( 'community/modules/description' ); ?>

	<?php tribe_get_template_part( 'community/modules/datepickers' ); ?>

	<?php tribe_get_template_part( 'community/modules/image' ); ?>

	<?php tribe_get_template_part( 'community/modules/taxonomy', null, array( 'taxonomy' => Tribe__Events__Main::TAXONOMY ) ); ?>

	<?php tribe_get_template_part( 'community/modules/taxonomy', null, array( 'taxonomy' => 'post_tag' ) ); ?>

	<?php tribe_get_template_part( 'community/modules/venue' ); ?>

	<?php tribe_get_template_part( 'community/modules/organizer' ); ?>

	<?php tribe_get_template_part( 'community/modules/website' ); ?>

	<?php tribe_get_template_part( 'community/modules/custom' ); ?>

	<?php tribe_get_template_part( 'community/modules/cost' ); ?>

	<?php tribe_get_template_part( 'community/modules/spam-control' ); ?>

	<?php tribe_get_template_part( 'community/modules/submit' ); ?>
</form>

<?php do_action( 'tribe_events_community_form_after_template', $tribe_event_id ); ?>

• John Huebner

• October 13, 2017 at 3:24 am

If that’s the template, there are no hooks there that will help you. Like I said, you’d need to talk to the developers of that plugin to see if they provide any hooks that let you make changes. I am not familiar with that plugin at all and I cannot really help with that. The only part I can help you with is the acf_form call, it should look something like this

$settings = array(
  'id' => 'acf-group_59dd13c80be9e',
  'form' => false
);
acf_form($settings);

also, note that you’ll need to figure out how to modify the header to include the call to acf_form_head() that’s mentioned in the acf_form() documentation.

• jsteckler

• October 13, 2017 at 3:38 am

John,

Believe it or not, after plugging in the acf_form call you provided, it is now displaying! I’ll need to tweak the CSS a bit to get it to show up more cleanly, but other than that, is there anything else I should worry about?

Any reason to suspect it won’t register the info entered or anything like that? Must I still look into modifying the header to include the call to acf_form_head() like you mentioned?

Screen-Shot-....png

• John Huebner

• October 13, 2017 at 4:29 am

ACF will not save anything if you do not include the call to acf_form_head() before anything is output on the page.

YOu can also add something like this that will work

add_action('init', 'add_acf_form_head_to_entire_site');
function add_acf_form_head_to_entire_site() {
  acf_form_head();
}

• jsteckler

• October 13, 2017 at 10:20 am

I’ve been unsuccessful in finding a place to insert the acf_form_head() call.

With the one you provided, since it seems designed to apply to the entire site, is there an obvious place to insert it? Are you aware of any potential drawbacks to having it apply to the entire site?

• John Huebner

• October 13, 2017 at 10:48 pm

If you use the code I posted you would put it in your functions.php file.

• jsteckler

• October 18, 2017 at 2:26 am

Hello again, John.

I’ve tried the code you posted in my functions.php file with no luck. That actually broke the submittal process entirely—basically causing the submittal form/page to refresh with not even the fields native fields retained.

Next, I tried adding acf_form_head() to both my theme (Avada) and plugin (Events Calendar) template files, per the suggestion of the dev at TEC, the thread found here in it’s entirety:

I looked around a bit and might have found something that could help.

There is a template file,

\the-events-calendar\src\views\default-template.php

which you can override (=> Themer’s Guide), that has a ‘get_header()’ in it.

For this template to work you will need to have the setting Events > Settings > Display tab > Events Tempate > Default Events Template.

If you want to use the ‘Default Page Template’ setting, then you either need to look around in your theme’s template files, search for it and add it there. If you have a page.php file in your theme, then that would be your best bet.

In this case it is also recommended to use a child theme, so that your settings don’t get lost with a theme update.

Let me know if this helps you move forward.

So, first I tried adding it to the template I am currently using: Default Page Template (page.php) – no luck.

And then I changed the template file I’m using to the Default Events Template (default-events.php) – still no luck.

I also received another suggestion from a different dev in a different section of the support forum:

The Community Events form is actually not a regular WordPress post or archive page; it’s a WP Router “page”.

tribe_events_community_form might be the action hook you’re looking for. I found it in the render() method inside /wp-content/plugins/the-events-calendar-community-events/src/Tribe/Event_Form.php

Please let me know how this goes for you.

I tried placing it where I understood was suggested—as seen in attached screenshot—but that failed as well.

Does this offer any useful clues? Should I provide you the full code found with Event_Form.php?

Screen-Shot-....png

• jsteckler

• October 19, 2017 at 9:20 am

Found in this thread here: https://theeventscalendar.com/support/forums/topic/where-to-place-acf_form_head-to-save-submitted-data/#dl_post-1364986

An Events Calendar Pro dev created a snippet, and though I placed it within my functions.php file, none of the data entered in the ACF fields is saved upon hitting submit on the front-end (it does save when editing via admin backend). Still, I’m hoping it potentially offers some clues:

<?php
/**
 * The Events Calendar - Community Events: Enqueue Advanced Custom Fields into
 * the Community Events add/edit form pages.
 *
 * This will get ACF loaded but you will need to add your own additional code to
 * get ACF to do anything at all on the Community Events forms.
 *
 * @see cliff_is_community_page
 *
 * @link https://gist.github.com/cliffordp/9c88e97e5f2392b1c36eabb248a50b11
 * @link https://www.advancedcustomfields.com/
 * @link https://theeventscalendar.com/support/forums/topic/where-to-place-acf_form_head-to-save-submitted-data/
 */
add_action( 'wp_head', 'cliff_add_acf_to_ce' );

function cliff_add_acf_to_ce() {
	if (
		! function_exists( 'acf_form_head' )
		|| ! function_exists( 'cliff_is_community_page' )
		|| false === cliff_is_community_page()
	) {
		return;
	}

	acf_form_head();
}

/**
 * Return TRUE if we are in the Community Events Add Event or Edit Event form.
 *
 * @return bool
 */
function cliff_is_community_page() {
	$main = tribe( 'community.main' );

	if ( empty( $main ) ) {
		// Community Events is not active (or may somehow not be loaded correctly)
		return false;
	}

	$event_post_type = Tribe__Events__Main::POSTTYPE;
	$action          = Tribe__Utils__Array::get( $main->context, 'action' );
	$ce_post_type    = Tribe__Utils__Array::get( $main->context, 'post_type', $event_post_type ); // assume event post type if not set

	// bail if we are not doing what is expected from the start
	if ( $event_post_type !== $ce_post_type ) {
		return false;
	}

	if (
		'edit' === $action
		|| 'add' === $action
	) {
		return true;
	} else {
		// if empty( $action ), you might be in the Community Events List view
		return false;
	}
}

I should also note that he described the CE front-end form like this:

“The Community Events form is actually not a regular WordPress post or archive page; it’s a WP Router “page”.

tribe_events_community_form might be the action hook you’re looking for. I found it in the render() method inside /wp-content/plugins/the-events-calendar-community-events/src/Tribe/Event_Form.php

Please let me know how this goes for you.”

And:

“Since you want it in wp_head(), I think the best way is to actually use that hook.

You could reference this is_community_page() method as a check inside the code you hook into wp_head(): https://github.com/moderntribe/products-extensions/blob/master/tribe-ext-community-currency-symbol/index.php#L294-L331&#8221;

• John Huebner

• November 10, 2017 at 1:01 am

Sorry for such a late reply on this.

‘wp_head’ is too late to call acf_form_head(). This ACF function must be called before any output is generated for the page. By the time ‘wp_head’ is called I think output has already been generated. It really needs to be done before get_header() or the hook of the same name.

See this reference as it has a list of hooks and their order https://codex.wordpress.org/Plugin_API/Action_Reference.

The only advice I can give is to try an earlier hook.

• dannycare

• July 5, 2023 at 7:37 am

I’m late to the party on this one, but with The Events Calendar changing their codebase so often, this may be useful to anyone trying to do this in 2023:

In edit-event.php, you need to call the ACF form head:

add_action( 'get_header', 'call_acf_form_head', 1 );
function call_acf_form_head() {
   acf_form_head();
}

In the same file, you can add your field groups anywhere within the form tags:

<?php
    $settings = array(
      'field_groups' => array('group_649542db656b2'),
      'form' => false
    );
    acf_form($settings);
?>

Then in your functions.php you need to add two functions. One that fires when the event is created, and one that fires when the event is updated.

add_action('tribe_community_event_created', 'events_custom_field_create', 10, 1);
function events_custom_field_create($event_id){

    acf_save_post( $event_id );
}

add_action('tribe_community_event_updated', 'events_custom_field_update', 10, 1);
function events_custom_field_update($event_id){

    acf_save_post( $event_id );
}

Note: I did try combining this into one function, but for me it didn’t work.

Bonus bits:
Need to add a featured image? In your image field settings, set the Field Name as _thumbnail_id.

Want to use an image gallery, but also want to set a featured image without needing a separate field? You can save the first image uploaded to the gallery as the featured image for the event with this function:

add_filter('acf/save_post', 'gallery_to_thumbnail');
function gallery_to_thumbnail($event_id) {
	$gallery = get_field('event_gallery', $event_id, false);
	if (!empty($gallery)) {
		$image_id = $gallery[0];
		set_post_thumbnail($event_id, $image_id);
	}
}

Make sure to replace the get_field with your Field Name.

I hope this helps someone!