Πώς να τροποποιήσεις το CSS στο WordPress site σου

Αν έχεις υψηλές απαιτήσεις, το πιθανότερο είναι το κλασικό CSS να μη σε καλύπτει και να θες να αλλάξεις κάποια πράγματα σε αυτό ώστε να γίνει το site σου ακριβώς όπως το φαντάζεσαι. Ευτυχώς, η WordPress σού παρέχει τη δυνατότητα να γίνει αυτή η επιθυμία σου πραγματικότητα. Πώς; Στη συνέχεια σου εξηγούμε!

Υπάρχει μια ευρεία γκάμα διαθέσιμων plugins τα οποία μπορούν να σε βοηθήσουν να τροποποιήσεις το CSS σου. Μερικά από τα πιο δημοφιλή είναι:

• Simple Custom CSS
  Το συγκεκριμένο plugin σε βοηθάει να εισάγεις νέα στιλ και να γράψεις πάνω στο υπάρχον CSS. Το εξαιρετικό του χαρακτηριστικό είναι ότι διατηρεί τα στιλ που δημιούργησες ακόμα κι αν αλλάξεις theme! Πήγαινε στον πίνακα ελέγχου σου και επίλεξε Plugins > Add New. Βρες το και πάτησε Install Now. Μόλις η εγκατάσταση ολοκληρωθεί, πήγαινε Appearance > custom CSS και ξεκίνα τις αλλαγές! Η διαδικασία είναι απλή. Aπλά κάνε τις προσθήκες σου στον editor και αποθήκευσε.
• Site Origin CSS
  Και σε αυτή την περίπτωση, το μόνο που χρειάζεται για να προχωρήσεις σε αλλαγές στο CSS σου, είναι να ακολουθήσεις τη διαδικασία που περιγράφηκε παραπάνω.
• WP Add Custom CSS
  Aκόμα ένα αξιόπιστο plugin με το οποίο μπορείς να τροποποιήσεις το site σου ολόκληρο ή και ένα μόνο άρθρο. Η διαδικασία που ακολουθείς για να το χρησιμοποιήσεις, είναι η ίδια που έχει προαναφερθεί.

Aν χρησιμοποιείς έκδοση του WordPress 4.7 και πάνω, τότε μπορείς να τροποποιήσεις το CSS απευθείας στο backend. Η διαδικασία είναι απλή:

•  Πηγαίνεις Themes > Customize στον Πίνακα Ελέγχου.
•  Στην επόμενη σελίδα θα δεις την προεπισκόπηση της σελίδας μαζί με μερικές επιλογές στα αριστερά. Κατέβα προς το κάτω μέρος της οθόνης και θα δεις ένα tab Additional CSS.
• Μόλις κλικάρεις θα ανοίξει ένα πλαίσιο στο οποίο μπορείς να βάλεις το custom CSS.
• Οι εντολές που θα προσθέτεις θα εμφανίζονται στην προεπισκόπηση.
• Όταν είσαι έτοιμος πάτησε Save και Publish.

Συχνά προβλήματα με το custom CSS

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

• Οι αλλαγές δεν εμφανίζονται
  Ακόμα και αφού έχεις προσθέσει το custom CSS, είναι πιθανό να μην εμφανίζονται οι αλλαγές live. Για αυτό μπορεί να φταίει το cache. Δοκίμασε να καθαρίσεις το cache του browser που χρησιμοποιείς καθώς και το cache του site σου.
• Aντικρουόμενες εντολές
  Όταν τροποποιείς το CSS, χρειάζεται προσοχή στη σειρά που επιλέγεις να βάλεις τις εντολές, καθώς ορισμένες φορές μπορεί να αντικρούονται και να μην οδηγούν στο επιθυμητό αποτέλεσμα. Όταν κάτι δε σου εμφανίζεται live, γύρισε πίσω στον κώδικα και δες μήπως με τις προσθήκες σου τον έχεις “μπερδέψει”.
• Συντακτικά λάθη
  Συμβαίνει συχνά! Αν σου ξεφύγει κάποιο γράμμα ή ορθογραφικό, η εντολή δε μπορεί να διαβαστεί και επομένως ούτε να εμφανιστεί. Κάνε επανέλεγχο και χρησιμοποίησε έναν editor που σε βοηθάει να εντοπίζεις τα λάθη.

Τώρα λοιπόν το μόνο που έχεις να κάνεις είναι να επιλέξεις τον τρόπο, και μετά να ξεκινήσεις τις αλλαγές στο site σου, έχοντας στο νου σου πάντα την βελτίωση της εμπειρίας του χρήστη!