Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Advanced Custom Field Integration #440

Closed
gkoscevic opened this issue Aug 19, 2016 · 24 comments
Closed

Advanced Custom Field Integration #440

gkoscevic opened this issue Aug 19, 2016 · 24 comments

Comments

@gkoscevic
Copy link

The posts on my wordpress blog are built using AFC and I've been trying to integrate AFC into the plugin, but have had no luck.

Is there something I'm missing? Or a way that is already built out to accomplish this?

@mjangda
Copy link
Contributor

mjangda commented Aug 24, 2016

How do you integrate AFC in your regular theme?

@gkoscevic
Copy link
Author

The theme's single.php file is using multiple the_sub_field('title') and the_sub_field('content') functions. And they are wrapped with various if statements and while loops. We're able to get the title and content outputted on the AMP pages but all the image tags being displayed are not sanitized with 'amp-img' and therefore not passing AMP's validation.

@pshoeg
Copy link

pshoeg commented Jan 14, 2017

I have this exact issue. The content from ACF is outside the "post_amp_content", which apparently means, that img elements will not be changed to amp-img, making validation fail.

I have changed the AMP plugins single.php file to include the_sub_field('recipe'), which includes both images and text like the regular the_content. But the functions written in the AMP plugin only looks at the_content (or so it seems). How is it possible to make it convert all images to amp-img elements?

@lcmartinezdev
Copy link

I have this issue too.

@Oddrigue
Copy link

I also have this issue. I tried ACF-AMP but it didn't sanitize the content in repeaters

@kevinkonrad
Copy link

Has anyone figured this out? I, too, am having issues with this. I would like to sanitize ACF WYSIWYG fields so that <img> tags will be converted to <amp-img> tags, etc.

@westonruter
Copy link
Member

@kevinkonrad Can you share the code for how you are integrating ACF into your AMP post templates?

@Bengolino
Copy link

Also have the same issue and also use sub_fields in my content :)

@westonruter
Copy link
Member

@Bengolino please share the steps that I can do to replicate what you are seeing on a vanilla install.

@westonruter
Copy link
Member

ACF should be fully supported as of 1.0 since the active theme's templates are encouraged to be re-used in AMP.

@uri3000
Copy link

uri3000 commented Jun 24, 2018

@westonruter What do you mean 1.0? You comment was impossible to understand... could you explain?

@westonruter
Copy link
Member

Version 1.0 of the AMP plugin should work seamlessly with ACF due to the reuse of the active theme's normal templates.

@uri3000
Copy link

uri3000 commented Jun 24, 2018 via email

@westonruter
Copy link
Member

If you are using the classic templating system then no, ACF won't work if your ACF output is not part of the content. Share the code for your custom template. There should be a solution involving output buffering.

@uri3000
Copy link

uri3000 commented Jun 24, 2018 via email

@westonruter
Copy link
Member

OK, so assuming you have copied the single.php from the plugin and are modifying it, instead of adding the above into the template itself, what you'll want to do is just add one line to the template, like so:

<?php echo $this->get( 'introduction' ); ?>

Then you need to add a amp_post_template_data filter to define this introduction data, and you can do so by putting the following in your theme's functions.php:

add_filter( 'amp_post_template_data', function( $data ) {
	ob_start();
	?>
	👉👉👉 PUT INTRODUCTION TEMPLATE CODE CODE HERE 👈👈👈
	<?php
	$content = ob_get_clean();

	if ( empty( $content ) ) {
		return $data;
	}

	$amp_content = new AMP_Content(
		$content,
		amp_get_content_embed_handlers( get_post() ),
		amp_get_content_sanitizers( get_post() )
	);

	$data['introduction'] = $amp_content->get_amp_content();

	$data['amp_component_scripts'] = array_merge(
		$data['amp_component_scripts'],
		$amp_content->get_amp_scripts()
	);

	$data['post_amp_stylesheets'] = array_merge(
		$data['post_amp_stylesheets'],
		$amp_content->get_amp_stylesheets()
	);

	return $data;
} );

@westonruter
Copy link
Member

Again, none of this is necessary if you just use the new theme support in the plugin. You can write templates as you do normally when you write themes.

@uri3000
Copy link

uri3000 commented Jun 25, 2018

Thanks Weston, but the entire code I sent is the template of the post which has multiple custom fields, some of which are lists. The template is for 'post' and it has:

  • introduction
  • list of "section_content"
  • summary

All of these are rendered in the template which I had sent. Could you please explain again having this in mind? Thanks a lot...

What do you mean by "new theme support" - How do I use the new theme support in the ACF plugin?

@uri3000
Copy link

uri3000 commented Jun 25, 2018

Especially I don't understand how to deal with the section_list inside the ob section in your walkthrough.

@westonruter
Copy link
Member

For documentation on the new theme support in the plugin, see https://github.com/Automattic/amp-wp/wiki/Adding-Theme-Support

@uri3000
Copy link

uri3000 commented Jun 27, 2018

Weston, this is not how I am using the templates.
I am creating the template using the ACF for AMP plugin (Please see attached image).
It is not stored in a duplicated single.php because I simply chose to use the plugin.

In addition, the way you suggested only takes into account the introduction custom field but my template includes many fields (the whole template needs to go through the AMP sanitizers...)
How can I achieve this using this plugin?

Thanks

screen shot 2018-06-27 at 18 36 03

@westonruter
Copy link
Member

I do not know. I didn't know that ACF allowed you to edit PHP code. I am not familiar enough with ACF to provide further guidance.

@uri3000
Copy link

uri3000 commented Jun 28, 2018 via email

@postphotos
Copy link
Contributor

postphotos commented Jun 28, 2018

@westonruter - I did install the latest alpha build on a test site. I can confirm that ACF fields do render in paired and native mode! 🎉 This test uses custom fields on a custom post type, enabled using the toggles in the settings menu as introduced in v1.0-alpha.

The original post on this thread is very out-of-date as classic/legacy-paired mode probably doesn't work as of pre-0.7 releases.

While I did have errors on my site, they were related to CSS and JS that could be solved as discussed elsewhere in our documentation. (They were related to unsupported components.) As long as you follow ACF's instructions to call its fields, there's nothing I can quickly see that is in conflict with what our plugin does.

@uri3000 - I'm fairly certain you're talking about this other plugin which we do not support.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

10 participants