How I integrated iframemanager into WordPress (and ACF).

[KingWebsites]

I thought I'd share my code for how I change YouTube videos that have been added to WordPress to the format required by iframemanager. This detects oEmbed links and actual iframes added to the WordPress WYSIWYG area or ACF fields (WYSIWYG & oEmbed field types). This has not been tested on Guttenberg blocks, just Classic Editor WYSIWYG and ACF fields.

I would be grateful for any improvement ideas or any additional services. I have added it here as I thought it was the best place. Let me know if you think it should be elsewhere, or even it its own repo.

FYI: I am using the Pressidium Cookie Consent plugin, which uses CookieConsent v2, to connect this with my WP site's cookie compliance system.

<?php

if(!defined('ABSPATH')){exit;}

class WP_Iframes_Formatter {

	public function __construct()
	{
		$this->hook_filters();
	}

	private function hook_filters()
	{
		// Check that not admin
		if (!is_admin())
		{
			// oEmbeds in WYSIWYG fields
			add_filter('embed_oembed_html', array($this, 'format_wysiwyg_oembed'), 10, 4);
			// oEmbeds in ACF fields
			add_filter('acf/format_value/type=oembed', array($this, 'format_acf_field_oembed'), 99, 3);
			// iframes in WYSIWYG fields
			add_filter('the_content', array($this, 'format_wysiwyg_iframes'));
			// iframes in ACF fields
			add_filter('acf_the_content', array($this, 'format_wysiwyg_iframes'));
		}
	}

	// Replace oEmbeds in WP & ACF WYSIWYG fields
	public function format_wysiwyg_oembed($cached_html, $url, $attr, $post_id)
	{
		$replaced_iframe = self::replace_iframe_html($cached_html);
		return $replaced_iframe;
	}

	// Replace oEmbeds in ACF oEmbed fields
	public function format_acf_field_oembed($value, $post_id, $field)
	{
		$replaced_iframe = self::replace_iframe_html($value);
		return $replaced_iframe;
	}

	// Replace embedded iframes in WP & ACF WYSIWYG fields
	public function format_wysiwyg_iframes($content)
	{
		$iframes = get_media_embedded_in_content($content, 'iframe');
		foreach ($iframes as $iframe)
		{
			$replaced_iframe = self::replace_iframe_html($iframe);
			$content = str_replace($iframe, $replaced_iframe, $content);
		}
		return $content;
	}

	// Replace iframes HTML
	public static function replace_iframe_html($iframe)
	{
		if (strpos($iframe, 'youtube') !== false) // YouTube
		{
			$iframe = self::replace_youtube_iframe($iframe);
		}
		// To do: Add Google Maps & other common embedded iframes
		return $iframe;
	}

	// Format YouTube iframes for iframemanager JS library
	public static function replace_youtube_iframe($iframe)
	{
		// Get iFrame URL
		$result = preg_match("/<iframe[^>]*src=[\"|']([^'\"]+)[\"|'][^>]*>/i", $iframe, $matches);

		// If URL found
		if (false !== $result && isset($matches[1]))
		{
			$iframe_src = $matches[1];

			// Get YouTube ID from iframe src
			$youtube_id = "";
			$pattern =
				'%^# Match any YouTube URL
				(?:https?://)?  # Optional scheme. Either http or https
				(?:www\.)?      # Optional www subdomain
				(?:             # Group host alternatives
					youtu\.be/    # Either youtu.be,
				|youtube(?:-nocookie)?\.com  # or youtube.com and youtube-nocookie
					(?:           # Group path alternatives
						/embed/     # Either /embed/
					| /v/         # or /v/
					| /watch\?v=  # or /watch\?v=
					)             # End path alternatives.
				)               # End host alternatives.
				([\w-]{10,12})  # Allow 10-12 for 11 char YouTube id.
				%x'
			;
			$result = preg_match($pattern, $iframe_src, $matches);
			if (false !== $result) {
				$youtube_id = $matches[1];
			}

			// Return formatted iFrame
			return '<div data-service="youtube" data-id="' . $youtube_id . '" data-autoscale></div>';
		}
		return $iframe;
	}

}

new WP_Iframes_Formatter();

[KingWebsites]

Here's my routine for replacing Google Map iframes added to WYSIWYG fields with iframemanager compliant code.

I am also using Google Maps elsewhere on my site that are not iframed, but instead use the https://maps.googleapis.com/maps-api-v3 library. These do not seem to leave any cookies on the browser so I can ignore them for now.

public static function replace_google_maps_iframe($iframe)
{
	// Get iFrame URL
	$result = preg_match("/<iframe[^>]*src=[\"|']([^'\"]+)[\"|'][^>]*>/i", $iframe, $matches);

	// If URL found
	if (false !== $result && isset($matches[1]))
	{
		$iframe_src = $matches[1];

		// Get Google Maps ID
		$parts = parse_url($iframe_src);
		parse_str($parts['query'], $query);
		$google_maps_id = $query['pb'] ?? "";

		return '<div data-service="googlemaps" data-id="' . $google_maps_id . '" data-autoscale data-iframe-responsive="true"></div>';
	}
	return $iframe;
}

Quick note. This code works for iFrames that are copied direct from the Google Maps share functionality. This will not work on maps that use the /maps/embed/v1/place + API KEY.