Oh 365 Eh? » How to Insert an Image Map into Your SharePoint Web Page

How to Insert an Image Map into Your SharePoint Web Page

First, are you ready to insert an Image Map into your SharePoint web page?

Do you have a graphic?

No? Follow the instructions here: How to Convert a Smart Art Object into a Graphic

Yes?  Carry on.

Have you created a piece of code that will convert that graphic into a clickable graphic using Image Maps.com?

No?  Follow the instructions here: How to Create Clickable Graphics With Image Maps Without a Subscription

Yes? You are ready to embed the code into a web page on your SharePoint site!

Here’s the steps:

1. Copy the entire piece of code into your clipboard from the Image Maps program.

code

2. Go to your SharePoint site, then navigate the page where you want to insert the Smart Art. In the Page Tab select Edit Page. In the Format Text tab, select Edit Source:

sharepoint-edit-source

3. Paste the  code into HTML Source Code field:

sharepoint-html-source

Voila! Your interactive Image Map is now ready to use. Enjoy!

sharepoint-insert-image-map

17 responses to “How to Insert an Image Map into Your SharePoint Web Page”

  1. Pingback: Oh365 Eh! How to Create Clickable Graphics Using Image Maps Without a Subscription

    1. Yes, that was my intention. It is a screenshot of an example of what the code could look like.
      You actually need to generate that code using the Image Maps program first. This blog post is Step #2.

      Here is a link to my other blog post “How to Create Clickable Graphics With Image Maps Without a Subscription” that explains how to generate that code using the Image Maps program: https://regroove.ca/oh365eh/2014/08/20/create-clickable-graphics-with-image-maps-without-subscription/

      I apologize that my blog post was not clear! I hope the updates I made to the wording have helped.

  3. Hello!

    Thank you very much for this tutorial (and the other two that complete it). Very pragmatic and useful!

  8. I don’t get it!
    What I get at the end is an image. I can’t click on each part.
    Did I miss something?

  9. SharePoint Image Maps is the SharePoint Add-in to create interactive images with eye-catching content from within SharePoint. Images contained within a Picture Library will have the option to create an Image Map directly from the image’s Context Menu. You can even set the content text to be taken from a SharePoint List for easy updates. The generated Image Map is fully responsive and optimized to work across all devices.

    http://sharepointimagemaps.com/

  10. Thank you very much for this awesome tutorial; it actually helped me a lot! 😀

  12. I’ve been struggleing for hours trying to get an image map working in SharePoint before finding this tutorial. Thanks so much!

Comments are closed.