安装代码输入插件后,无法在sanity CMS中添加代码块 [英] Unable to add code blocks in Sanity CMS after I install the code-input plugin

查看:26
本文介绍了安装代码输入插件后,无法在sanity CMS中添加代码块的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在学习使用理智CMS和Reaction建立博客。我还是个神志正常的新手。

我应该能够在我的博客帖子中插入代码片段。因此,我已经安装了code-input插件。

根据这里的link,在安装插件之后,我必须在我的模式类型中使用以下代码。 我不知道应该在哪里插入代码。

请帮帮忙。

我的文件夹结构如下:

sanityblog/lockContent.js

/**
 * This is the schema definition for the rich text fields used for
 * for this blog studio. When you import it in schemas.js it can be
 * reused in other parts of the studio with:
 *  {
 *    name: 'someName',
 *    title: 'Some title',
 *    type: 'blockContent'
 *  }
 */
export default {
  title: "Block Content",
  name: "blockContent",
  type: "array",
  of: [
    {
      title: "Block",
      type: "block",
      // Styles let you set what your user can mark up blocks with. These
      // correspond with HTML tags, but you can set any title or value
      // you want and decide how you want to deal with it where you want to
      // use your content.
      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 let you mark up inline text in the block editor.
      marks: {
        // Decorators usually describe a single property – e.g. a typographic
        // preference or highlighting by editors.
        decorators: [
          { title: "Strong", value: "strong" },
          { title: "Emphasis", value: "em" },
        ],
        // Annotations can be any object structure – e.g. a link or a footnote.
        annotations: [
          {
            title: "URL",
            name: "link",
            type: "object",
            fields: [
              {
                title: "URL",
                name: "href",
                type: "url",
              },
            ],
          },
        ],
      },
    },
    // You can add additional types here. Note that you can't use
    // primitive types such as 'string' and 'number' in the same array
    // as a block type.
    {
      type: "image",
      options: { hotspot: true },
    },
  ],
};

sanityblog/schema.js

// First, we must import the schema creator
import createSchema from "part:@sanity/base/schema-creator";

// Then import schema types from any plugins that might expose them
import schemaTypes from "all:part:@sanity/base/schema-type";

// We import object and document schemas
import blockContent from "./blockContent";
import category from "./category";
import post from "./post";
import author from "./author";

// Then we give our schema to the builder and provide the result to Sanity
export default createSchema({
  // We name our schema
  name: "default",
  // Then proceed to concatenate our document type
  // to the ones provided by any plugins that are installed
  types: schemaTypes.concat([
    // The following are document types which will appear
    // in the studio.
    post,
    author,
    category,
    // When added to this list, object types can be used as
    // { type: 'typename' } in other document schemas
    blockContent,
  ]),
});

推荐答案

如果您正确安装了该插件,它现在可以作为架构类型在您的任何其他架构中使用。因此,为了回答您问题,您可以将代码放在Sanity Studio中您想要的代码块的任何位置。我强烈建议您阅读content modelling文档😉

具体地说,对于您的问题,假设您使用sanityBlog/blockContent.js字段表示帖子内容,您可以将其添加到那里。如下所示:

export default {
  title: "Block Content",
  name: "blockContent",
  type: "array",
  of: [
    {
      title: "Block",
      type: "block",
      // ...annotations, styles, lists and marks you already have
    },
    {
      type: "image",
      options: { hotspot: true },
    },
    // Add the code block here 👇
    // it'll show up as one of the blocks available in your
    // Portable Text Editor
    {
      type: "code",
      title: "Code block",
    }
  ],
};
有关可移植文本/富内容字段(type: "block")的详细信息,请参阅block type documentation。如果您想后退一步,请参阅general block content documentation

希望这能帮助🙌

这篇关于安装代码输入插件后,无法在sanity CMS中添加代码块的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