Add a target="_blank" to hyperlink within Rich Text Content Type

Authors & Editors
2

There’s no way to do this through the Contentful Web App. You can however do it when rendering rich text to HTML.

Check out this tutorial how to do this with JavaScript: https://www.contentful.com/developers/docs/javascript/tutorials/rendering-contentful-rich-text-with-javascript/#customized-rendering

Instead of overriding BLOCKS.PARAGRAPH, you’d override INLINES.HYPERLINK , test the url and then output different markup. That could look something like this:

const options = {
  renderNode: {
    [INLINES. HYPERLINK]: (node, next) => {
      return `<a href="${node.data.uri}"${node.data.uri.startsWith('https://mydomain.com') ? '' : ' target="_blank"'}>${next(node.content)}</a>`;
    }
  }
}
2 Likes