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

custom_css_gr
Like
Like Love Haha Wow Sad Angry
41

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

custom_css_plugin_1

Υπάρχει μια ευρεία γκάμα διαθέσιμων 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 σου ολόκληρο ή και ένα μόνο άρθρο. Η διαδικασία που ακολουθείς για να το χρησιμοποιήσεις, είναι η ίδια που έχει προαναφερθεί.

theme_customizer_2

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 σου, έχοντας στο νου σου πάντα την βελτίωση της εμπειρίας του χρήστη!

 

Content Marketing Hero! Η μαγική της δύναμη είναι ότι μπορεί να διαβάζει και να γράφει συνέχεια, χωρίς να κουράζεται ή να βαριέται. Στο Βlog της Top.Host επιλέγει και επιμελείται άρθρα που μπορούν να φανούν χρήσιμα για το site σου.

Δίνοντας το email σου, θα ενημερώνεσαι δωρεάν για προσφορές και νέα της Top.Host. Μπορείς οποιαδήποτε στιγμή να αφαιρέσεις το email σου από τη λίστα παραληπτών. Μάθε περισσότερα στην Πολιτική Απορρήτου.

Σχετικές αναρτήσεις: