Skip to content
🎤 Builder Talk: The Story Behind Lady Gaga’s Digital Experience – Register now
Get help on Slack

Adding a mailto reference in markdown/BlockContent in Sanity.io

17 replies
Last updated: Jun 16, 2022
Is there a way to add a 
mailto:
reference in markdown/BlockContent? I tried the following, to no avail:
[myEmail](mailto:myEmail)

Jun 16, 2022, 4:38 PM
url won’t validate a mailto automatically, you could use a string and create a custom validation rule
Jun 16, 2022, 4:39 PM
I need this to be markdown unfortunately, as this piece of formatted text content must feature an email that users can click on.
What do you mean by custom validation rule?
Jun 16, 2022, 4:40 PM
You need to implicitly add 
mailto
in the options
Jun 16, 2022, 4:41 PM
Jun 16, 2022, 4:41 PM
Jun 16, 2022, 4:41 PM
Awesome I didn’t know about that
Jun 16, 2022, 4:41 PM
as this piece of formatted text content must feature an email that users can click on.
on the front end?
Jun 16, 2022, 4:42 PM
Using the annotation (as you’ve done) in Studio will allow you to make it a link in the front-end
Jun 16, 2022, 4:42 PM
I'm assuming you mean to add this as an option within my 
blockContent
schema , not in this particular document's schema, right?
Jun 16, 2022, 4:43 PM
as in, in here? (near the bottom)

export default {
  title: 'Block Content',
  name: 'blockContent',
  type: 'array',
  of: [
    {
      title: 'Block',
      type: 'block',     
      styles: [
        {title: 'Normal', value: 'normal'},
        {title: 'H1', value: 'h1'},
        {title: 'H2', value: 'h2'},
        {title: 'H3', value: 'h3'},
        {title: 'H4', value: 'h4'},
        {title: 'Quote', value: 'blockquote'},
      ],
      lists: [{title: 'Bullet', value: 'bullet'}],
  
      marks: {
        decorators: [
          {title: 'Strong', value: 'strong'},
          {title: 'Emphasis', value: 'em'},
        ],
        annotations: [
          {
            title: 'URL',
            name: 'link',
            type: 'object',
            fields: [
              {
                title: 'URL',
                name: 'href',
                type: 'url',
              },
            ],
          },
        ],
      },
    },
    {
      type: 'image',
      options: {hotspot: true},
    },
  ],
}
Jun 16, 2022, 4:44 PM
yeah, here
annotations: [
          {
            title: 'URL',
            name: 'link',
            type: 'object',
            fields: [
              {
                title: 'URL',
                name: 'href',
                type: 'url',
validation: Rule => Rule.uri({
    scheme: ['http', 'https', 'mailto']
  })
              },
            ],
          },
        ],
Jun 16, 2022, 4:45 PM
If it’s just email addresses, you could rename it
Jun 16, 2022, 4:45 PM
{
                title: 'Email address',
                name: 'email',
                type: 'url',
validation: Rule => Rule.uri({
    scheme: ['mailto']
})
}

Jun 16, 2022, 4:45 PM
it should be also usable for external links
Jun 16, 2022, 4:45 PM
Let me check if this worked 🙂
Jun 16, 2022, 4:46 PM
btw I think you mean 
Rule.url
not .uri correct?
Jun 16, 2022, 4:48 PM
Worked! Thanks so much 🙂
Jun 16, 2022, 4:52 PM

Sanity– build remarkable experiences at scale

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

Get started for freeExplore the demo

Was this answer helpful?

Related answers

Get more help in the community Slack

TopicCategoriesFeaturedRepliesLast Updated
Rendering nested block contentJan 18, 2021
DOMParser is not defined at defaultParseHtmlDec 3, 2020
Next.js and Vercel - Error! No Output Directory named "dist" foundAug 8, 2022
Warning: Data for Page Exceeds the Threshold of 128 kBAug 17, 2022
List Arrays - Is it Possible to Fill a List Array Within a Schema Asynchronously?Mar 16, 2021
Custom Document Views - Is it Even Possible to Use the Structure Builder?Apr 21, 2022
TypeError: Cannot Read Properties of Null (Reading 'jsonType')Sep 28, 2022
Error in custom validation rule for schema in Slack threadAug 18, 2023
GraphQL query resolving references on a _raw field in GatsbyMay 17, 2022
How to populate a list of values in a Sanity schema using a separate fileSep 6, 2021

Related contributions

Turbo Start Sanity
Template

Featured

The battle-tested Sanity template that powers Roboto Studio's websites

Schema UI - Next.js Sanity Starter
Template

Featured

A Next.js starter template with Next.js 15, Tailwind CSS, shadcn/ui, and Sanity CMS with Live Editing. Get production-ready React components with matching Sanity schemas and queries. Build dynamic pages faster while keeping full control over customization.

Serge Ovcharenko

The Swaddle
Made with Sanity

Featured

A new brand identity to represent a more mature company, to signify The Swaddle’s evolution from publisher to production house, combined with an easier to navigate platform that can surface multiple content types - drawing readers through The Swaddle’s content offering.

Nightjar