How to Make a Link in a Blog Post Open in a New Tab Instead of the Current Tab

4 replies
Last updated: Feb 9, 2022
How can I make a link in my blog post open in a new tab instead of the current tab? I am using block-content-to-react. I know I need to add
target="blank"
to the anchor tag, but I don't know how to do it using Sanity.
Feb 6, 2022, 9:02 PM
user U
, so from studio you would have to create an option to choose which link target you want to have (e.g. a boolean
blank
) and then on the frontend you can do something like this:
<Link href={href} target={blank ? '_blank' : '_self'}>
Feb 7, 2022, 8:00 AM
Thanks for your reply. I am new to sanity so I don't know how to create that option. And I don't think I need a boolean, I need all the links to be opened in a new tab. Do you know how I can do that?
Feb 7, 2022, 11:56 AM
I got it. I added the following to my serializer:
marks: {
   link: ({ children, mark }) => (
     <a href={mark.href} target="_blank" rel="noopener noreferer">
       {children}
     </a>
   ),
},
Feb 7, 2022, 12:10 PM
well done,
user U
!
Feb 9, 2022, 8:52 AM

Sanity.io – build remarkable experiences at scale

Sanity is a customizable solution that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Categorized in