Link fields in Prismic are not carrying attribute data (other than target="_blank" if you've activated that option in the Link field settings). To be able to manage other link attributes from the CMS UI, you need to:

  • configure specific fields in your custom types to populate the attributes value
  • get some JS to render the links with their attributes

Configuring the custom type

Add a Select field after the Link field so that content editors can select the value of the rel attribute, for example:

"link": {
"type": "Group",
"config": {
"fields": {
"hyperlink": {
"type": "Link",
"config": {
"allowTargetBlank": true,
"label": "hyperlink"
"rel": {
"type": "Select",
"config": {
"options": [
"label": "rel"
"label": {
"type": "Text",
"config": {
"label": "label"
"label": "link"

The CMS UI will look like this:

Now, on your code, you need to render the link along with its attribute. Here is a JS example:

var PrismicDOM = require('prismic-dom');

var link =;
var hyperLink = link.hyperlink;
var linkUrl = PrismicDOM.Link.url(hyperLink, linkResolver);
var targetAttr = ? 'target="' + : '';
var relAttr = link.rel ? 'rel="' + link.rel : '';
var res = `<a ${targetAttr} ${relAttr} href="${linkUrl}">${link.label}</a>`

Did this answer your question?