HTML piece not functioning as intended

[Newlightvisuals]

Hi guys I have searched the forum and have reached out others with the same issue but no luck as yet.

I am aiming to mint my first HTML interactive piece, I have a fully working HTML webpage which correctly populates the images, and the HTML page works perfectly on Pinata as well. Thus far, I’ve followed the Manifold HTML Documentation to the letter, and have minted it on a manifold claim page.

In spite of this, my token is not displaying correctly on the manifold claim page, OpenSea or LooksRare. After a million trouble shooting errors including changing my code, I am now stuck.

[lyndo]

gm - Can you share the link to the Claim page? Any more information that would help us look into this would be helpful.

[Newlightvisuals]

Thanks Lyndon, the link is

Life Support

I can share the html and files if needed?
This is a simple gallery of 5 images with on click function that transitions between the 5 images. It is working in my browser as intended and I have linked it all through pinata and added the hidden properties in Manifold.

[wilkins.eth]

When I visit your original media on Chrome, windows, it doesnt function either:
https://gateway.pinata.cloud/ipfs/QmfNMgP5QpEKs4V1QPe6BpB8aHXCdcBt38YiyJwj6NmAhw

It only shows one image and clicking does nothing. I see the exact same thing on app.manifold.xyz

Given that it doesn’t work for me properly when hitting pinata directly, I believe there’s an issue with the html itself.

[wilkins.eth]

This is what I see on windows/chrome on both app.manifold.xyz and pinata. None show any clickable area or ability to transition between images:

[Newlightvisuals]

Ah ok that is so weird, it works for me. And if I open the html in a browser it works as well. Is there anyway I can work with you guys to figure out what I need to change?? I understand this is my responsibility here but I honestly have tried everything and ready to admit defeat.

[wilkins.eth]

Sorry. We can’t help with custom html issues. Given that it doesn’t appear to properly function on other browsers nor on opensea or other platforms it’s not something we can look into as it appears the root cause is with the html itself.

If you want to debug further you can try wrapping your html in an iframe, which is all we are doing.

[Newlightvisuals]

Ah ok, so can I just check for the upload to pinata I had uploaded all the images and the js script file then I added all the pinata links for each file into the html and uploaded that as well.
Then in Manifold I added the pinata link to the html file, in the hidden property of the token. Is that correct?

[Newlightvisuals]

Also here is a video of the html working fine for me

[wilkins.eth]

Unfortunately we cannot provide further support as it’s an issue with the html site. Like i suggested, if you want to debug this, you should try wrapping it in an iframe, as that’s how we display the html.

Specifically an iframe that looks like this:

  <iframe
      ref="frame"
      src ="src"
      scroll
      sandbox="allow-scripts"
      allow="camera; microphone; accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture;"
    ></iframe>

Our guess right now is that your html doesn’t work properly within iframes or breaks some sandboxing aspects.

[Newlightvisuals]

I can’t see what you’re talking about here?

[Newlightvisuals]

So in the tutorial it says upload all files as a folder and then point to the html in the token hidden property but nothing about what the links should be in the html, any help with that or too hard?

[wilkins.eth]

Updated post so you can see. Basically your html is broken or incompatible with an iframe. It has nothing to do with how you uploaded it or how you set the metadata (which is correct).