Προσαρμογή της δομής HTML και της διάταξης μιας σελίδας

Η βασική διάταξη μιας νέας σελίδας

Μία νεοδημιούργητη σελίδα στο bluetronix CMS χρησιμοποιεί αυτόματα το τυπικό σχέδιο. Αυτό το σχέδιο αποτελεί τη βάση HTML στην οποία εμφανίζεται το περιεχόμενο της ιστοσελίδας σου.

Μέσω του τυπικού σχεδιασμού ενσωματώνονται αυτόματα, για παράδειγμα, ένα Header και ένα Footer. Ακόμη, άλλα στοιχεία όπως το κουμπί του chatbot μπορούν να είναι μέρος αυτής της βάσης.

Αν δεν θέλεις να εμφανίζονται συγκεκριμένα στοιχεία ή θέλεις να ενσωματώσεις δικά σου στοιχεία στον σχεδιασμό ως προεπιλογή, μπορείς να προσαρμόσεις τη βάση HTML.

Άνοιγμα του HTML πλαισίου

Άνοιξε Σχεδιασμός ⯈ HTML-Σχεδιασμός.

Εκεί θα βρεις τις υπάρχουσες βάσεις HTML ή τις ορισμένες σχεδιάσεις.

Η πρώτη εγγραφή είναι το Τυπικό Σχέδιο. Αυτό το σχέδιο χρησιμοποιείται προεπιλεγμένα για νέες σελίδες HTML.

Κατασκευή του τυπικού σχεδιασμού

<!DOCTYPE html>
<html class="wide wow-animation" data-bs-theme="__DB_GB_HTMLDarkMode__" lang="__DB_WebSiteLang__">
<head>
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
   __DB_HeadTitle__
   <link rel="icon" href="/img/favicon.ico" type="image/x-icon">
   <script src="__FV_/bx_script/BxHeadScript_own_min.js__"></script>
   <link rel="stylesheet" href="__FV_/bx_style/BxStyle_own_min.css__">
</head>
<body>

__DB_Layout_/bx_Header.html__

<main>
   __DB_Layout_Main__
</main>

__DB_Layout_/bx_Footer.html__

<script src="__FV_/bx_script/BxScript_own_min.js__"></script>
</body>
</html>

Στο τυπικό σχέδιο, μεταξύ άλλων, ενσωματώνονται αυτόματα Header και Footer.

Το πραγματικό περιεχόμενο της σελίδας HTML σου ενσωματώνεται εντός της κύριας περιοχής ή στην ετικέτα __DB_Layout_Main__.

Επιπλέον, το bluetronix CMS θέτει αυτόματα διάφορες τιμές και ετικέτες. Σε αυτές περιλαμβάνονται π.χ. η σκοτεινή λειτουργία του Bootstrap, η γλώσσα και ο τίτλος της ιστοσελίδας.

Επίσης, τα απαραίτητα σενάρια του bluetronix εκτελούνται αυτόματα.

Ο σχεδιασμός Μοναδικής Σελίδας

Εκτός από το τυπικό σχέδιο, είναι διαθέσιμο και το σχέδιο Μοναδικής Σελίδας.

Αυτό το σχέδιο διαφέρει από το κανονικό τυπικό σχέδιο. Εκεί μπορούν, για παράδειγμα, να είναι κρυμμένα το κουμπί συνομιλίας και η ειδοποίηση για τα cookies.

Έτσι, μπορείς να χρησιμοποιήσεις μια άλλη βάση για συγκεκριμένες σελίδες, χωρίς να χρειάζεται να αλλάξεις το τυπικό σχέδιο όλων των άλλων σελίδων.

Δημιουργία δικού σχεδιασμού

Μπορείς επιπλέον να δημιουργήσεις δικές σου εγγραφές σχεδιασμού και να καθορίσεις δικές σου βάσεις HTML.

Σε αυτό το παράδειγμα, δημιουργούμε μια δική μας εγγραφή σχεδιασμού με την ονομασία Δοκιμαστικός Σχεδιασμός.

Εντός αυτού του σχεδιασμού μπορείς να καθορίσεις ποιες συνιστώσες θα ενσωματώνονται προεπιλεγμένα σε μια σελίδα.

Επιλογή σχεδιασμού για μια σελίδα

Τα καθορισμένα σχέδια μπορείς να τα αναθέσεις απευθείας σε μια σελίδα HTML αργότερα.

Για αυτό, άνοιξε τον Επεξεργαστή και πήγαινε στις Ρυθμίσεις Σελίδας.

Πάτα στην επιλογή σχεδιασμού. Εκεί θα σου εμφανιστούν οι υπάρχουσες ορισμένες σχεδιάσεις.

Ακόμη και οι αυτοδημιούργητοι σχεδιασμοί όπως ο Δοκιμαστικός Σχεδιασμός θα προσφέρονται εκεί για επιλογή.

Αλλαγή σχεδιασμού μιας σελίδας

Επίλεξε τη μορφή που επιθυμείς και στη συνέχεια πάτησε Αποθήκευση.

Η σελίδα θα χρησιμοποιήσει στη συνέχεια τη επιλεγμένη μορφή.

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

Περίληψη

Η μορφή καθορίζει το βασικό HTML σκελετό μιας σελίδας στο bluetronix CMS. Οι νέες σελίδες χρησιμοποιούν αρχικά τη προεπιλεγμένη μορφή.

Μέσω του Μορφή ⯈ Layout-Html μπορείς να δεις τις υπάρχουσες μορφές και να δημιουργήσεις τις δικές σου καθορισμένες μορφές. Στη συνέχεια, μπορείς να επιλέξεις τη επιθυμητή μορφή μέσω του Ρυθμίσεις Σελίδας ⯈ Μορφή και να την εφαρμόσεις με Αποθήκευση.