Skip to content

Instantly share code, notes, and snippets.

@khromov
Last active March 1, 2018 11:33
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save khromov/3f0c20e076019b5b11f979caae2b35f5 to your computer and use it in GitHub Desktop.
Save khromov/3f0c20e076019b5b11f979caae2b35f5 to your computer and use it in GitHub Desktop.
Fix broken / overlapping Instagram embed for WordPress
<?php
/**
* Plugin Name: Fix broken Instagram oEmbed
* Description: Fixes an issue with Instagram posts being broken when multiple posts are oEmbedded.
* Version: 1.0
* Author: khromov
*/
/**
* Remove Instagram embed.js script on each embed
*/
add_filter('embed_oembed_html', function($html, $url, $attr, $post_id) {
$regex = '/<script.*instagram\.com\/embed.js.*\s?script>/U';
$regex_2 = '/<script.*platform\.instagram\.com\/.*\/embeds\.js.*script>/U';
if(preg_match($regex, $html) || preg_match($regex_2, $html)) {
add_filter('kh_has_instagram_embed', '__return_true');
$html = preg_replace($regex, '', $html);
$html = preg_replace($regex_2, '', $html);
return $html;
}
return $html;
}, 100, 4);
/**
* Enqueue the embed.js script once at the bottom of the page, if at least one Instagram embed is enqueued
*/
add_filter('wp_footer', function() {
if(apply_filters('kh_has_instagram_embed', false)) :
?>
<script async defer src="//www.instagram.com/embed.js"></script>
<?php
endif;
}, 999);
@AoifeS
Copy link

AoifeS commented Mar 1, 2018

Hello, Im new to this also and dont understand how to install it. I have tried downloading the zip and then moving it into my wordpress folder on my computer and the importing the file it into my wordpress.org via the wordpress importer but it is not showing up in my admin side bar or in my plug ins ( I saved it under plug ins) Can you help me?

@AoifeS
Copy link

AoifeS commented Mar 1, 2018

figured it out! Yay

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment