Last updated on September 25, 2023

ACF oEmbed field not embedding content

Don’t know where to add this snippet? Read our guide: How to add code snippets.

Embedding Content with ACF oEmbed Fields.

The ACF (Advanced Custom Fields) plugin provides a powerful way to add custom fields to your WordPress website. One of the field types it offers is the oEmbed field, which allows you to embed external content such as videos, tweets, or Instagram posts.

However, sometimes you may encounter an issue where the oEmbed field does not automatically embed the content. This can happen if the oEmbed functionality is disabled or if the oEmbed provider does not support the URL you are trying to embed.

To ensure that the oEmbed field properly embeds the content, you can use the wp_oembed_get() function provided by WordPress. This function retrieves the HTML embed code for a given URL.

Here’s an example code snippet that demonstrates how to use the wp_oembed_get() function to embed the content from an ACF oEmbed field:

<?php
function wpsnippets_acf_oembed_field_embed($value, $post_id, $field) {
    if ($value) {
        $embed_code = wp_oembed_get($value);
        if ($embed_code) {
            return $embed_code;
        }
    }
    return $value;
}
add_filter('acf/format_value/type=oembed', 'wpsnippets_acf_oembed_field_embed', 10, 3);
?>

In this code snippet, we define a custom function wpsnippets_acf_oembed_field_embed() that takes three parameters: $value, $post_id, and $field. This function is hooked into the acf/format_value/type=oembed filter, which allows us to modify the value of the oEmbed field before it is displayed.

Inside the function, we first check if the $value is not empty. If it is not empty, we use the wp_oembed_get() function to retrieve the embed code for the given URL. If the embed code is successfully retrieved, we return it. Otherwise, we return the original $value.

By adding this code snippet to your theme’s functions.php file or a custom plugin, you can ensure that the oEmbed field properly embeds the content even if it was not automatically embedded before.

This code snippet can be useful in situations where you want to display embedded content from an ACF oEmbed field on your WordPress website. It ensures that the oEmbed functionality is enabled and retrieves the embed code for the provided URL.

Examples

Example 1: Embedding oEmbed Content with ACF

This example demonstrates how to use the Advanced Custom Fields (ACF) plugin to create an oEmbed field that allows users to embed external content into their WordPress posts or pages.

<?php
// Register the oEmbed field
function wpsnippets_register_oembed_field() {
    acf_add_local_field_group(array(
        'key' => 'group_5f9d8d3a3e7a2',
        'title' => 'oEmbed Field',
        'fields' => array(
            array(
                'key' => 'field_5f9d8d4a3e7a3',
                'label' => 'oEmbed',
                'name' => 'oembed_field',
                'type' => 'oembed',
            ),
        ),
        'location' => array(
            array(
                array(
                    'param' => 'post_type',
                    'operator' => '==',
                    'value' => 'post',
                ),
            ),
        ),
    ));
}
add_action('acf/init', 'wpsnippets_register_oembed_field');

This code registers an oEmbed field using ACF’s acf_add_local_field_group() function. The field is added to the post editor for the “post” post type. Users can enter an oEmbed URL or embed code into this field.

Example 2: Retrieving oEmbed Content

This example demonstrates how to retrieve and display the embedded content from an oEmbed field in a WordPress template.

<?php
// Get the oEmbed field value
$oembed = get_field('oembed_field');

// Display the embedded content
echo $oembed;

This code uses ACF’s get_field() function to retrieve the value of the oEmbed field. The embedded content is then displayed using echo. This can be used in a WordPress template file to output the embedded content within the post or page.

Example 3: Customizing oEmbed Output

This example demonstrates how to customize the output of the embedded content from an oEmbed field.

<?php
// Get the oEmbed field value
$oembed = get_field('oembed_field');

// Modify the embedded content
$oembed = str_replace('width="', 'width="100%" ', $oembed);
$oembed = str_replace('height="', 'height="auto" ', $oembed);

// Display the modified embedded content
echo $oembed;

This code retrieves the value of the oEmbed field using get_field(). It then uses str_replace() to modify the embedded content by adding a width of 100% and setting the height to auto. The modified embedded content is then displayed using echo. This allows for customizing the appearance of the embedded content.

Last updated on September 25, 2023. Originally posted on October 11, 2023.

Leave a Reply

Your email address will not be published. Required fields are marked *