Some guidance with h5p and wordpress iFrame

Submitted by tscheff on Fri, 02/09/2018 - 04:56
Forums: 
General discussion

I am struggling to figure out how to properly set up the iFrame embedder with wordpress. I am ultimately trying to integrate Marzipano with H5P into wordpress. If anyone could assist me, that would be more than amazing. Thanks!

BV52's picture

BV52

Fri, 02/09/2018 - 06:48

Hi tscheff,

I'm not sure I follow. What exactly are you having trouble with? Could you please elaborate on this.

-BV52

otacke's picture

otacke

Fri, 02/09/2018 - 08:57

Hihi tscheff!

It's a problem with "Mixed Content", I guess. You can learn more about it in a brief video that I created,

I suppose your server is using SSL encryption (your URL starts with https), but I Marzipano does not (their URL starts with http). For security reasons, you cannot embed "unsecure content" in a secured environment.

Best,

Oliver

tscheff

Fri, 02/09/2018 - 15:58

Would the same problem hold true if I am serving the Marzipano files from my own webserver? That is the approach I am taking, but I am having a hard time figuring out what file I am supposed to place in the source input.

 

I appreciate the help and responses!

otacke's picture

otacke

Fri, 02/09/2018 - 17:26

Hi tscheff!

If you're serving the file from your own server, that's great, because it would eliminate the mixed-content issue and may eliminate certain other problems.

In the source field, you're supposed to enter a regular URL of a common website. It will then be rendered within the frame you're giving it using H5P.Embed. For example -- if the Marzipano website supported SSL -- you could enter https://www.marzipano.net/demos/sample-tour/index.html for the sample tour content.

tscheff

Fri, 02/09/2018 - 17:40

So it must be a full URL and not a direct link to the index.html file hosted in the server? If that makes sense? Again, I apologize but I am pretty novice when it comes to these situations.

 

Example: I need to make a marzipano page on its own, then link that Marzipano URL into the h5p iFrame to be embedded into a wordpress page

otacke's picture

otacke

Fri, 02/09/2018 - 18:15

Hi tscheff!

Short version

Use the complete URL to your Marzipano content.

Long version

You can either use a so called absolute path such as https://.../my-marzipano-content/index.html or a so called relative path such as merely index.html. The problem with the latter one is that it will depend on what your server puts in front if it (that's why it's relative). You could find that out if you have a look at the HTML source code of your website. Look for iframe and what's inside the "src" attribute. It will most likely some wordpress path that together with your entry will not point to your Marzipano content. You could "fix" this by starting at the position the path points at and then working your way to your desired position (see https://en.wikipedia.org/wiki/Path_(computing) for more information).

However, I still recommend to use the abolute path. Otherwise, if you share your content, it will break -- because then H5P.Embed would try to look for the Marzipano content on a different server than yours.

I hope my explanation was intelligible and useful for you?