Skip to content
Get help on SlackWatch Sanity demo

Adding text to a document without a user field in Sanity.io

5 replies
Last updated: May 30, 2020
Okay I am certain this has asked before, so sorry for (probably) bringing up an "old question", but how would I add some text into a document without giving the user a field to fill in? I want to add something like:
Hello!

This is
__ page, where you can edit __
May 29, 2020, 2:56 PM
This is not as straightforward as it might seem, because you’re looking to use variables in there, for example. You could create a custom input component for this though, one that doesn’t actually show a field 🙂
Have a look at this thread for a general direction and code examples of how to achieve it. You probably won’t need things like the Link import, but the overall principle is the same.


https://sanity-io-land.slack.com/archives/C9Z7RC3V1/p1585700114481400
Let me know if that helps.
May 29, 2020, 5:36 PM
It won't let me access posts prior to April 3rd 😕
May 29, 2020, 6:04 PM
That must have fallen off the 10k limit cliff just now - I could access it when posting half an hour ago. Sorry about that. I’ll find a way to dig this up for you in about an hour 🙂
May 29, 2020, 6:08 PM
No sweat! Highly appreciated! ❤️
May 29, 2020, 6:22 PM
Hi again Per after a long hour 😉
So what you could do is create a custom component for this (rough idea):

// myIntroTextComponent.js
import React from 'react'
import PropTypes from 'prop-types'
import FormField from 'part:@sanity/components/formfields/default'

export default class IntroText extends React.Component {
  static propTypes = {
    type: PropTypes.shape({
      title: PropTypes.string,
      options: PropTypes.shape({
        intro: PropTypes.string.isRequired
      }).isRequired
    }).isRequired
  }

  render() {
    const {type} = this.props
    const {intro} = type.options

    return (
      <FormField label={type.title}>
        {intro}
      </FormField>
    )
  }
}
And then include it in your schema as follows:

import MyIntroTextComponent from '../components/myIntroTextComponent'
...
    {
      name: 'hello',
      title: 'Hello!',
      type: 'string',
      inputComponent: MyIntroTextComponent,
      options: {
        intro: 'This is some page, where you can edit something'
      }
    }
...
You can make the above more flexible and add extra options, import a Link component (
import {Link} from 'part:@sanity/base/router'
), or whatever you need, but hopefully the above helps lay the foundation.
May 30, 2020, 9:25 PM

Sanity– build remarkable experiences at scale

The Sanity Composable Content Cloud is the 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 startedWatch demo

Was this answer helpful?

Categorized in