Working webpage within skin

Special forum to share and discuss skins for Pano2VR and Object2VR
Post Reply
tarsz
Posts: 22
Joined: Tue Oct 15, 2019 8:28 pm

Hey!
I'm using the 7beta version of Pano2VR.
I'd like to embed a webpage within the skin. I tried searching for a how-to, but found nothing. Can anyone help me?
For example a myalbum link: https://myalbum.com/album/cc0cRaWhajJ2
There is an embed code: <iframe width="850" height="478" src="https://myalbum.com/embed/cc0cRaWhajJ2" frameborder="0" allowfullscreen></iframe>
The problem is I have no idea what element I can use this in. I tried Code Element, but it didn't work, and I don't know javascript.

I also tried the Web Element within the panorama tour, but I want a still skin element, and also that didn't work well either, couldn't scroll and even when I tried a youtube video the buttons were off-position and were basically impossible to click.

Thanks in advance!
User avatar
Tony
Posts: 1341
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Hi Tarsz,

What you need to do is to add a Text box to your skin. Here's a quick step-by-step...

1. Add a Text box
2. Set the width and height of the text box using percentages
3. Delete any text that's in there and add your iFrame code
4. Save the skin and republish

Note: if you want to you can add a button that opens the text box

The only problem that you will encounter is that the embed code they provide you doesn't allow you to scroll it only allows you to click and go through to the website. This is what you will see...

Tony-Redhead-7.png
Tony-Redhead-7.png (3.06 MiB) Viewed 1008 times

And here it is working https://p2vr.s3.ap-southeast-2.amazonaw ... index.html

So you will need to load the whole site using the URL https://myalbum.com/album/cc0cRaWhajJ2 This is what you will see...

Tony-Redhead-6.png
Tony-Redhead-6.png (2.61 MiB) Viewed 1008 times


And here it is working https://p2vr.s3.ap-southeast-2.amazonaw ... index.html

Unfortunately, then you see the header of the site. There is a way around this by using an external HTML file, and some CSS and then loading that into the skin. This is what you will see...


Tony-Redhead-5.png
Tony-Redhead-5.png (2.85 MiB) Viewed 1008 times

And here it is working https://p2vr.s3.ap-southeast-2.amazonaw ... index.html

As I mentioned this solution takes a bit more work and I'm happy to discuss it with you.

cheers,

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: https://tonyredhead.com - https://redsquare.com | Pano2VR Tutorials: https://tonyredhead.com/pano2vr | instagram: https://www.instagram.com/tonyredhead/
Post Reply