Η αρχική εικόνα που βλέπει κάποιος όταν επισκέπτεται την ιστοσελίδα σας είναι καθοριστική. Λειτουργεί ως το πρώτο «καλωσόρισμα» και δίνει τον τόνο για το περιεχόμενο που ακολουθεί. Είτε πρόκειται για μια εντυπωσιακή φωτογραφία του ξενοδοχείου σας, είτε για μια προσφορά προϊόντων στο e-shop σας, είτε για μια όμορφη εικόνα που αντιπροσωπεύει την επιχείρησή σας, η σωστή διαχείριση αυτής της εικόνας είναι απαραίτητη. Με το Divi Builder, η διαδικασία είναι απλή και προσφέρει ευελιξία, ακόμη και αν δεν έχετε προηγούμενη εμπειρία. Αυτός ο οδηγός θα σας δείξει βήμα προς βήμα πώς να αντικαταστήσετε τις φωτογραφίες στο κεντρικό banner της ιστοσελίδας σας, εξασφαλίζοντας ότι το site σας παραμένει φρέσκο και ελκυστικό.

Γιατί είναι σημαντικό να αλλάζετε το κεντρικό banner;

Η συνεχής ανανέωση του περιεχομένου του site σας, ειδικά του κεντρικού banner, προσφέρει πολλά οφέλη. Πρώτον, κρατάει το ενδιαφέρον των επισκεπτών σας ζωντανό. Ένα στατικό banner μπορεί να οδηγήσει σε πλήξη και να μειώσει την αλληλεπίδραση. Δεύτερον, σας επιτρέπει να προωθήσετε νέες προσφορές, προϊόντα ή υπηρεσίες άμεσα. Σκεφτείτε ένα ξενοδοχείο που θέλει να αναδείξει ειδικές τιμές για το καλοκαίρι ή ένα ηλεκτρονικό κατάστημα που λανσάρει μια νέα συλλογή. Το banner είναι το ιδανικό σημείο για να το επικοινωνήσετε. Τρίτον, ένα ενημερωμένο site δείχνει επαγγελματισμό και ότι η επιχείρησή σας είναι ενεργή και προσαρμόζεται στις αλλαγές.

Πριν ξεκινήσετε: Προετοιμασία των εικόνων σας

Πριν ανεβάσετε οποιαδήποτε φωτογραφία, είναι σημαντικό να την προετοιμάσετε σωστά. Αυτό όχι μόνο θα εξασφαλίσει την καλύτερη δυνατή οπτική ποιότητα, αλλά και θα συμβάλει στην ταχύτητα φόρτωσης της ιστοσελίδας σας.

  1. Διαστάσεις: Βεβαιωθείτε ότι η εικόνα σας έχει τις κατάλληλες διαστάσεις για το banner. Συνήθως, ένα κεντρικό banner έχει μεγάλο πλάτος και μικρότερο ύψος (π.χ., 1920px πλάτος και 800px ύψος). Εάν δεν είστε σίγουροι για τις ακριβείς διαστάσεις, ελέγξτε τις διαστάσεις της υπάρχουσας εικόνας. Μπορείτε να το κάνετε αυτό κατεβάζοντας την τρέχουσα εικόνα στον υπολογιστή σας και κοιτώντας τις ιδιότητές της.
  2. Μέγεθος αρχείου: Οι μεγάλες εικόνες επιβραδύνουν την ιστοσελίδα. Χρησιμοποιήστε ένα πρόγραμμα επεξεργασίας εικόνας (ακόμα και δωρεάν online εργαλεία όπως το TinyPNG ή το Compressor.io) για να συμπιέσετε την εικόνα σας. Στόχος είναι να κρατήσετε το μέγεθος αρχείου όσο το δυνατόν μικρότερο, χωρίς να θυσιάσετε την ποιότητα. Ένα banner δεν πρέπει να ξεπερνά τα 200-300KB αν είναι δυνατόν.
  3. Μορφή αρχείου: Οι μορφές JPEG (.jpg) ή WebP είναι συνήθως οι καλύτερες επιλογές για φωτογραφίες, καθώς προσφέρουν καλή συμπίεση και ποιότητα. Η μορφή PNG (.png) είναι καλύτερη για εικόνες με διαφάνεια, αλλά μπορεί να έχει μεγαλύτερο μέγεθος αρχείου.

Βήμα 1: Είσοδος στον Divi Builder και επιλογή της σελίδας

Αρχικά, θα πρέπει να συνδεθείτε στον πίνακα ελέγχου του WordPress (το backend του site σας).

  1. Από το αριστερό μενού, πηγαίνετε στις Σελίδες > Όλες οι Σελίδες.
  2. Βρείτε την αρχική σας σελίδα (συνήθως ονομάζεται "Αρχική" ή "Home") και κάντε κλικ στον τίτλο της για να την επεξεργαστείτε.
  3. Μόλις ανοίξει η σελίδα επεξεργασίας, κάντε κλικ στο μεγάλο μπλε κουμπί "Ενεργοποίηση Visual Builder" (Enable Visual Builder). Αυτό θα σας μεταφέρει στο frontend του site σας, όπου μπορείτε να επεξεργαστείτε το περιεχόμενο απευθείας.

Βήμα 2: Εντοπισμός του κεντρικού banner (Ενότητα/Section)

