Δημοσίευση :
Το γνωστό σε όλους της WordPress κοινότητας WoodMart Theme 7.4 έρχεται με την νέα χρόνια του 2024 να φέρει ένα πολύ μεγάλο Update με μια ολοκληρωμένη ανακατασκευή, βελτιστοποιήσεις, ένα νέο στυλ μενού για κινητά, διαχείριση πεδίων ολοκλήρωσης αγοράς, την ενσωμάτωση μιας νέας βιβλιοθήκης JavaScript ρυθμιστικού Swiper και πάρα πολλα τεχνικά χαρακτηριστικά που θα λατρέψουν οι Designers που επιλέγουν να δουλέψουν με το WoodMart.
Προσοχή! Σε αυτήν την ενημέρωση, υπάρχουν σημαντικές αλλαγές στον Κεντρικό Κώδικα του θέματος ( Theme’s Code Base ), οπότε πρέπει να ελεγχτούν τυχόν αλλαγμένες ή καταργημένες κλάσεις CSS για να τις προσαρμόσετε στο θυγατρικό θέμα ή στο Custom CSS, εάν υπάρχουν.
Ας δούμε τώρα μερικές ενδιαφέρουσες αλλαγές του θέματος που αξίζει να αναλύσουμε και στο τέλος του άρθρου βρίσκονται όλες οι αλλαγές μια προς μια.
Στην έκδοση 7.4, έχει εισαχθεί για το WooCommerce η δυνατότητα επεξεργασίας πεδίων ολοκλήρωσης αγοράς. Με την προσθήκη αυτής της δυνατότητας γλυτώνουμε ένα ακόμα επιπλέον πρόσθετο από το Eshop του πελάτη μας ( ή δικό μας ). Μέσα από αυτήν μπορούμε να απενεργοποιήσουμε συγκεκριμένα πεδία, να αναδιατάξουμε τις θέσεις τους ή και ακόμα να τα οργανώσουμε σε δύο στήλες για πιο φιλική και βελτιωμένη προς τον χρήστη εμπειρία ολοκλήρωσης αγοράς. *Σημείωση, η δυνατότητα αυτή λειτουργεί με το προεπιλεγμένο checkout WooCommerce και όχι με το νέο μπλοκ ολοκλήρωσης αγοράς WooCommerce.
Σε προηγούμενες εκδόσεις του θέματος WoodMart, χρησιμοποιήθηκαν τρεις ξεχωριστές βιβλιοθήκες καρουζέλ—OWL, Slick και Flickity. Ωστόσο, η ενημέρωση 7.4 σηματοδοτεί μια σημαντική αλλαγή, αντικαθιστώντας όλες τις βιβλιοθήκες καρουζέλ με το Swiper. Αυτή η στρατηγική μετάβαση εκτελέστηκε για να βελτιστοποιήσει τόσο τα σενάρια όσο και τα στυλ μέσα στο θέμα, διευκολύνοντας την ενσωμάτωση πολύτιμων βελτιώσεων. Πέρα από την απλή βελτιστοποίηση, αυτή η αλλαγή συμβάλλει στην επιτάχυνση της απόδοσης ιστότοπου, επηρεάζοντας άμεσα τις βαθμολογίες της Google PageSpeed.
Το ίδιο το Swiper υποβλήθηκε σε σπονδυλοποίηση, επιτρέποντας μείωση του μεγέθους της βιβλιοθήκης με την εξαίρεση των λειτουργικών μονάδων που δεν χρησιμοποιούνται στο θέμα. Μετά τη μετάβαση, το WoodMart ενσωματώνει πλέον πολλά ευεργετικά χαρακτηριστικά. Οι χρήστες μπορούν πλέον να επιλέξουν κλασματικές ποσότητες αντικειμένων (π.χ., 3.5, 4.2, 5.7) για βελτιωμένη οπτική αναπαράσταση στο καρουζέλ, μια χρήσιμη δυνατότητα που σηματοδοτεί στους πελάτες ότι μπορούν να σύρουν για να αποκαλύψουν περισσότερα στοιχεία. Η ενημέρωση εισάγει επιλογές για το στυλ των βελών καρουζέλ για να βελτιωθεί η εμπειρία του χρήστη ή να ευθυγραμμιστεί με συγκεκριμένες προτιμήσεις σχεδίασης. Οι πρόσθετες επιλογές προσαρμογής περιλαμβάνουν σελιδοποίηση καρουζέλ και στυλ γραμμής κύλισης, που καλύπτουν διάφορες αλληλεπιδράσεις των χρηστών με το καρουζέλ. Οι αξιοσημείωτες νέες λειτουργίες περιλαμβάνουν την επιλογή “Συγχρονισμός”, που επιτρέπει τη σύνδεση δύο καρουζέλ. Για παράδειγμα, ένα καρουζέλ με πανό μπορεί τώρα να συγχρονιστεί με ένα καρουζέλ που παρουσιάζει διαφημιζόμενα προϊόντα, διασφαλίζοντας ότι η αλλαγή των banner αλλάζει δυναμικά τα σχετικά προϊόντα. Η επιλογή “Αυτόματο ύψος” αποδεικνύεται πολύτιμη όταν ασχολείστε με αντικείμενα διαφορετικών διαστάσεων.
Τέλος, η επιλογή «Δυναμικός έλεγχος σελιδοποίησης» γίνεται ιδιαίτερα χρήσιμη όταν ασχολείστε με μεγάλα καρουζέλ, παρέχοντας μια πιο αισθητική λύση στη σελιδοποίηση σε ιστότοπους. Επιπλέον, είναι σημαντικό να επισημανθεί ότι οι κλάσεις με πρόθεμα owl–, flickity-, slick-* έχουν αφαιρεθεί και ότι τα ερωτήματα μέσων για καρουζέλ έχουν υποστεί τροποποίηση, βελτιστοποιώντας τη συνολική δομή του θέματος.
Ακόμα, Στην έκδοση 7.4 παρουσιάζεται το “Drilldown” για το Μενού για κινητά. Στην συνεχή επιδίωξή για βελτίωση της εμπειρίας χρήστη σε κινητές συσκευές, η WoodMart εφαρμόσει μια εκλεπτυσμένη διάταξη για το μενού για κινητά. Αναγνωρίζοντας ότι ένα σημαντικό μέρος των πωλήσεων πραγματοποιείται πλέον μέσω κινητών συσκευών, αυτή η βελτίωση είναι ένα βασικό βήμα στην βελτιστοποίηση και στην απόδοση του θέματός σε αυτές τις πλατφόρμες. Μπορείτε να δείτε πώς φαίνεται ζωντανά στο demo τους.
Η Ανανεωμένη «Συλλογή εικόνων μεμονωμένου προϊόντος» στο WoodMart 7.4, παλιότερα βασιζόταν σε δύο διαφορετικές βιβλιοθήκες, την OWL και την Slick, για αυτό το στοιχείο έθετε προκλήσεις όταν οι πελάτες προσπάθησαν να επεξεργαστούν ή εισήγαγαν νέα σχέδια. Ως απάντηση σε ερωτήματα πελατών και εντοπισμένα ζητήματα, η ομάδα του θέματος επανεκτίμησε και ανασχεδίασε εκ νέου αυτό το στοιχείο, εισάγοντας επιλογές προσαρμοσμένες στις ανάγκες των πελατών του. Οι νέες επιλογές περιλαμβάνουν το “Gallery gap”, επιτρέποντας ακριβείς προσαρμογές μεταξύ των μικρογραφιών και του καρουζέλ της κύριας γκαλερί, χρήσιμο για την προσαρμογή της συλλογής στο σχέδιό σας και τη βελτίωση της εμπειρίας χρήστη σε κινητές συσκευές. Η επιλογή “Μικρογραφίες ανά διαφάνεια: αυτόματη” διατηρεί τις αναλογίες εικόνας για πελάτες με διαφορετικά ύψη εικόνας. Η προσθήκη των επιλογών “Θέση μικρογραφιών κάτω σε κινητές συσκευές” και “Μικρογραφίες αριστερά” αντιμετωπίζει τα αιτήματα των πελατών για μια συνεπή διάταξη σε οθόνες κινητών. Επιπλέον, η διάταξη “Carousel” ενοποιεί τρία σχέδια γκαλερί, παρέχοντας ευελιξία στην επιλογή ποσοτήτων εικόνας για προβολή, προσαρμογές για φορητές συσκευές και ενεργοποιώντας τη λειτουργία κεντραρίσματος για ποικίλες ποσότητες εικόνας.
Συγκεκριμένα, το WoodMart Slider προσφέρει πλέον επιλογές προσαρμογής για βέλη και σελιδοποίηση, ανεξάρτητα από τις καθολικές ρυθμίσεις. Οι χρήστες μπορούν επίσης να επιλέξουν διαφορετικούς συνδυασμούς χρωμάτων για σελιδοποίηση και βέλη. Είναι σημαντικό να επισημάνετε την κατάργηση κλάσεων με πρόθεμα flickity-* για βελτιωμένη ενσωμάτωση.
Overhauled Grid System on Elements. Μέχρι και έως σήμερα το θέμα WoodMart χρησιμοποιούσε το σύστημα πλέγματος Bootstrap. Η ομάδα του ωστόσο, κατά την εξονυχιστική εξέταση των αρχείων CSS, κατέστη προφανές ότι μόνο ένα μικρό μέρος των στυλ ήταν εφαρμόσιμο στις σελίδες, καθιστώντας τις ακατάλληλες για καρουζέλ. Κατά συνέπεια, πάρθηκε η απόφαση να επινοηθεί ένα ιδιόκτητο σύστημα πλέγματος προσαρμοσμένο σε όλα τα στοιχεία, συμπαγές σε μέγεθος και να βασίζεται αποκλειστικά σε μεταβλητές CSS. Αυτή η προσέγγιση εξαλείφει την ανάγκη προσθήκης τριών κλάσεων CSS σε κάθε στοιχείο πλέγματος, όπως απαιτείται στο Bootstrap. Στην ενημέρωση 7.4, τα μεγέθη πλέγματος μειώθηκαν κατά 5 φορές, συνοδευόμενα από την κατάργηση πολλών στυλ καρουζέλ, καθώς το πλέγμα μπορεί πλέον να επαναπροσδιοριστεί για αυτά. Το πλέγμα Bootstrap παραμένει στο θέμα για πιο ομαλή μετάβαση, αλλά θα κριθεί περιττό στην επερχόμενη ενημέρωση 8.0. Προσοχή! εάν έχετε χρησιμοποιήσει κλάσεις όπως row, col-, col-sm-, col-md-, col-lg-, col-xl-*, θα είναι απαραίτητες τροποποιήσεις στον κώδικά σας.
Μετά από συχνές ερωτήσεις στο φόρουμ υποστήριξής σχετικά με την προσαρμογή της απόστασης μεταξύ των στοιχείων σε καρουζέλ και πλέγματα, η ομάδα του θέματος εισαγάγει μια λύση ελέγχου με απόκριση. Τώρα, οι χρήστες μπορούν να αυξάνουν ή να μειώνουν αβίαστα την απόσταση μεταξύ των στοιχείων χωρίς την ανάγκη πρόσθετου κώδικα. Συγκεκριμένα, οι κλάσεις wd-spacing-* έχουν αφαιρεθεί για μια πιο βελτιωμένη και διαισθητική προσέγγιση στη διαχείριση της απόστασης των στοιχείων.
Από την έκδοση 3.16.1 του Elementor, η δυνατότητα “Flexbox Container” ενεργοποιείται από προεπιλογή για υπάρχοντες ιστότοπους, αναγκάζοντας όλους τους χρήστες του Elementor builder να μετατρέψουν όλο το περιεχόμενο του ιστότοπού τους που δημιουργήθηκε με παλιά στοιχεία Section/Column σε Flexbox Container. Δεδομένου ότι το Flexbox Container είναι πλέον το κύριο όργανο για τη δημιουργία της διάταξης στο πρόγραμμα δημιουργίας Elementor, δημιουργήσαμε ξανά την εισαγωγή του προκατασκευασμένου ιστότοπού μας χρησιμοποιώντας νέες επιλογές διάταξης flexbox που προέκυψαν από μια νέα δυνατότητα “Flexbox Container”.
Από την έκδοση 3.18.0 του Elementor η δυνατότητα απόδοσης “Ενσωμάτωση γραμματοσειρών εικονιδίων” είναι ενεργοποιημένη από προεπιλογή, αντικαθιστώντας ολόκληρη τη γραμματοσειρά εικονιδίων με μεμονωμένες εικόνες SVG. Μετά από αυτές τις αλλαγές, η γραμματοσειρά του εικονιδίου “Font Awesome” δεν μπορεί να προστεθεί στις σελίδες του ιστότοπου, με αποτέλεσμα να καταργούνται όλες οι σχετικές επιλογές. Από τώρα, εάν τα “Εικονίδια γραμματοσειράς σε απευθείας σύνδεση” είναι ενεργοποιημένα στον ιστότοπο, οι πελάτες πρέπει να ανεβάσουν ένα αρχείο εικόνας χρησιμοποιώντας την επιλογή “Χρήση εικόνας ως: Εικονίδιο στοιχείου μενού” για να προσθέσουν εικονίδια στα στοιχεία μενού. Περισσότερα σχετικά με τα “Εικονίδια γραμματοσειράς Inline” και γιατί εφαρμόστηκε μπορείτε να βρείτε στην τεκμηρίωση της προσθήκης.
Πηγή : WoodMart Update 7.4
End of Content.
Εγγραφείτε στους 5.000 συνδρομητές!
