Πού βρίσκονται αυτές οι ρυθμίσεις
Αυτές οι ρυθμίσεις διαμορφώνονται ανά αγορά, και μέσα σε μια αγορά επηρεάζουν κάθε σελίδα ταυτόχρονα. Ανοίξτε τον builder, επιλέξτε μια αγορά με την καρτέλα αγοράς (εικονίδιο σημαίας χώρας) στην αριστερή πλαϊνή μπάρα και έπειτα πατήστε την καρτέλα Ρυθμίσεις (εικονίδιο γραναζιού). Οι αλλαγές εφαρμόζονται στην αγορά που έχετε επιλέξει και ενεργοποιούνται όταν πατήσετε Δημοσίευση. Για την πλήρη λίστα όλων των ρυθμίσεων, δείτε το άρθρο Οδηγός ρυθμίσεων builder.
Χρωματικά σχήματα
Το Storeep χρησιμοποιεί μια παλέτα έως 9 χρωματικών σχημάτων. Κάθε ενότητα, μπλοκ και στοιχείο στο κατάστημά σας αναφέρεται σε ένα από αυτά τα σχήματα με τον αριθμό του (από 1 έως 9). Η αλλαγή των χρωμάτων ενός σχήματος ενημερώνει άμεσα κάθε ενότητα που το χρησιμοποιεί, σε όλες τις σελίδες.
Ρόλοι χρωμάτων μέσα σε κάθε σχήμα
Κάθε σχήμα ορίζει τους παρακάτω ρόλους χρωμάτων, όλους ορισμένους ως δεκαεξαδικές τιμές χρώματος:
- Φόντο: το κύριο χρώμα φόντου της ενότητας.
- Εσωτερικό φόντο: ένα ελαφρώς αποχρωματισμένο φόντο που χρησιμοποιείται για κάρτες και ένθετες περιοχές περιεχομένου μέσα στην ενότητα.
- Χρώμα επικεφαλίδας: το χρώμα για το κείμενο των επικεφαλίδων.
- Χρώμα κειμένου σώματος: το χρώμα για το κείμενο των παραγράφων.
- Χρώμα τονισμένου κειμένου: ένα χρώμα κειμένου με έμφαση που χρησιμοποιείται για τιμές, σήματα εξοικονόμησης και τιμές αντίστροφης μέτρησης. Συνήθως ο πιο σκούρος ή πιο έντονος τόνος της παλέτας.
- Χρώμα συνδέσμου: το προεπιλεγμένο χρώμα των υπερσυνδέσμων.
- Χρώμα συνδέσμου κατά το πέρασμα: το χρώμα του υπερσυνδέσμου όταν ο αγοραστής περνά τον δείκτη από πάνω του.
- Χρώμα περιγράμματος: το χρώμα για τα περιγράμματα των στοιχείων και τις γραμμές διαχωρισμού.
- Χρώμα περιγράμματος εστίασης: το χρώμα για τους δακτυλίους εστίασης, τις επισημάνσεις επιλογής με πληκτρολόγιο και τα περιγράμματα έμφασης που πρέπει να ξεχωρίζουν περισσότερο από τα κανονικά περιγράμματα.
- Χρώμα σκιάς: το χρώμα για τις σκιές πλαισίων (συνήθως με κάποια διαφάνεια).
- Φόντο κύριου κουμπιού: το χρώμα γεμίσματος για τα κύρια κουμπιά.
- Κείμενο κύριου κουμπιού: το χρώμα της ετικέτας στα κύρια κουμπιά.
- Περίγραμμα κύριου κουμπιού: το χρώμα περιγράμματος των κύριων κουμπιών.
- Φόντο κύριου κουμπιού κατά το πέρασμα: το χρώμα γεμίσματος του κύριου κουμπιού κατά το πέρασμα του δείκτη.
- Κείμενο κύριου κουμπιού κατά το πέρασμα: το χρώμα της ετικέτας του κύριου κουμπιού κατά το πέρασμα του δείκτη.
- Περίγραμμα κύριου κουμπιού κατά το πέρασμα: το χρώμα περιγράμματος του κύριου κουμπιού κατά το πέρασμα του δείκτη.
- Φόντο δευτερεύοντος κουμπιού: το χρώμα γεμίσματος για τα δευτερεύοντα κουμπιά.
- Κείμενο δευτερεύοντος κουμπιού: το χρώμα της ετικέτας στα δευτερεύοντα κουμπιά.
- Περίγραμμα δευτερεύοντος κουμπιού: το χρώμα περιγράμματος των δευτερευόντων κουμπιών.
- Φόντο δευτερεύοντος κουμπιού κατά το πέρασμα: το χρώμα γεμίσματος του δευτερεύοντος κουμπιού κατά το πέρασμα του δείκτη.
- Κείμενο δευτερεύοντος κουμπιού κατά το πέρασμα: το χρώμα της ετικέτας του δευτερεύοντος κουμπιού κατά το πέρασμα του δείκτη.
- Περίγραμμα δευτερεύοντος κουμπιού κατά το πέρασμα: το χρώμα περιγράμματος του δευτερεύοντος κουμπιού κατά το πέρασμα του δείκτη.
- Φόντο πεδίου εισαγωγής: το χρώμα φόντου των πεδίων εισαγωγής φόρμας.
- Χρώμα κειμένου πεδίου εισαγωγής: το χρώμα του κειμένου μέσα στα πεδία εισαγωγής φόρμας.
- Χρώμα περιγράμματος πεδίου εισαγωγής: το χρώμα περιγράμματος των πεδίων εισαγωγής φόρμας.
- Χρώμα ετικέτας πεδίου εισαγωγής: το χρώμα του κειμένου της ετικέτας πάνω από τα πεδία φόρμας.
- Φόντο εστίασης πεδίου εισαγωγής: το χρώμα φόντου του πεδίου εισαγωγής όταν ο αγοραστής το εστιάζει ή περνά τον δείκτη πάνω από αυτό.
Συμβουλές για ισχυρά χρωματικά σχήματα
- Χρησιμοποιήστε ένα ουδέτερο ανοιχτό χρώμα για το Φόντο στις περισσότερες ενότητες και κρατήστε τα έντονα χρώματα για ένα μοναδικό σχήμα έμφασης που χρησιμοποιείται σε ενότητες hero και πρόσκλησης για δράση.
- Κάντε το Φόντο κύριου κουμπιού οπτικά διακριτό από το Φόντο της ενότητας, καθώς το κουμπί πρέπει να ξεχωρίζει καθαρά.
- Κρατήστε το Εσωτερικό φόντο ως μια πολύ ελαφριά απόχρωση του κύριου Φόντου, ώστε τα φόντα των καρτών να διακρίνονται χωρίς να ενοχλούν.
- Στοχεύστε σε αντίθεση τουλάχιστον 4.5:1 ανάμεσα στο Χρώμα κειμένου σώματος και το Φόντο, καθώς και ανάμεσα στο Κείμενο κύριου κουμπιού και το Φόντο κύριου κουμπιού.
Τυπογραφία
Τέσσερις ρόλοι γραμματοσειράς ελέγχουν την τυπογραφία σε κάθε σελίδα. Κάθε ρόλος αντιστοιχίζεται σε μια οικογένεια γραμματοσειρών από τη διαθέσιμη βιβλιοθήκη.
- Σώμα: η κύρια γραμματοσειρά για το κείμενο των παραγράφων και τις περιγραφές.
- Επικεφαλίδα: η γραμματοσειρά για όλες τις επικεφαλίδες σε ολόκληρο το κατάστημα.
- Υπότιτλος: η γραμματοσειρά για δευτερεύοντες τίτλους και υπότιτλους ενοτήτων, που γεφυρώνει το στυλ της επικεφαλίδας και του σώματος.
- Τονισμός: μια στιλιστική γραμματοσειρά για τιμές, σήματα και διακοσμητική έμφαση.
Στις διαθέσιμες γραμματοσειρές περιλαμβάνονται: Inter, Helvetica, SF Mono, New York, System UI, Roboto, Open Sans, Lato, Montserrat, Poppins, Raleway, Nunito, Merriweather, Playfair Display, Lora, PT Sans, PT Serif, Quicksand, Space Grotesk, DM Sans, Syne, Manrope, Outfit, Urbanist, Oswald, Bebas Neue, Abel, Abril Fatface και Acme.
Για καταστήματα με αραβικό περιεχόμενο, οι γραμματοσειρές συνδυάζονται αυτόματα με αντίστοιχες αραβικές: για παράδειγμα, η Inter συνδυάζεται με την Cairo και η Poppins με την Tajawal. Δεν χρειάζεται να επιλέξετε ξεχωριστά την αραβική γραμματοσειρά.
Πλάτος σελίδας
Η καθολική ρύθμιση Πλάτος σελίδας ελέγχει το μέγιστο πλάτος του κύριου πλέγματος περιεχομένου σε pixel. Οι ενότητες που έχουν οριστεί σε πλάτος Σελίδα περιορίζονται σε αυτή την τιμή, ενώ οι ενότητες που έχουν οριστεί σε Πλήρες εκτείνονται πάντα σε όλο το πλάτος της προβολής ανεξαρτήτως. Διαθέσιμες τιμές: 900, 1000, 1100, 1200 (προεπιλογή), 1300 και 1400 px. Σε προβολές στενότερες από το επιλεγμένο πλάτος, οι ενότητες συρρικνώνονται αυτόματα ώστε να γεμίζουν το 100% της οθόνης.
Λογότυπο
Το λογότυπο ορίζεται μέσα στο μπλοκ λογότυπου της ενότητας Κεφαλίδα και μέσα στο μπλοκ Σχετικά με εμάς στο υποσέλιδο. Πατήστε το μπλοκ λογότυπου στον πίνακα ελέγχου και έπειτα πατήστε + Προσθήκη πολυμέσου ή + Προσθήκη εικόνας για να ανεβάσετε το λογότυπό σας από τη συσκευή σας ή να το επιλέξετε από τη βιβλιοθήκη πολυμέσων σας. Μετά το ανέβασμα, ορίστε το πλάτος εμφάνισης (20–300 px) και το ύψος (20–300 px), η άλλη διάσταση κλιμακώνεται αυτόματα για να διατηρηθεί η αναλογία διαστάσεων.
Favicon
Το favicon ορίζεται στο Ρυθμίσεις → Ταυτότητα μάρκας στον builder. Πατήστε το πεδίο favicon και ανεβάστε μια εικόνα (συνιστάται: μια τετράγωνη εικόνα). Το favicon εμφανίζεται στις καρτέλες του προγράμματος περιήγησης και στους σελιδοδείκτες.
Εικόνα φόντου σώματος
Επίσης στο Ρυθμίσεις → Ταυτότητα μάρκας: μπορείτε προαιρετικά να ορίσετε μια εικόνα φόντου για ολόκληρη τη σελίδα. Διαμορφώστε πώς κλιμακώνεται (το Κάλυψη γεμίζει ολόκληρη την προβολή, το Προσαρμογή προσαρμόζει την εικόνα μέσα σε αυτήν) και αν επαναλαμβάνεται (μοτίβο) ή παραμένει ως μία μόνο εικόνα πίσω από το περιεχόμενο που κυλάει.
Καθολικό προσαρμοσμένο CSS και JavaScript
Για προηγμένες προσαρμογές που δεν μπορούν να επιτευχθούν με τις τυπικές ρυθμίσεις, οι Ρυθμίσεις παρέχουν ένα πεδίο Καθολικό CSS (έως 1.000 χαρακτήρες) και ένα πεδίο Καθολικό JS (έως 1.000 χαρακτήρες). Το CSS που εισάγεται εδώ ενσωματώνεται σε κάθε σελίδα του καταστήματος, ενώ το JS που εισάγεται εδώ εκτελείται σε κάθε σελίδα. Χρησιμοποιήστε τα με φειδώ και προτιμήστε την ενότητα Προσαρμοσμένου Κώδικα για προσαρμογές ανά σελίδα.