0

I am trying to set up a clickable image on my SharePoint site that navigates to another SharePoint page when clicked. I am using Embed Web Part and iframe. Here's what I have so far:

  1. HTML Structure

I am using an iframe to point to an HTML file stored in my SiteAssets folder. The HTML includes an image with a clickable image map:

<iframe src="xxx/embed.aspx?UniqueId=<guid>" width="640" height="360" frameborder="0" scrolling="no" allowfullscreen title="process9"></iframe>

HTML (in SiteAssets folder):

<img src="xxx/SiteAssets/Prozess1.png" usemap="#processmap" alt="Process Map">

<map name="processmap">
    <area alt="kunde-tcc" title="kunde-tcc" href="../../SitePages/lorem-ipsum.aspx?env=Embedded" target="_self" coords="224,160,224,121,124,121,128,141,125,159" shape="poly">
    <area alt="produktion-steuern" title="produktion-steuern" href="../../SitePages/lorem-ipsum.aspx?env=WebView" target="_self" coords="270,121,275,138,268,157,367,159,372,140,365,121,365,122" shape="poly">
</map>
  1. Problem

Clicking on the image map areas results in the following console error:

Blocked script execution in '' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.

Blocked script execution in 'xxx/SitePages/lorem-ipsum.aspx?env=WebView' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.

I have tried both ?env=Embedded and ?env=WebView in the URLs to show only the page content, but the error persists.

  1. Attempted Solutions

I attempted to set iframe permissions:

sandbox="allow-scripts allow-same-origin allow-forms allow-top-navigation"

But SharePoint blocks these permissions.

When I remove the sandbox attribute using the browser's developer tools, the navigation works as expected, but I can't do this in production.

  1. Question

Is there a workaround that allows me to navigate between SharePoint pages from the image map within the iframe, without triggering the sandbox restrictions? Or do I need to take a different approach?

Improve this question

1 Answer 1

Reset to default
1

It sounds like you're encountering a common issue with sandbox restrictions in SharePoint when trying to use iframes for navigation. Unfortunately, SharePoint's security model is quite strict, and it doesn't allow certain permissions to be set within iframes for security reasons.

Use SharePoint's Built-in Features: Instead of using an iframe, you can use SharePoint's built-in web parts to create clickable images. The Image web part allows you to add images and link them to other pages directly within SharePoint. This approach avoids the sandbox restrictions altogether.

Improve this answer
1
  • The challenge with the Image web part, as far as I know, is that it only supports a single link per image. Ideally, I’m looking for a way to have multiple clickable areas on one image—similar to how an image map (usemap) works. My goal is to navigate to different pages within the same site. Unfortunately, I don't believe it's possible to layer images or overlay quick links on top of an Image web part. Do you have any ideas on how this could be achieved within SharePoint’s framework? Commented Sep 24, 2024 at 10:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.