使用Django-CMS插件系统构建单页应用程序
项目描述
djangocms-cascade
用于处理Django-CMS插件的瑞士军刀。
为什么使用DjangoCMS-Cascade？
DjangoCMS-Cascade 是一组用于Django-CMS 占位符 的插件。与为每个CMS插件创建一个数据库模型不同，Cascade共享一个数据库模型。有效载荷存储在JSON字段中，而不是显式声明每个属性。这还防止我们处理所有类型的讨厌的数据库迁移问题。
特性
完美适用于嵌套网格系统
由于 Cascade 跟踪所有列的宽度，<img> 和 <picture> 元素可以以响应式的方式渲染，因此浏览器只会加载可见视口所需的图像。
扩展插件以添加更多功能
使用JSON字段存储有效载荷为我们提供了更大的灵活性。例如，我们可以通过在运行时配置来丰富我们的插件，增加额外的属性。这可以用来在必要时在不同插件（通过别名名称引用）之间共享属性，添加CSS类和样式，或提供备选渲染模板。
将链接设置到您自己的视图上
这种方法的另一个优点是，我们可以覆盖用于将链接设置到不属于CMS的页面上的功能。这对于我们不希望为所有需要链接的插件（例如图像、图片、按钮和文本链接）重新实现此功能非常有用。
复制内容并将其粘贴到其他地方
由于插件的负载已经序列化，我们可以甚至将它们从支持 djangocms-cascade 的一个站点复制到另一个站点。
文档
在 ReadTheDocs 上找到详细的文档。
在升级到较旧版本之前，请先查看 发布说明。
架构
可插拔的
DjangoCMS-Cascade 非常模块化，将其CMS模块按功能分组。这些组必须在项目的 settings.py 中独立激活。还可以仅激活组中的某些插件。目前实现了 Bootstrap-4，但此应用程序可以轻松扩展到其他CSS框架。
可单独配置
每个 Cascade 插件都可以单独进行样式设计。网站管理员可以指定可以添加到每个插件中的CSS样式和CSS类。然后页面编辑可以从中选择一个允许的样式，以相应地采用其元素。
重用您的数据
每个 Cascade 插件都可以由网站管理员配置，以共享部分或全部数据字段。例如，这有助于将对外部URL的引用保留在中心位置。或者，它还可以用于一次性调整具有特定属性的所有共享图像的大小。
分割DOM
甚至可以将插件分组到单独的评估上下文中。例如，这用于根据用户是否经过身份验证或匿名来渲染不同的插件。
响应式图像
在现代网络开发中，图像必须适应它们被渲染的列宽。因此，除了众所周知的 src 属性之外，<img ...> 标签还接受额外的 srcset，每个媒体查询一个。在这里，djangocms-cascade 根据当前列布局以及所有媒体断点计算每个图像所需宽度。
这还适用于所有具有 <source srcset="..."> 的 <picture> 元素及其子元素。
它还支持超过一个物理像素的逻辑像素的分辨率，如Retina显示屏中所见。
其他功能
- 使用首选CSS框架的脚手架技术将占位符细分为 网格系统。
- 通过允许每个元素使用 堆叠到水平 类来充分利用响应式技术。
- 使用样式 按钮 添加链接。
- 将特殊内容包装在 Jumbotron 或 Carousel 中。
- 以响应式方式添加
<img>和<picture>元素，使多个图像URL指向调整大小的源，每个视口使用srcset标签或<source>元素。 - 使用分割来有条件地渲染DOM的部分。
- 暂时隐藏一个插件以在DOM中显示。
- 从 Fontello 上传自定义字体并将其图标用于纯文本或作为框架吸引眼球的元素。
- 很容易将首选CSS框架的附加元素集成进来。例如，实现Bootstrap Carousel只需要50行Python代码和两个简单的Django模板。
- 由于所有数据都存储在JSON中，如果插件中添加、修改或删除字段，则不需要数据库迁移。
- 目前支持 Bootstrap-4，但可以轻松以插件方式添加其他CSS框架。
- 遵循“内置电池”哲学，但仍然保持非常模块化。
除了轻松实现任何类型的插件外，DjangoCMS-Cascade 还使得添加可重用辅助工具成为可能。此类辅助工具通过额外的、可配置的功能丰富插件。
- 通过使一些插件字段可共享，可以重复使用这些值用于同一类型的其他插件。例如，这对于图像和图片插件非常有用，因此图像始终调整大小到预定义的值。
- 通过允许额外字段，可以添加可选的
id标签、CSS类和内联样式。这可以在插件和站点基础上进行配置。 - 可以自定义与插件一起提供的渲染模板。
- 由于所有数据都是JSON，可以将一个占位符的内容导出并插入到另一个占位符中，甚至在其他网站上。例如，这有助于将测试站点的页面转移到生产环境中。
感谢帮助
如果有人想要为除Bootstrap-4/5之外的CSS框架启动一个子项目。
如果您是英语母语者，请检查文档中的拼写错误和语法错误，因为英语不是我的母语。
下载文件
下载适用于您的平台的文件。如果您不确定选择哪个，请了解更多关于安装包的信息。
