Ένας χρωματικός συνδυασμός (color scheme) είναι ένα αποθηκευμένο σύνολο χρωμάτων. Κάθε τμήμα του καταστήματός σας χρησιμοποιεί έναν συνδυασμό, οπότε αλλάζετε τα χρώματα σε ένα σημείο και κάθε τμήμα που χρησιμοποιεί αυτόν τον συνδυασμό ακολουθεί.
Πού θα βρείτε τους συνδυασμούς σας
Ανοίξτε τον builder, κάντε κλικ στο εικονίδιο με το γρανάζι και ανοίξτε την καρτέλα Colors. Κάτω από το Schemes βλέπετε μία κάρτα για κάθε συνδυασμό, με τα ονόματα Scheme 1, Scheme 2 κ.ο.κ. Κάθε κάρτα δείχνει μια μικρή προεπισκόπηση των χρωμάτων της.
- Επεξεργασία: κάντε κλικ σε μια κάρτα. Ανοίγει ένας πίνακας με ζωντανή προεπισκόπηση στο πάνω μέρος και όλα τα χρώματα από κάτω.
- Προσθήκη: κάντε κλικ στην κάρτα με το συν στο τέλος. Ο νέος συνδυασμός ξεκινά ως αντίγραφο του τελευταίου σας συνδυασμού.
- Duplicate ή Delete: κάντε δεξί κλικ σε μια κάρτα, ή χρησιμοποιήστε το κουμπί μενού στο πάνω μέρος του πίνακα του συνδυασμού.
- Αλλαγή σειράς: σύρετε μια κάρτα από τη λαβή της.
Μπορείτε να έχετε έως 9 συνδυασμούς. Όταν φτάσετε τους 9, η κάρτα με το συν δείχνει (9/9) και το Duplicate δείχνει Limit reached. Κρατάτε πάντα τουλάχιστον έναν συνδυασμό, οπότε ο τελευταίος δεν μπορεί να διαγραφεί.
Τα χρώματα ενός συνδυασμού
General
- Background: το φόντο του τμήματος.
- Inner background: πλαίσια και κάρτες μέσα στο τμήμα.
- Heading: τίτλοι.
- Text: παράγραφοι και απλό κείμενο.
- Important text: κείμενο που πρέπει να ξεχωρίζει, όπως τιμές και αριθμοί αντίστροφης μέτρησης.
- Badge background: το γέμισμα των σημάτων έκπτωσης, των κορδελών των σετ προϊόντων και των ετικετών εξοικονόμησης των σετ.
- Links και Hover links: σύνδεσμοι, και σύνδεσμοι κάτω από το ποντίκι.
- Border: γραμμές και διαχωριστικά.
- Outline: δακτύλιοι εστίασης και περιγράμματα, για παράδειγμα όταν ένας αγοραστής κινείται στη σελίδα με το πληκτρολόγιο.
- Shadow: το χρώμα των σκιών.
Primary button και Secondary button
Το καθένα έχει Background, Text και Border, καθώς και Hover background, Hover text και Hover border για όταν το ποντίκι είναι πάνω από το κουμπί. Το κύριο κουμπί είναι η βασική σας πρόσκληση για δράση, όπως το κουμπί αγοράς.
Input
Πεδία φόρμας: Background, Label, Text (ό,τι πληκτρολογεί ο αγοραστής), Border και Hover background.
Πώς τα τμήματα επιλέγουν συνδυασμό
Επιλέξτε ένα τμήμα και βρείτε τη ρύθμιση Color scheme. Διαλέξτε έναν συνδυασμό από τη λίστα. Η λίστα έχει έναν σύνδεσμο προς τους χρωματικούς συνδυασμούς σας αν θέλετε να τους επεξεργαστείτε.
Πολλά μπλοκ μέσα σε ένα τμήμα έχουν έναν διακόπτη Use parent color scheme. Όταν είναι ενεργός, το μπλοκ χρησιμοποιεί τα χρώματα του τμήματος γύρω του. Όταν είναι ανενεργός, εμφανίζεται μια ρύθμιση Color scheme ώστε το μπλοκ να χρησιμοποιεί τον δικό του συνδυασμό. Στο μπλοκ συγγραφής αξιολόγησης, το Inherit scheme κάνει το κουμπί του να χρησιμοποιεί τα χρώματα του τμήματος. Όταν είναι ανενεργό, επιλέγετε ένα Button scheme. Άλλα σημεία που χρησιμοποιούν συνδυασμό είναι οι πίνακες μενού της κεφαλίδας και η σελίδα συντήρησης.
Καλό να ξέρετε
- Τα τμήματα θυμούνται τον αριθμό, όχι τα χρώματα. Αν σύρετε το Scheme 3 στην πρώτη θέση, κάθε τμήμα που χρησιμοποιούσε τον συνδυασμό 1 δείχνει τώρα τα χρώματα που μετακινήθηκαν εκεί. Ελέγξτε τις σελίδες σας μετά την αλλαγή σειράς.
- Η διαγραφή ενός συνδυασμού μεταφέρει τα τμήματά του στον αμέσως προηγούμενο συνδυασμό (ή στον πρώτο). Η αντιγραφή (Duplicate) βάζει το αντίγραφο αμέσως μετά το αρχικό και κρατά κάθε τμήμα στα τωρινά του χρώματα.
- Οι συνδυασμοί ανήκουν στην αγορά που επεξεργάζεστε. Αν πουλάτε σε πολλές αγορές, αλλάξτε πρώτα αγορά από τη σημαία.
- Οι αλλαγές γίνονται ορατές στο κατάστημα όταν κάνετε κλικ στο Publish.
Συμβουλές
- Κρατήστε έναν ήρεμο, φωτεινό συνδυασμό για τα περισσότερα τμήματα και έναν έντονο συνδυασμό για το hero και τις προσκλήσεις για δράση.
- Κάντε το κύριο κουμπί να ξεχωρίζει καθαρά από το φόντο.
- Ελέγξτε ότι το κείμενο διαβάζεται εύκολα στο φόντο του, και σε κινητό στο φως της ημέρας.