Πώς να κάνετε ένα φόντο με κλίση στο WordPress

Φύλλο στυλ Cascading Ο κώδικας σχεδίασης ιστοσελίδων περιλαμβάνει μια επιλογή διαβάθμισης, ώστε να μπορείτε να προσθέτετε φόντα βαθμίδας CSS μόνο στις ιστοσελίδες WordPress χωρίς να χρειάζεστε εικόνες σε φέτες. Στο WordPress, δεν μπορείτε να εφαρμόσετε την κλίση στην ετικέτα του σώματος όπως θα κάνατε για στερεά υπόβαθρα, αλλά μπορείτε να χρησιμοποιήσετε ένα δοχείο div που αναδιπλώνεται σε ολόκληρο τον ιστότοπο. Πολλά θέματα που βασίζονται σε πλαίσια CSS περιλαμβάνουν ήδη ένα τέτοιο div, αν και μπορείτε να προσθέσετε ένα, αν το θέμα σας δεν έχει.

Βήμα 1

Μεταβείτε στον κατάλογο ** wp-admin ** του και συνδεθείτε στον πίνακα ελέγχου του WordPress. Πλοηγηθείτε στο ** Εμφάνιση ** και κάντε κλικ στο σύνδεσμο ** Editor **. Κάντε κλικ στο σύνδεσμο ** ** header.php ** κάτω από την επικεφαλίδα Πρότυπα για να φορτώσετε το αρχείο HTML που περιέχει την ετικέτα σώματος του ιστοτόπου σας.

Βήμα 2

Αναζητήστε ένα div με ένα ID του "κοντέινερ" την ετικέτα σώματος στο αρχείο header.php. Αν δεν βρείτε ένα, προσθέστε ένα. Εδώ πρέπει να μοιάζει: Αποθηκεύστε το αρχείο κάνοντας κλικ στο μπλε ** Ενημέρωση αρχείου ** κουμπί. Αν προσθέσατε div, φορτώστε ** footer.php ** στον επεξεργαστή και προσθέστε **** ακριβώς επάνω από **** για να κλείσετε τη διαίρεση.

Βήμα 3

Φόρτωση ** στυλ. css ** στον επεξεργαστή. Προσθέστε αυτόν τον κώδικα στο πολύ κάτω μέρος του αρχείου: #container {background-color: # 038394; εικόνα φόντου: γραμμική κλίση (κορυφή, # 038394, # 00CCCC). εικόνα-φόντου: -webkit-γραμμική κλίση (κορυφή, # 038394, # 00CCCC); εικόνα-φόντου: -moz-γραμμική-κλίση (πάνω, # 038394, # 00CCCC); } Ο παραπάνω κώδικας θέτει μια εναλλακτική λύση για προγράμματα περιήγησης που δεν υποστηρίζουν κλίσεις. Η ρύθμιση "φόντο-εικόνα" σε "γραμμική κλίση" δημιουργεί το φόντο κλίσης. Τουλάχιστον, πρέπει να ρυθμίσετε μια κατεύθυνση για να ξεκινήσει η κλίση και στη συνέχεια δύο χρώματα που ξεθωριάζουν το ένα το άλλο. Προσθέστε ξανά αυτή τη γραμμή κώδικα δύο φορές, προσθέτοντας τα προθέματα Webkit και Mozilla για browsers Chrome, Safari και Firefox. Κάντε κλικ στο μπλε κουμπί ** Ενημέρωση αρχείου ** για να αποθηκεύσετε το αρχείο style.css. Το φόντο κλίσης εμφανίζεται τώρα σε κάθε σελίδα της ιστοσελίδας του WordPress.

Συμβουλή

Ορίστε όλα τα περιθώρια στο μηδέν για το "container" div εάν δείτε λευκό κενό γύρω από την κλίση σας.