Retrieve post_ID in divi theme visual builder

• wassy83

• July 17, 2019 at 7:37 pm

Just want to ask if someone figures out how to insert an ACF shortcode in a divi code module and got to render the shortcode in the visual builder. The problem is that in the visual builder function like get_the_ID() or any other id WP query doesn’t works, cause the visual builder is retrieving the data through an AJAX call. so let’s say I have a post with ID 222602, if I place a shortcode like this

[acf field="simple_text"] //will not work

if I place a shortcode like this

[acf field="simple_text" post_id="222602"] //this will work

Obviously I have no problems in the frontend but only in the visual builder.

If it helps I found that in the divi theme there is a class ET_Builder_Element

with this kind of function

	/**
	 * Retrieve Post ID from 1 of 3 sources depending on which exists:
	 * - $_POST['et_post_id']
	 * - $_GET['post']
	 * - get_the_ID()
	 * Similar to get_the_ID() but in reverse order and statically callable.
	 *
	 * @since 3.17.2
	 *
	 * @return int|bool
	 */
	public static function get_current_post_id() {
		if ( wp_doing_ajax() && isset( $_POST['et_post_id'] ) ) {
			return absint( $_POST['et_post_id'] );
		}

		if ( isset( $_POST['post'] ) ) {
			return absint( $_POST['post'] );
		}

		return get_the_ID();
	}

but I tried to create a simple shortcode that returns this function with no results.

• kocosh

• April 17, 2020 at 10:06 pm

Hi guys, any tips on how to handle this one? I’m facing the very same issue.

I’ve created a shortcode to transform and concatenate content from some (AC)fields and I’m using it in a Divi block.

It works just fine on the frontend, in the Divi Builder though I’m getting totally different post IDs – both using global $post and get_the_ID() …not a great UX for the content editors.

Any help would be appreciated 🙂

Take care, Jan

• wassy83

• April 17, 2020 at 10:15 pm

Hi I have tried everything too without success.

• kocosh

• April 17, 2020 at 10:25 pm

Have you tried contacting the Divi support? It’s more of a Divi issue anyway…

I’ll do that as soon as my client will provide me with the login info 🙂 So we’ll see.

• wassy83

• April 17, 2020 at 10:49 pm

Yes already tried and they will told me that is an ACF issue. But I think that is related to DIvi cause I can reproduce the same issue with other shortcodes that requires the page id in visual builder

• John Huebner

• April 17, 2020 at 11:41 pm

What you are going to have to do is build your own shortcode https://codex.wordpress.org/Shortcode_API

The reason why is that ACF depends on get_the_ID() when one is not supplied.

Here is the built in ACF shortcode modified to work with the code you provided.

function my_acf_shortcode( $atts ) {
	
	// extract attributs
	extract( shortcode_atts( array(
		'field'			=> '',
		'post_id'		=> false,
		'format_value'	=> true
	), $atts ) );
	
	if (!$post_id && isset( $_POST['et_post_id'] )) {
	  $post_id = $_POST['et_post_id'] ;
	}
	
	// get value and return it
	$value = get_field( $field, $post_id, $format_value );
	
	
	// array
	if( is_array($value) ) {
		
		$value = @implode( ', ', $value );
		
	}
	
	
	// return
	return $value;
	
}

add_shortcode('my_acf', 'my_acf_shortcode');

• wassy83

• April 19, 2020 at 6:39 am

thank you for your reply, I understood your explanation, but even using your code, unfortunately if I don’t manually specify the parameter post_id into the shortcode squares, it will not render into the visual builder. Honestly I think that I have to retrieve the post id from some sort of ajax call to make it works in the visual builder, cause I think that this code

$post_id = $_POST['et_post_id'] ;

is related to this ajax call

but it is difficoult for me to find a way out, this is for sure related to how divi passes the current post_id to shortcodes

• kocosh

• April 23, 2020 at 12:27 am

Alright, I do have a hacky solution for that. Not bulletproof, though working.

$_POST and $_GET of those AJAX calls unfortunately do not contain any ID-related info (no ‘et_post_id’). But I’ve noticed that Divi Pagebuilder saves a cookie named “et-editing-post-XXXX-fb”. XXXX being the post ID! 🙂

The downside is, multiple Divi Pagebuilder cookies with different post IDs can exist at the same time. Probably while editing multiple posts at once (didn’t fully understand the logic of deleting those).

I therefore check at least for existence of my custom field as a countermeasure and in case I can’t get the post ID, I’ll echo out a placeholder message. Of course, it can happen that I mistakenly get post ID of a different post of the same post type (having the custom field I check for), but that’s a problem I can live with for now.

So far, it seems to work pretty reliably in my case.

Here’s the snippet from my shortcode…

// While in pagebuilder, try to get the ID from a cookie of name "et-editing-post-POSTID-fb"
  if (is_et_pb_preview()) {
    foreach(array_keys($_COOKIE) as $cookie) {
      if (strpos($cookie, 'et-editing-post-') === 0) {
        $cookieID = (int)explode('-', $cookie)[3];
        if (get_field('my_custom_field_name', $cookieID)) {
          $postID = $cookieID;
          break;
        }
      }
    }
  } else {
    $postID = get_the_ID();
  }

Any proposed improvements will of course be appreciated 🙂

• wassy83

• April 24, 2020 at 4:49 am

@kocosh thank you for your share, this is good workaround and works. But I hope that someday will be a better support for developers that works with divi theme, for the Moment everything looks like you need reversal enginnering skills.