question Re: Prevent clickable image in knowledge article in ServiceNow AI Platform forum

Prevent clickable image in knowledge article

Matt Lodge — Fri, 06 Mar 2020 14:43:34 GMT

I have an image in a knowledge article that has a hyperlink attached to it. When I click on the image the image opens up and then the link takes me to the new page,

How do I stop the image opening and just the url activating?

Re: Prevent clickable image in knowledge article

Miguel Donayre — Fri, 06 Mar 2020 15:31:32 GMT

Hello @mattlodge

Yes there is. Open the Knowledge article in the edit mode. in the article body highlight the image that has the hyperlink. Once it highlight click on the "break chain" icon

Re: Prevent clickable image in knowledge article

Matt Lodge — Mon, 09 Mar 2020 16:57:02 GMT

Hi @Miguel Donayre

Thanks for your reply.

Doing this removed the URL to the site I want to direct people to when clicking on the image.

What I want to happen is to be directed to the new page but I don't want the image to enlarge. Currently when I click on the image (which is a button) the image is enlarged and then a new window is opened (by design) and I'm directed to the new page. When I go back to the KB article, the image of the button I clicked on is still enlarged.

Does that make sense?

Re: Prevent clickable image in knowledge article

Miguel Donayre — Mon, 09 Mar 2020 17:51:34 GMT

Try this go to

Navigate to Service Portal > Page Route Maps.
Open the Knowledge Article View record

- open it uncheck the "active" option -

If you have HR / ESP uncheck those as well.

Keep in mind this will affect all images in the KB.

Re: Prevent clickable image in knowledge article

Sarup Paul — Sun, 12 Apr 2020 02:16:16 GMT

Seems like the ask is that when the image has an associated link, then dont show the image viewer, but redirect to the link.

I will pass the feedback to my Product team.

Re: Prevent clickable image in knowledge article

Matt Lodge — Tue, 14 Apr 2020 07:57:43 GMT

Perfect, thank you Sarup and thank you Miguel.

Regards

Re: Prevent clickable image in knowledge article

Alex87 — Tue, 03 Aug 2021 11:31:56 GMT

hi there, did you already found the solution for this issue? im facing the same problem. Want images as buttons to a new article.. but they still enlarge.. when someone clicks on it. 😞

Re: Prevent clickable image in knowledge article

Phillip26s — Sat, 07 Aug 2021 12:30:23 GMT

Hi Matt, I have found that if you use "pointer-events: None;" in the image code it works as you intended. The intention below is to toggle the display of more text by clicking on a button image, and then display text below it. (previously it would do this, but also display the enlarged button as well).

Some commentators advise to use the <div> wrapper so the that the pointer events attribute does not extend to other other images in the article.

<div><details>
<summary><img style="pointer-events: none; align: baseline;" title="" src="sys_attachment.do?sys_id=8ca21ee5dbb9f890246a0af6f39619" alt="" width="154" height="55" align="baseline" border="" hspace="" vspace="" /></summary>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
</details></div>

Re: Prevent clickable image in knowledge article

mikej2 — Fri, 27 Aug 2021 12:38:27 GMT

I'm also looking for a solution here.

Re: Prevent clickable image in knowledge article

Pradeep51 — Tue, 16 Nov 2021 11:17:34 GMT

any suggestions found yet? Please let me know as well.

@Phillip26s i tried yur suggestion, but it is not working.

Hope you got the requirement?

When clicking an image (with hyperlink) on portal for a KB article, the image is opened on same window.

We need to restrict this pop-up image

Re: Prevent clickable image in knowledge article

Pradeep51 — Tue, 16 Nov 2021 11:29:36 GMT

@Phillip26s

sorry it worked.

Many Thanks phillip26s

Re: Prevent clickable image in knowledge article

Nicole McCleaf — Fri, 06 May 2022 23:39:33 GMT

Yes, I too would love to know how to fix this. Not a great user experience. Thank you!

Re: Prevent clickable image in knowledge article

Phillip26s — Mon, 09 May 2022 03:55:45 GMT

Hi Nicole,

The code I use is as below. This is a button that, when clicked on, takes you to a tag in another article, that is, it does not pop-up the image. The trick seems to be to add the Pointer-events tag to the image style as below in red.

</a> </strong></p>

Regards,

Re: Prevent clickable image in knowledge article

Nicole McCleaf — Mon, 09 May 2022 17:15:17 GMT

@Phillip26s: Thank you for the response. I tried using style="pointer-events: none;" before posting and it doesn't seem to work. The image no longer pops up, but the link/anchor gets stripped out. This solution creates a different problem.

Re: Prevent clickable image in knowledge article

Grace Bedford — Mon, 09 May 2022 21:07:50 GMT

Does the following work?

Paste the desired picture into the body of the article
Highlight the picture
Click Insert/edit link
In the Insert/Modify Link window:

Type =URL
URL = <desired link>
Target = New window (_blank)

Re: Prevent clickable image in knowledge article

Stephanie Brant — Sun, 15 May 2022 14:07:22 GMT

I finally found the answer about how to prevent the pop-image.

https://support.servicenow.com/kb?id=kb_article_view&sysparm_article=KB0999611

Re: Prevent clickable image in knowledge article

Nicole McCleaf — Thu, 19 May 2022 16:36:04 GMT

This works; however, when I try to add a link to the image, pointer-events: none disables the hyperlink. This should be standard functionality.

Re: Prevent clickable image in knowledge article

Alexander17 — Tue, 29 Nov 2022 14:24:06 GMT

Hi, did anyone find the solution. The pointer-events: none style part only limit the area where the hyper link in the picture is visible. With otherwords, the picture itself is not whole clickable anymore.. and a small horizontal in the middle of the picture. @Servicenow_1, is there any fix for this issue in the pipeline?

Re: Prevent clickable image in knowledge article

Alexander17 — Tue, 29 Nov 2022 14:26:45 GMT

@Sarup Paul , any news on this?

Re: Prevent clickable image in knowledge article

Alex87 — Thu, 01 Dec 2022 12:07:07 GMT

Hi, i would like to know the answer. we are facing similar issues.