Tworzenie szablonów sekcji HTML z użyciem AI

Tworzenie szablonów sekcji HTML z użyciem AI

Z pomocą ChatGPT lub innej sztucznej inteligencji możesz tworzyć nowe szablony sekcji HTML dla CMS bluetronix, modyfikować istniejące szablony i opracowywać dodatkowe warianty układów dla swojej strony internetowej. Możesz formułować swoje wymagania w pełni indywidualnie jako własny prompt.

Ważne jest, aby tworzone pliki były zgodne z technicznymi zasadami CMS bluetronix. Obejmuje to zwłaszcza układ plików sekcji, znaczniki rozdzielające między różnymi szablonami, oznaczanie własnych plików znakiem _own oraz niezbędne oznaczenia tekstowe CMS.

Formułowanie własnych wymagań

Opisz w swoim promptcie, jaki rodzaj sekcji strony chcesz stworzyć, ile wariantów układów jest potrzebnych oraz jaki styl masz na myśli. Jako podstawę możesz na przykład użyć istniejącego pliku sekcji lub opisać nowy układ.

Do wymagań technicznych możesz dodatkowo sięgnąć po nasz przykładowy prompt. Dokumentuje on wymagania dotyczące kompatybilnych szablonów sekcji HTML, między innymi dla Bootstrap, animacji WOW, responsywnych układów, przycinania obrazów w CMS i oznaczeń tłumaczeń. Możesz również bezpośrednio uwzględnić te wymagania w swoim własnym promptcie.

Poniższy prompt pokazuje możliwą procedurę dla nowych sekcji przeglądowych blogów. Jest to w pełni sformułowany przykład, który można dostosować do własnego projektu.

Przykładowy prompt dla nowych sekcji blogowych

Możesz przejąć prompt, zmienić pojedyncze wymagania lub stworzyć całkowicie własny prompt.

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/

Dostosowanie przykładowego promptu

Dla innych typów sekcji możesz na przykład zmienić nazwy plików i pożądany styl. Zamiast nowych przeglądów blogowych możesz stworzyć sekcje zespołu, banerów, stopki lub inne szablony sekcji HTML. Przy własnym promptcie musisz pamiętać o przestrzeganiu wymaganych zasad CMS oraz ewentualnych szczególnych wymagań wybranej kategorii sekcji.

Własne pliki sekcji są zapisywane z dodatkiem _own i następnie przesyłane przez Menedżera Plików CMS bluetronix do katalogu /bx_Layout/. Dzięki temu Twoje indywidualne szablony są oddzielone od standardowych plików.

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.