多彩编程 多彩编程MZPH · CODE BLOG
ARTICLE DETAIL

文章详情

深耕前端与后端开发技术的一线实战笔记与踩坑复盘。

EmDash 视觉内容建模完全指南:10分钟学会创建自定义内容类型,无需写一行代码

EmDash 视觉内容建模完全指南:10分钟学会创建自定义内容类型,无需写一行代码 EmDash 视觉内容建模完全指南:10分钟学会创建自定义内容类型,无需写一行代码【免费下载链接】emdashEmDash is a full-stack TypeScript CMS based on Astro; the spiritual successor to WordPress项目地址: https://gitcode.com/gh_mirrors/emdas/emdashEmDash 是一个基于 Astro 的全栈 TypeScript CMS被称作 WordPress 的精神续作。它最贴心的设计之一就是让视觉内容建模真正零门槛你不需要编写任何代码只需在后台的Content Types内容类型面板中点选字段就能为网站创建任意自定义内容类型如产品、作品集、课程并立刻生成给编辑使用的录入表单。本文带你 10 分钟走完整个流程。什么是视觉内容建模EmDash 用三个简单的概念描述网站存储的所有信息详见 content-model.mdx概念含义例子集合Collection一类内容文章、产品、作者字段Field内容中的一块信息标题、正文、价格条目Entry集合中保存的一条具体记录某一篇已发布的文章例如一个 Posts 集合可以长这样Posts ├── Title 短文本必填 ├── Excerpt 长文本可选 ├── Content 富文本可选 └── Featured image 图片可选数据库自动存储这套模型后台则根据它构建编辑器表单——模型即表单所见即所得。第一步登录后台找到内容类型入口打开你站点地址下的/_emdash/admin并登录在左侧边栏找到Content Types内容类型入口。这是管理员专属区域只有 Admin 角色可以修改内容模型而 Editor 等角色只能管理内容本身权限边界清晰参见 admin-panel.mdx。第二步创建你的第一个集合点击新建集合只需填写三项身份信息复数标签显示在后台的名称如Blog Posts单数标签可选如Blog PostSlug标识符如posts用于查询、API 和数据库。⚠️Slug 请想好再填——它一旦创建就不能修改因为已有查询和数据库列都依赖它。Slug 只能以小写字母开头包含小写字母、数字和下划线最长 63 个字符。接着按需开关集合行为见 collections.mdx行为作用Routable要求公开 slug可配置带日期的 URL 模式Drafts允许先存草稿再发布Revisions保留内容历史快照支持一键回滚Preview为未发布内容提供签名预览链接Search / SEO启用全文搜索 / 自动生成 SEO 元数据Edit locking防止多人同时编辑同一条内容 建议只开启网站真正用到的行为保持模型精简。第三步添加字段——17种字段类型全可视化进入集合编辑后你可以像搭积木一样逐行添加字段。EmDash 内置 17 种字段类型全部通过下拉菜单选择无需写代码内容需求字段类型编辑器中的样子短文本 / 长文本string、text、slug、url文本框、多行文本域数字number、integer小数或整数输入框状态与时间boolean、datetime开关、日期时间选择器固定选项select、multiSelect单选/多选下拉富文本 / 结构化数据portableText、json、repeater、blocks块编辑器、可重复字段组媒体image、file媒体库选择器关联其他内容reference跨集合条目选择器每个字段还可以设置必填、唯一、默认值、长度/范围校验、可搜索、可索引、可翻译等规则完整参考 field-types.mdx。保存后表单会立即按字段类型渲染短文本变输入框、portableText变富文本编辑器、图片字段直接打开媒体库。第四步录入内容并一键发布模型建好后左侧边栏会出现你的新集合。创建条目的标准流程点击集合页的Add New填写必填字段——有标题字段时EmDash 会自动为 slug 生成建议补充正文、封面图、分类等支持字段点击Save首次保存生成草稿并打开固定编辑链接若集合启用了预览先用Preview查看渲染效果点击Publish now确认发布草稿即成为线上版本。之后每次保存修改都只更新草稿访客看到的仍是线上版本直到你点Publish changes——这套草稿/线上分离机制让你可以放心改稿详见 working-with-content.mdx。第五步安全地修改已有模型网站跑起来后想加字段直接在Content Types里操作即可修改即时生效——内容 API、加载器和编辑界面都在运行时读取数据库中的模型参见 schema-evolution.mdx。但要分清两类操作的风险等级✅安全的变更随时可做新增集合、新增字段可为新字段设默认值修改标签、描述、校验规则、字段排序⚠️破坏性变更先备份再做删除字段 删除该列及所有条目的对应值删除集合 删除整张内容表及全部条目现有字段的类型和 slug 在后台不可直接修改string/text/slug三种文本类型之间除外其他类型变更需要内容迁移️ 注意区分把条目移入回收站是可逆的内容操作而字段/集合的删除是模型层操作会真正移除数据。新手常见 3 个坑Slug 想改改不了。创建集合和字段前就把 slug 定好或新建集合替代旧集合。模型改了页面却没变化内容模型决定数据长什么样页面展示还需 Astro 组件查询并渲染该集合——模型是数据侧模板是展示侧。想用代码同步模型可以用 seed 文件如 seed/seed.json描述初始模型但 seed 只在全新数据库首次启动时生效线上模型的演化始终通过后台或emdash schemaCLI 命令完成。相关文档内容模型概念 —— 集合、字段与 TypeScript 类型生成集合与字段 —— 17 种字段类型与集合行为详解字段类型参考 —— 每种字段的取值与校验选项内容工作流 —— 草稿、定时发布、版本恢复线上模式演化 —— 生产环境安全改模型掌握这套集合 字段 条目的建模思路后你可以像搭积木一样为任意主题的网站——博客、电商、作品集——快速定义内容结构全程零代码。【免费下载链接】emdashEmDash is a full-stack TypeScript CMS based on Astro; the spiritual successor to WordPress项目地址: https://gitcode.com/gh_mirrors/emdas/emdash创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表