Opprett HTML-seksjonsmaler med KI

Opprett HTML-seksjonsmaler med KI

Med ChatGPT eller en annen KI kan du lage nye HTML-seksjonsmaler for bluetronix CMS, revidere eksisterende maler og utvikle alternative layoutvarianter for nettsiden din. Du kan formulere kravene dine individuelt som din egen prompt.

Det er viktig at de genererte filene overholder de tekniske reglene til bluetronix CMS. Dette inkluderer spesielt oppsettet av seksjonsfiler, skilletegn mellom flere maler, merking av egne filer med _own og nødvendige CMS-tekstmerkinger.

Formuler egne krav

Beskriv i prompten din hvilken type seksjonsavsnitt du ønsker å lage, hvor mange layoutvarianter som trengs og hvilken design du forestiller deg. Du kan for eksempel bruke en eksisterende seksjonsfil som grunnlag eller beskrive et nytt oppsett.

For de tekniske spesifikasjonene kan du i tillegg konsultere vår eksempelprompt. Den dokumenterer kravene for kompatible HTML-seksjonsmaler, blant annet for Bootstrap, WOW-animasjoner, responsive layouter, CMS-bildetilpasning og oversettelsesmerking. Du kan også ta med disse kravene direkte i din egen prompt.

Den følgende prompten viser en mulig fremgangsmåte for nye bloggoversiktsseksjoner. Dette er et fullt utformet eksempel som kan tilpasses ditt eget prosjekt.

Eksempel-prompt for nye blog-seksjoner

Du kan ta over prompten, endre individuelle krav eller lage en helt egen 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/

Tilpass eksempel-prompten

For andre seksjonstyper kan du for eksempel endre filnavnene og ønsket design. I stedet for nye bloggoversikter kan du få laget team-, banner-, bunntekst- eller andre HTML-seksjonsmaler. Med en egen prompt må du passe på at de nødvendige CMS-reglene og eventuelle spesielle krav til den valgte seksjonskategorien blir overholdt.

Egne seksjonsfiler lagres med tillegget _own og lastes deretter opp til katalogen /bx_Layout/ via bluetronix CMS filbehandler. Dermed forblir de individuelle malene adskilt fra standardfilene.

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.