ACF 5.8.0 Custom Fields not displaying in Preview when using Gutenberg

[jweston491]

When adding a custom field to a Post, Page or Custom Post Type, the field's contents are not rendered in the front-end when Previewing and using Gutenberg.

What I did:

• Installed Twenty-Nineteen Theme and ACF.
• Created Custom Text Field "test_field"
• Added the_field('test_field') to single.php
• Published post, confirmed Field content is showing as expected on live page.
• Clicked "Preview" on Post, field is not rendering.

The issue goes away when I install and activate "Disable Gutenberg" plugin.

Using WP 5.2 and PHP 7.2.9. The issue does not seem to happen in 5.1.1.

I opened a similar but separate issue back in January here, though this issue seems to be resolved with WP 5.2

[elliotcondon]

Hi @jweston491

This looks like a duplicate ticket.

I'm thankful for the bug report and will perform some testing soon, but please don't create multiple tickets for the same issue :)

[elliotcondon]

Hi all.

I've just spent some time investigating this issue and was surprised to find that WP is not including metabox data in the AJAX call to save content for preview.

This is another highlight of the poor metabox support shown in WordPress 5.0, and we will need to investigate a long term fix.

I'm sorry to report but I don't have a solution for this.

[tomjn]

@elliotcondon is there a ticket for Gutenberg/Core that can be followed or worked on for this?

[elliotcondon]

@tomjn

I just searched and found this thread (WordPress/gutenberg#11280) which looks to have a solution...

I'll need to perform some more testing with this to better understand the solution.

[AlexeySvidentsov]

Hello. Any update on this?
Should we wait for ACF Plugin update, or is it actually possible to fix the issue?

[elliotcondon]

Hi @AlexeySvidentsov

No update to report just yet. I am currently moving office space and have not been able to test the above mentioned thread.

[jamieschmid]

Was there ever any further discussion on this? I'm still seeing the preview functionality missing in 5.8.6 - is there any update on this?

[elliotcondon]

Hi @jamieschmid This issue has been assigned to our next release, and I'm hoping to have it solved shortly.

[alexandre-tobia]

Hi @elliotcondon The issues has been resolved ? Still not previewing on my side. Thanks for your work :)

[jamieschmid]

@alexandre-tobia it's been resolved! if you're having issues, post to the ACF boards and someone can help you troubleshoot.

[fburatti]

@jamieschmid @alexandre-tobia @elliotcondon
On my side the the preview (acf field in metabox) is still not working
ACF 5.8.7
WP 5.3.2

[alexandre-tobia]

@jamieschmid Where is the ACF boards ? :) thanks

[jamieschmid]

https://support.advancedcustomfields.com/forums/

[webartistse]

@elliotcondon when is this feature coming? This is a big concern :/

[elliotcondon]

Hi @webartistse

Thanks for checking in. I wish I had better news for you, but it looks like this metabox preview issue still exist in Gutenberg as of WP 5.4.

Please find a few threads on the Gutenberg GitHub repo to follow, and perhaps help provide information to the devs:

• Preview not working with Published Pages WordPress/gutenberg#16006
• Preview fails to display edits in Gutenberg WordPress/gutenberg#13232

[dtipson]

Confirming that this is a problem with any custom field, and doesn't work right whether Gutenberg or not. Feels like the entire Preview functionality needs a rewrite/rethink, and thus may be out of scope for ACF.

[lwangdu]

I am having same issue all my sites. I hope this issue will fix next updates.

[Khoded-Andy]

I have managed to fix this by installing and activating the Disable Gutenberg plugin and defining WP_POST_REVISIONS to 3:

define( 'WP_POST_REVISIONS', 3 );

Seems to have done the trick for published posts/pages.

Unbelievable that an issue like this has been known for so long and Gutenberg is even considered a MVP. Crazy. But here we are. Hopefully this fix works for others as well.

[alpipego]

Hey @elliotcondon,
I needed to fix the preview for a client website and this is what I've come up with: https://gist.github.com/alpipego/348585aca7a21291c3a25464273d9d99 and I also need to wrap https://github.com/AdvancedCustomFields/acf/blob/master/includes/acf-value-functions.php#L90 to not cache the value on a preview:

    // Update store.
    global $wp_query;
    if(isset($wp_query) && !is_preview()) {
        $store->set("$post_id:$field_name", $value);
    }

Not very efficient in terms of DB hits and code execution but since it's only for preview... Maybe this will give you some pointers on how to fix this (instead of waiting for Gutenberg's fix to come around).

[phoheisel]

Hey @elliotcondon,
I needed to fix the preview for a client website and this is what I've come up with: https://gist.github.com/alpipego/348585aca7a21291c3a25464273d9d99 and I also need to wrap https://github.com/AdvancedCustomFields/acf/blob/master/includes/acf-value-functions.php#L90 to not cache the value on a preview:

    // Update store.
    global $wp_query;
    if(isset($wp_query) && !is_preview()) {
        $store->set("$post_id:$field_name", $value);
    }

Not very efficient in terms of DB hits and code execution but since it's only for preview... Maybe this will give you some pointers on how to fix this (instead of waiting for Gutenberg's fix to come around).

sounds like a great workaround for now. Is it still working with current versions? I tried coping your code. I get the ACF fields shown in preview again but with the last saved value and not the preview value... any ideas what i'm doing wrong?

[EdithAllison]

I found this issue when searching on Google. I can confirm that preview does not display ACF fields when Gutenberg is enabled. I'm on ACF 5.10.1. This throws a real spanner in the works as I want my client to be able to see the page as it will look like when published. Disabling Gutenberg is not an option as we use the editor for the main content part (and ACF for surrounding content). I don't have a solution but following this thread in case there's a fix found.

UPDATE: to clarify the issue only applies to saved posts. Unsaved posts are fine - preview works. But for posts saved at least once, preview with ACF fails.

[WebMatPro]

the issue is from the quick edit only

[christophernathaniel]

Do we have any updates on this? ( i can see that this is closed, and i can see Elliot's response ) It looks like this has been an outstanding issue for a long time, and have this occurring across multiple websites.

The two solutions mentioned above are problematic, limiting database requests is essential, and the post revision history is being used beyond 3 revisions...

[jdev-d]

I am having this issue as well... Still not resolved on ver6?

[vonwalland]

I'm having this issue on WP 6.4.1 too (ACF Pro 6.2.3).

[y2keeper]

Same issue - previewing changes to saved posts won't load up the CPT values.

PHP 8.1 / WP 6.4.1 / ACF Pro 6.2.3

[okle-builder]

Since WP 6.4.1 the same with Divi Theme/Plugin.

[spadilha]

There's a workaround here: https://support.advancedcustomfields.com/forums/topic/custom-fields-on-post-preview/#post-150273

But goddammit they haven't fixed it in the code yet.

[SiteBoltsAdmin]

We noticed today that WordPress's "Preview Changes" feature wasn't working correctly for ACF fields; the preview was showing their published values rather than the previewed values.

We tried out several suggested PHP snippets but found that they didn't resolve the issue.

After seeing this suggestion:

define( 'WP_POST_REVISIONS', 3 );

We did some testing and confirmed that the issue occurs when post revisions are disabled. In our case, it was due to our WordPress host (WPEngine) disabling post revisions by default. We were able to fix it by contacting their support and having them set the number of post revisions to 3.