Μόλις ενεργοποιηθεί ο Visual Builder, η σελίδα σας θα εμφανίζεται με διάφορα εργαλεία επεξεργασίας. Το κεντρικό banner είναι συνήθως μια ολόκληρη Ενότητα (Section).

  1. Περάστε το ποντίκι σας πάνω από το κεντρικό banner. Θα παρατηρήσετε ότι εμφανίζονται διάφορα πλαίσια με κουμπιά. Η ολόκληρη ενότητα, που περιλαμβάνει την εικόνα του banner, έχει συνήθως ένα μπλε πλαίσιο με μπλε κουμπιά.
  2. Κάντε κλικ στο γρανάζι (ρυθμίσεις) που βρίσκεται στο μπλε πλαίσιο της ενότητας. Αυτό θα ανοίξει ένα παράθυρο με τις ρυθμίσεις της συγκεκριμένης ενότητας.

Βήμα 3: Αλλαγή της εικόνας φόντου

Μέσα στις ρυθμίσεις της ενότητας, θα βρείτε την επιλογή για την αλλαγή της εικόνας φόντου.

  1. Στο παράθυρο ρυθμίσεων της ενότητας, επιλέξτε την καρτέλα "Περιεχόμενο" (Content).
  2. Αναζητήστε την επιλογή "Φόντο" (Background). Κάντε κλικ σε αυτήν.
  3. Στη συνέχεια, θα δείτε διάφορες επιλογές για το φόντο (χρώμα, κλίση, εικόνα, βίντεο). Επιλέξτε την καρτέλα "Εικόνα" (Image), η οποία αναπαρίσταται με ένα εικονίδιο φωτογραφίας.
  4. Εκεί θα δείτε την τρέχουσα εικόνα του banner. Κάντε κλικ στην εικόνα ή στο "+" για να προσθέσετε μια νέα εικόνα.
  5. Θα ανοίξει η Βιβλιοθήκη Πολυμέσων του WordPress. Εδώ μπορείτε είτε να επιλέξετε μια ήδη ανεβασμένη εικόνα είτε να ανεβάσετε μια νέα.
    • Για να ανεβάσετε μια νέα εικόνα, κάντε κλικ στην καρτέλα "Ανέβασμα Αρχείων" (Upload Files) και, στη συνέχεια, στο "Επιλογή Αρχείων" (Select Files) για να βρείτε την προετοιμασμένη εικόνα στον υπολογιστή σας.
    • Αφού ανέβει η εικόνα, επιλέξτε τη και κάντε κλικ στο κουμπί "Ανέβασμα Εικόνας" (Upload an Image) κάτω δεξιά.
  6. Μόλις επιλέξετε τη νέα εικόνα, θα εμφανιστεί αυτόματα στο banner.
  7. Μπορείτε να προσαρμόσετε και άλλες ρυθμίσεις φόντου, όπως το μέγεθος (π.χ., "Κάλυψη" για να καλύπτει όλο τον χώρο) ή τη θέση, αν το επιθυμείτε.

Βήμα 4: Αποθήκευση των αλλαγών σας

Αφού αντικαταστήσετε την εικόνα και είστε ικανοποιημένοι με το αποτέλεσμα:

  1. Κάντε κλικ στο πράσινο κουμπί με το τσεκ που βρίσκεται στο κάτω μέρος του παραθύρου ρυθμίσεων της ενότητας, για να κλείσετε τις ρυθμίσεις.
  2. Στη συνέχεια, κάντε κλικ στο μοβ εικονίδιο με τις τρεις κουκκίδες που βρίσκεται στο κάτω μέρος της οθόνης (συνήθως στο κέντρο). Αυτό θα ανοίξει το κάτω πάνελ του Divi Builder.
  3. Κάντε κλικ στο πράσινο κουμπί "Αποθήκευση" (Save), που μοιάζει με δισκέτα, για να αποθηκεύσετε όλες τις αλλαγές που κάνατε.
  4. Για να βγείτε από τον Visual Builder, κάντε κλικ στο "Έξοδος από τον Visual Builder" (Exit Visual Builder), που βρίσκεται στο πάνω μέρος της οθόνης.

Σημαντικές συμβουλές για το Divi:

  • Sliders: Εάν το banner σας είναι "slider" (εναλλασσόμενες εικόνες), τότε το κεντρικό banner μπορεί να είναι ένα Module (π.χ. "Slider Module") αντί για μια απλή εικόνα φόντου σε ενότητα. Σε αυτή την περίπτωση, θα πρέπει να κάνετε κλικ στο γρανάζι του συγκεκριμένου Module και να αλλάξετε τις εικόνες μέσα από τις ρυθμίσεις του slider. Η λογική είναι παρόμοια: βρίσκετε την επιλογή "Εικόνα" για κάθε διαφάνεια (slide).
  • Προσαρμοσμένο CSS: Σε κάποιες περιπτώσεις, η εικόνα μπορεί να έχει οριστεί με προσαρμοσμένο CSS. Αυτό είναι πιο σπάνιο για αρχάριους, αλλά αν δεν μπορείτε να βρείτε την επιλογή εικόνας φόντου, ίσως χρειαστεί να ζητήσετε βοήθεια από τον κατασκευαστή του site σας.
  • Αντίγραφα ασφαλείας: Πριν κάνετε σημαντικές αλλαγές, είναι πάντα καλό να έχετε ένα πρόσφατο αντίγραφο ασφαλείας του site σας.

Με αυτά τα βήματα, μπορείτε εύκολα να διατηρείτε το κεντρικό σας banner ενημερωμένο και εντυπωσιακό, προσφέροντας στους επισκέπτες σας μια φρέσκια και δυναμική εμπειρία κάθε φορά που επισκέπτονται την ιστοσελίδα σας.

Εγγραφείτε στο newsletter μας!

Εγγραφείτε στο newsletter μας!

Εγγραφείτε στη λίστα αλληλογραφίας μας για να λαμβάνετε τα τελευταία νέα και ενημερώσεις από την ομάδα μας.

You have Successfully Subscribed!