Δημιουργία HTML Section Templates με AI

Δημιουργία HTML Section Templates με AI

Με το ChatGPT ή μια άλλη AI, μπορείς να δημιουργήσεις νέα HTML Section Templates για το bluetronix CMS, να αναθεωρήσεις υπάρχοντα πρότυπα και να αναπτύξεις επιπλέον παραλλαγές σχεδίου για την ιστοσελίδα σου. Μπορείς να διατυπώσεις τις απαιτήσεις σου ως δικό σου prompt.

Είναι σημαντικό οι παραγόμενες αρχεία να τηρούν τους τεχνικούς κανόνες του bluetronix CMS. Αυτό περιλαμβάνει ιδιαίτερα τη δομή των αρχείων ενότητας, τους διαχωριστικούς δείκτες μεταξύ πολλαπλών προτύπων, τη σήμανση των δικών σου αρχείων με _own και τις απαιτούμενες σημάνσεις κειμένου CMS.

Σχηματισμός δικών σου απαιτήσεων

Περιέγραψε στο prompt σου τι είδους τμήμα σελίδας θέλεις να δημιουργήσεις, πόσες παραλλαγές σχεδίου χρειάζονται και ποια είναι η σχεδίαση που φαντάζεσαι. Ως βάση, μπορείς π.χ. να χρησιμοποιήσεις ένα υπάρχον αρχείο ενότητας ή να περιγράψεις ένα νέο σχέδιο.

Για τις τεχνικές απαιτήσεις μπορείς να ανατρέξεις επιπλέον στο παράδειγμα prompt μας. Αντικατοπτρίζει τις απαιτήσεις για συμβατά HTML Section Templates, μεταξύ άλλων για Bootstrap, WOW-animation, responsive layouts, την περικοπή εικόνας του CMS και τις σημάνσεις μετάφρασης. Μπορείς επίσης να ενσωματώσεις αυτές τις απαιτήσεις απευθείας στο δικό σου prompt.

Το παρακάτω prompt δείχνει μια πιθανή προσέγγιση για νέες ενότητες συνοπτικών blog. Είναι ένα πλήρως διατυπωμένο παράδειγμα και μπορεί να προσαρμοστεί στο δικό σου έργο.

Παράδειγμα prompt για νέες ενότητες blog

Μπορείς να υιοθετήσεις το prompt, να αλλάξεις μεμονωμένες απαιτήσεις ή να δημιουργήσεις ένα εντελώς δικό σου 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/

Προσαρμογή του παραδείγματος prompt

Για άλλους τύπους ενότητας, μπορείς π.χ. να αλλάξεις τα ονόματα αρχείων και την επιθυμητή σχεδίαση. Αντί για νέες συνοπτικές blog, μπορείς να δημιουργήσεις HTML Section Templates για ομάδα, banner, footer ή άλλες. Με ένα δικό σου prompt, πρέπει να προσέξεις να τηρείς τους απαιτούμενους κανόνες CMS και, ενδεχομένως, τις ειδικές απαιτήσεις της επιλεγμένης κατηγορίας ενότητας.

Τα δικά σου αρχεία ενότητας αποθηκεύονται με την προσθήκη _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.