Link with target blank in rich text/markup?

Questions and Answers
1

Hello,

is there way to set up link with target blank inside Strapi markup?

In version 3.4 there is switcher for choosing if link would be opened in new tab or not but using version 3.6.2 I can’t see that option.

Do I need to install some specific plugin for this option?

Or is there another way with a special syntax like [link](url){:target="_blank"}?

Thanks for some help!

Best regards,

Timo

1 Like
2

¿Tengo el mismo problema, Aún no lo soluciona??

Gracias.

3

My solution is to use @gerhobbelt/markdown-it-attrs - npm for this.

4

Since the strapi markdown editor is not the best one out there you should probably keep it to using javascript. This will of course target all “a” tags inside a content block.

Something like

let links = document.querySelectorAll(".content a");
for (var i = 0; i < links.length; i++) {
  if (links[i].hostname != window.location.hostname) {
    links[i].target = "_blank";
  }
}
5

I solved this by installing react-markdown into my frontend.

Then I used the following markup to open links in new tabs:

<ReactMarkdown linkTarget="_blank" children={...} />