Embedding from Wordpress H5P not showing on other sites

Hi There, 

I've recently started using H5P and have created a few activities on my Wordpress site, however, I'm having difficulty getting it to embed on other websites.  For example, if I copy the embed code and paste it into a blog post on my own site it works fine.  However when I copy the embed code and say paste it into Teachable and Thinkific (LMSs), I see a grey box representing the iframe but it says it wasn't able to connect to my site.

I've read that the issue could be to do with mixed content http and https, however my site has a SSL Certificate installed and so starts with https as do the sites I'm trying to embed content on.  Here's an example of the embed code from a test activity I've created, I'd really appreciate any guidance on how to get this to embed on other sites.

 <iframe src="https://www.vuesolutions.co.uk/wp-admin/admin-ajax.php?action=h5p_embed&..." width="759" height="611" frameborder="0" allowfullscreen="allowfullscreen"></iframe><script src="https://www.vuesolutions.co.uk/wp-content/plugins/h5p/h5p-php-library/js..." charset="UTF-8"></script> 

Thanks in advance.

P.s. I'm creating the content on my own site rather than on H5P.org to keep it private. 

otacke's picture

Hi nadyanathan!

It seems that your server has set the HTTP header's x-frame-option to "sameorigin". This prevents the content from being embedded in other pages. Please consult https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options for reference.

Best,
Oliver

Hi Oliver,

Thanks for coming back to me yesterday re what the problem seems to be, I really appreciate it.  I'm trying to find that particular x-frame-options line of code on my site at the moment, so as to adjust it bust struggling to find it.  Tried adding it to .htaccess file but no change, so need find the original location on the server and adjust it there.  Will let you know once sorted.

Kind Regards, 

Nadya     

Hi Nadya is the issue fixed. I am same issue. Created H5p content in primary site and broadcasted to subsite. But in subsite it is not loading. Any piece of advise will help to move. Thanks in advance.

I have the same issue. Can Someone help how to allow access to my h5p content per iframe on other sites?

 

otacke's picture

Hi!

If it's the very same problem, have you followed the link that I provided before? It contains sections on configuring the server (Apache/nginx). If you don't know how that works, your site's admin should be able to help you.

Best,

Oliver 

I have the same problem, too. I used a plug-in to set the X-Frame option to allow for the site I'm trying to embed in, and it still doesn't work. 

Hello. i just want to ask if there are some articles that i could read and could give me insights as to how i can embedd the h5p content i made in wordpress website to thinkific. many thanks! cheers!

 

 

 

otacke's picture

Hi Let!

It depends. Do you merely mean how to embed in general? https://h5p.org/documentation/for-authors/the-basics

Do you mean you tried that and it didn't work?

Could be that thinkific (I don't know it) doesn't allow to enter HTML. Bad luck then. Could be that they filter out iframe tags. Also bad luck then. Could be that they allow iframe tags but not script tags. H5P content will not resize properly then.

Could also be that your server that hosts WordPress doesn't allow content from your server to be embedded elsewhere. You should search for X-Frame-Options.

Best,

Oliver 

Thank you Oliver.

BV52's picture

Hi All,

If my memory serves me right, Thinkific only accepts the embed URL but not the scripts, ie https://bv-demo.h5p.com/content/1291311840592591469/embed

-BV