使用 AI 创建 HTML Section 模板
通过现有的 Section 文件和技术 AI_Prompt 文档，可以为 bluetronix CMS 生成新的自定义 HTML Section 模板，并随后通过文件管理器进行集成。
使用 AI 创建 HTML Section 模板
使用 ChatGPT 或其他 AI，你可以为 bluetronix CMS 创建新的 HTML Section 模板，修改现有模板并为你的网页开发额外的布局变体。你可以将自己的需求个性化形成一个独立的提示。
重要的是，生成的文件必须遵循 bluetronix CMS 的技术规则。特别包括 Section 文件的结构、多个模板之间的分隔标记、自定义文件的标记 _own 和所需的 CMS 文本标记。
制定自己的要求
在你的提示中描述你想要创建的页面部分类型、所需的布局变体数量和你期望的设计。你可以以现有的 Section 文件作为基础，或者描述一个新的布局。
你还可以参考我们的示例提示以了解技术要求。它记录了兼容 HTML Section Templates 的要求，包括 Bootstrap、WOW 动画、响应式布局、CMS 图片裁剪和翻译标记。你可以将这些要求直接纳入自己的提示中。
以下提示展示了新博客概述章节的可能方法。这是一个完全编写的示例，可以根据你自己的项目进行调整。
新博客章节的示例提示
你可以采用提示，更改单个要求或创建一个完全新的提示。
EXAMPLE PROMPT FOR CREATING A NEW bluetronix CMS LAYOUT SECTION
======================================================================
Please create a new custom layout section file for the bluetronix CMS.
Use the attached file:
AI_Prompt_de.txt
as the complete and mandatory technical documentation for all requirements.
Additionally, use the attached existing file:
SectionBlog.txt
as the basis for the current structure and existing section variants.
Task:
Create a new file named:
SectionBlog_own.txt
The file should contain several modern and visually distinct blog overview sections for the bluetronix CMS.
Important:
- All requirements from AI_Prompt_de.txt must be fully followed.
- Use only standard Bootstrap classes.
- Remove any Bootstrap Studio-specific classes.
- Use Bootstrap Icons exclusively.
- All sections must be responsive and work correctly in both Bootstrap Light Mode and Dark Mode.
- Use WOW animations according to the documentation.
- Use only the image URLs approved in AI_Prompt_de.txt and the CMS image cropping syntax documented there.
- Use the required separators.
- Mark all visible text with .
- Use universal English example texts.
- Reuse suitable example texts instead of creating unnecessarily many different text variations.
- Text length must match the respective layout.
- Always use href="#" for links unless another URL is specified in the documentation.
- Use colAll for suitable repeatable columns.
- Ensure visually consistent spacing, column gaps, and border radii.
- Do not split HTML tags across multiple lines.
- Indent HTML using exactly 3 spaces per level.
- Do not create blog detail pages. Create only blog sections for index or overview pages.
- Do not modify technical CMS markers or required CMS structures.
- Validate the completed HTML against the checklist in AI_Prompt_de.txt.
Additionally, create the following file:
_LangTexts.txt
This file must contain every visible text used in SectionBlog_own.txt.
Requirements:
- One text per line.
- Without the markers.
Output:
1. SectionBlog_own.txt
2. _LangTexts.txt
Do not display the code only in the chat. Generate both files as downloadable files.
After creation, the SectionBlog_own.txt file will be uploaded via the bluetronix CMS "Datei - Manager" to the following directory:
/bx_Layout/
调整示例提示
对于其他 Section 类型，你可以更改文件名和所需的设计。除了新的博客概述，你还可以创建团队、横幅、页脚或其他 HTML Section 模板。在自定义提示中，你需要确保遵循所需的 CMS 规则，并考虑所选 Section 类别的特殊要求。
自定义 Section 文件将以 _own 结尾保存，并随后通过 bluetronix CMS 文件管理器 上传到目录 /bx_Layout/。这样你的自定义模板将与标准文件分开。
EXAMPLE FOR USING A DIFFERENT SECTION
==========================================
For a different section type, only the filenames need to be replaced.
For example:
SectionBlog.txt
SectionBlog_own.txt
Replace with:
SectionTeam.txt
SectionTeam_own.txt
or:
SectionFooter.txt
SectionFooter_own.txt
All requirements from AI_Prompt_de.txt remain unchanged.
常见问题
客户常问我们的问题
我可以使用自定义 KI 提示创建 HTML Section 模板吗？
是的。你可以完全自己表达你的需求。描述你需要哪种类型的页面部分，要生成多少个变体，以及你想要的设计。生成的文件必须遵循bluetronix CMS的技术规则。
我必须不变地使用示例提示吗？
不。博客提示仅是一个示例。你可以调整它，或者为团队、横幅、页脚和其他HTML部分模板编写自己的提示。
文件AI_Prompt_de.txt有什么用？
它包含兼容的HTML部分模板的技术要求，例如Bootstrap、WOW动画、响应式布局、CMS图像裁剪和翻译标记。你可以将其作为参考，或在自己的提示中直接描述所需规则。
我可以使用现有的部分文件作为基础吗？
可以。在这个示例中，SectionBlog.txt作为已有结构和可用变体的基础。你也可以使用其他现有的部分文件，或者描述一个新的布局。
AI在博客示例中应该创建哪个文件？
在示例中，会创建SectionBlog_own.txt。它包含多个视觉上不同的博客概述部分，但不包含博客详细页面。
为什么自主部分文件会添加后缀_own？
通过后缀_own，个性化模板与标准文件分开。标准文件在CMS更新时可能会被覆盖。
如何在一个文件中区分多个布局变体？
不同的变体通过精确写作的CMS标记<!--__SP_SectionTemplate__-->分隔。该标记在AI创建时不得更改。
为什么可见文本必须被标记？
为了翻译处理，可见文本用CMS标记­包围。在示例中，生成的部分应包含通用英语示例文本。
文件_LangTexts.txt包含什么？
它包含生成的部分文件中的每个可见文本，每行一个文本，且不带标记­。
示例提示中提到哪些布局要求？
部分应使用原始的Bootstrap类和Bootstrap图标，具有响应性，并且在明亮模式和黑暗模式下都能正常工作。此外，提示中提到WOW动画、可用的CMS图像路径和适合重复列的类colAll。
我如何将博客示例提示调整为其他部分？
更改文件名和所需的布局类型。例如，对于团队模板，使用SectionTeam.txt和SectionTeam_own.txt，对于页脚模板，使用SectionFooter.txt和SectionFooter_own.txt。同时考虑适用的技术和类别特定要求。
成品的自主部分文件上传到哪里？
成品_own文件通过bluetronix CMS 文件 - 管理器上传到目录/bx_Layout/。