Η πλαϊνή γραμμή σε ιστότοπους WordPress είναι εμφανής στο επάνω μέρος του ιστότοπού σας.
Καθώς όλο και περισσότερο περιεχόμενο γίνεται μακροσκελής, τα κορυφαία ακίνητα στους ιστότοπους δεν βρίσκονται στην κορυφή. Είναι πολύ πιο κάτω στη σελίδα.
Για να αυξήσετε πραγματικά τις μετρήσεις σας, είτε πρόκειται για νομισματικά είτε για συμμετοχή μέσω email, για κλικ σε προσφορές συνδεδεμένων εταιρειών ή για οποιονδήποτε στόχο έχετε, οι πλαϊνές γραμμές του WordPress που αιωρούνται (ή οι κολλώδεις) διατηρούν την κορυφαία ακίνητη περιουσία σας στην οθόνη.
Με την προϋπόθεση ότι είναι σε επιτραπέζιο υπολογιστή, tablet ή υπολογιστή, δηλαδή.
Ευτυχώς, η προσθήκη μιας αιωρούμενης πλευρικής γραμμής στον ιστότοπό σας στο WordPress είναι πολύ απλή. Το μόνο που χρειάζεται για να το κάνετε είναι ένα απλό πρόσθετο WordPress.
Διαβάστε παρακάτω για να μάθετε ποιο είναι αυτό!
Πώς να αποκτήσετε μια πλωτή πλευρική γραμμή στον ιστότοπό σας στο WordPress;
Η εγκατάσταση του δωρεάν 'Q2W3 Fixed Widget' προσθέτει λειτουργικότητα αιωρούμενης πλευρικής γραμμής στα περισσότερα θέματα WP με αριστερή, δεξιά ή διπλή πλευρική γραμμή. Η ρύθμιση είναι εξαιρετικά απλή και οι κολλώδεις πλευρικές μπάρες σας ρυθμίζονται μέσα σε λίγα λεπτά, είτε πρόκειται για επιτραπέζιους υπολογιστές είτε ακόμη και για φορητές συσκευές.
Εγκατάσταση, ενεργοποίηση και ρύθμιση του πρόσθετου Q2W3 Fixed Sidebar
Κάντε κλικ στο 'Plugins' και πληκτρολογήστε 'Q2W3' (χωρίς εισαγωγικά) στη γραμμή αναζήτησης στην επάνω δεξιά γωνία της οθόνης σας και, στη συνέχεια, πατήστε enter.
Το πρώτο αποτέλεσμα είναι συνήθως το σωστό.
Q2W3 Fixed Widget για WordPress από τον Thomas Maier και τον Max Bond.
Πατήστε «Εγκατάσταση τώρα» και μετά κάντε κλικ στο «Ενεργοποίηση».
Θα εμφανιστεί στη σελίδα των ενεργών προσθηκών σας. Εάν δεν ανακατευθυνθείτε αυτόματα σε αυτήν τη σελίδα, κάντε κλικ στον σύνδεσμο των προσθηκών στην αριστερή γραμμή πλοήγησης.
Κάντε κλικ στις Ρυθμίσεις.
Αυτές είναι καθολικές ρυθμίσεις που σημαίνει ότι επηρεάζουν κάθε αιωρούμενο γραφικό στοιχείο στην πλαϊνή γραμμή σας. Δεν μπορείτε να τα ορίσετε σε ατομικό επίπεδο.
Ο σκοπός είναι να προσθέσετε λίγο CSS για να ελέγξετε την απόσταση από το πάνω και το κάτω μέρος του ιστότοπού σας ή να τα απενεργοποιήσετε εντελώς σε κινητές συσκευές.
Εάν δεν τα αλλάξετε, μπορείτε να βρείτε την επικάλυψη της πλαϊνής γραμμής με την περιοχή του υποσέλιδου.
Τα πεδία 'Πάνω περιθωρίου' και 'Κάτω περιθωρίου' είναι όπου αυξάνετε το διάστημα μεταξύ της πλαϊνής γραμμής, της κεφαλίδας (περιθώριο-πάνω) και του υποσέλιδου σας (περιθώριο-κάτω).
Αυτά θα διαφέρουν ανάλογα με το μέγεθος του λογότυπου, της κεφαλίδας και του υποσέλιδου σας.
Το στοιχείο Stop ID είναι παρόμοιο με το κάτω περιθώριο, μόνο αντί να συνεχίσει να κινείται μέχρι να φτάσετε στο υποσέλιδο, μπορείτε να ορίσετε το στοιχείο HTML της σελίδας σας ως σημείο για να σταματήσει την κύλισή του.
Αυτό είναι βολικό εάν έχετε μια σελίδα πωλήσεων μεγάλης διάρκειας που ολοκληρώνεται με μια μεγάλη φόρμα επικοινωνίας ή μια περιοχή υποβολής που χρησιμοποιείται για τη δημιουργία δυνητικών πελατών ή μια προσφορά CPA.
Για να βρείτε το αναγνωριστικό που θα τοποθετήσετε εδώ, χρησιμοποιήστε το εργαλείο επιθεώρησης του προγράμματος περιήγησής σας. Τα περισσότερα προγράμματα περιήγησης έχουν την επιλογή 'inspect' στο μενού με το δεξί κλικ.
Για να βρείτε το στοιχείο ID, κάντε δεξί κλικ στο πρόγραμμα περιήγησής σας και επιλέξτε την επιλογή 'inspect'.
Αυτό θα ανοίξει μια προβολή διαίρεσης οθόνης με τον ιστότοπό σας στη μία πλευρά και τα στοιχεία στυλ HTML στην άλλη.
Στο παραπάνω στιγμιότυπο οθόνης, μπορείτε να δείτε ότι το επισημασμένο στοιχείο στα αριστερά είναι η περιοχή του γραφικού στοιχείου 'μετά την είσοδο'. Στα δεξιά, η επισημασμένη περιοχή δείχνει ότι το αναγνωριστικό είναι 'custom_HTML-7'.
Για να σταματήσετε την κύλιση της αιωρούμενης πλευρικής γραμμής μόλις φορτωθεί αυτό το στοιχείο, αυτό είναι το αναγνωριστικό που πρέπει να τοποθετήσετε στο πεδίο Stop ID στις γενικές ρυθμίσεις.
Όπου θέλετε το γραφικό στοιχείο να σταματήσει να κάνει κύλιση, επισημάνετε την περιοχή στον ιστότοπό σας, κάντε δεξί κλικ, επιλέξτε επιθεώρηση και αναζητήστε το αναγνωριστικό και, στη συνέχεια, τοποθετήστε αυτές τις πληροφορίες στο πεδίο Stop ID για το Q2W3.
Το διάστημα ανανέωσης έχει οριστεί στα 1500 χιλιοστά του δευτερολέπτου από προεπιλογή και είναι καλό να φύγετε έτσι. Τα μόνα άλλα δύο πεδία που πρέπει να αλλάξουν είναι τα «Απενεργοποίηση πλάτους» και «Απενεργοποίηση ύψους».
Αυτά θα απενεργοποιήσουν τη λειτουργία κύλισης στο κινητό μόνο εάν ορίσετε τις τιμές. Η προσθήκη αποκρίνεται, αλλά σε κινητά, τα γραφικά στοιχεία στοιβάζονται κάτω από το περιεχόμενό σας αντί να εμφανίζονται στην πλαϊνή γραμμή.
Για καλύτερη εμπειρία χρήστη, απενεργοποιήστε τα για μικρότερα μεγέθη οθόνης.
- Για να απενεργοποιήσετε το κινητό, ρυθμίστε το σε απενεργοποίηση περίπου στα 500 px. Τα περισσότερα smartphone έχουν μέγιστο πλάτος 414 pixel.
- Για να απενεργοποιήσετε και σε μικρότερα tablet, ορίστε το πλάτος απενεργοποίησης σε περίπου 750 px.
- Τα μεγαλύτερα tablet μπορούν να διαχειριστούν πλάτος οθόνης περίπου 990 px.
- Οι φορητοί υπολογιστές και οι επιτραπέζιοι υπολογιστές έχουν μεγέθη οθόνης από 1.440 px και άνω.
Οι υπόλοιπες καθολικές ρυθμίσεις για συμβατότητα υπάρχουν για αντιμετώπιση προβλημάτων.
Αφού ορίσετε τις καθολικές ρυθμίσεις, διαμορφώστε ποια γραφικά στοιχεία θέλετε να κολλήσετε στην πλαϊνή γραμμή σας.
Όταν επιστρέψετε στα γραφικά στοιχεία σας τώρα, το καθένα θα έχει ένα κουμπί που μπορείτε να ελέγξετε για να το κάνετε 'σταθερό γραφικό στοιχείο', που σημαίνει ότι θα επιπλέει στην πλαϊνή γραμμή σας μέχρι να φτάσει τις παραμέτρους που έχετε ορίσει στις καθολικές ρυθμίσεις.
Χωρίς την αιωρούμενη πλαϊνή γραμμή, όταν οι χρήστες φτάνουν στο κάτω μέρος της σελίδας, δεν υπάρχει τίποτα άλλο παρά κενός χώρος.
Με τα γραφικά στοιχεία σταθερά στη θέση τους, το περιεχόμενο της πλευρικής γραμμής παραμένει ορατό. Μπορείτε να δείτε στην παρακάτω εικόνα ότι η ενότητα σελίδων (που έχει οριστεί ως σταθερό γραφικό στοιχείο) κινείται προς τα κάτω στην πλαϊνή γραμμή στο κάτω μέρος της σελίδας, αλλά όχι τόσο μακριά ώστε να κυλήσει στην ενότητα του υποσέλιδου.
Για να σταματήσει η κύλιση να τρέχει στο υποσέλιδο, το 'Κάτω περιθωρίου' έπρεπε να οριστεί για αυτό το θέμα στα 430 px.
Χωρίς να το ρυθμίσετε στις καθολικές ρυθμίσεις, θα συνέχιζε την κύλιση προκαλώντας επικάλυψη με το περιεχόμενο στο υποσέλιδο.
Αυτό το padding είναι καλό σε επιτραπέζιους υπολογιστές, αλλά σε μικρότερες οθόνες, καθώς το Q2W3 είναι ένα πρόσθετο με απόκριση, η πλαϊνή γραμμή πέφτει κάτω από το περιεχόμενο.
Για να αποτρέψετε την επικάλυψη κατά την κύλιση για κινητά, πρέπει να χρησιμοποιήσετε τη λειτουργία Stop ID για να σταματήσετε την κύλιση της πλευρικής γραμμής μόλις φορτωθεί στην οθόνη το χαμηλότερο στοιχείο αναγνωριστικού της σελίδας.
Το ίδιο πρόβλημα επικάλυψης συμβαίνει εάν διορθώσετε τη θέση των γραφικών στοιχείων πάνω από τα γραφικά στοιχεία που δεν έχουν σταθεροποιηθεί στη θέση τους.
Όλα τα σταθερά γραφικά στοιχεία σας πρέπει να τοποθετηθούν κάτω από αυτά που δεν έχουν ρυθμιστεί να επιπλέουν. Σε αυτήν την περίπτωση, η ενότητα σελίδων πρέπει να μετακινηθεί στο κάτω μέρος της κύριας πλευρικής γραμμής.
Μπορώ να δημιουργήσω ένα αιωρούμενο κουμπί στην πλαϊνή γραμμή;
Εάν το μόνο που θέλετε είναι ένα αιωρούμενο κουμπί αντί για μια αιωρούμενη πλαϊνή γραμμή, υπάρχει μια προσθήκη που ονομάζεται πρόσθετο Floating Action Button που μπορεί να ταιριάζει καλύτερα.
Μπορεί να γίνει με την προσθήκη Q2W3 Fixed Widget. Εισαγάγετε ένα γραφικό στοιχείο εικόνας, επιλέξτε μια εικόνα από τη συλλογή πολυμέσων σας και χρησιμοποιήστε το πεδίο 'σύνδεσμος προς:' για να δημιουργήσετε έναν υπερσύνδεσμο.
Το πρωτόκολλο τηλ. κάνει κλικ στους αριθμούς τηλεφώνου. Άλλοι κωδικοί που μπορείτε να χρησιμοποιήσετε και αντικαθιστούν το πρωτόκολλο τηλεφωνίας είναι 'callto' για κλήσεις Skype, 'wa.me
Μπορεί μια πλωτή πλευρική γραμμή να γίνει δυναμική;
Το Q2W3 είναι εύχρηστο για τις πλαϊνές γραμμές του WordPress, αλλά δεν υποστηρίζει (προς το παρόν) δυναμικό περιεχόμενο, πράγμα που σημαίνει ότι όταν διορθώνετε γραφικά στοιχεία στη θέση τους, εφαρμόζονται σε ολόκληρο τον ιστότοπο.
Είναι συμβατό με το πρόσθετο Επιλογές Widget που σας επιτρέπει να ελέγχετε ποια γραφικά στοιχεία εμφανίζονται ανά σελίδα, κατηγορία ή/και ανάρτηση.
Συνδυάστε αυτά τα δύο πρόσθετα και μπορείτε να κάνετε τις πλαϊνές γραμμές σας δυναμικές, αποκριτικές και κολλώδεις. Αυτές οι δύο προσθήκες είναι μια ισχυρή στοίβα για την αύξηση της αφοσίωσης των χρηστών και την αύξηση των μετατροπών σας.
