WordPress 7.1 «Mary Lou»: responsive styles, νέα εργαλεία media και APIs

Το WordPress 7.1, με κωδική ονομασία «Mary Lou», εστιάζει στον τρόπο που κινείστε στο admin, σχεδιάζετε περιεχόμενο, συνεργάζεστε στον editor και επεκτείνετε την πλατφόρμα. Η έκδοση προσθέτει responsive styles, ενιαία ροή επεξεργασίας εικόνων, πιο πλούσια Notes, νέα blocks και APIs για icons, αυτοματισμούς και admin interfaces.

Responsive styles απευθείας στον Site Editor

Μπορείτε πλέον να ορίζετε πώς εμφανίζεται ένα block σε διαφορετικά μεγέθη οθόνης μέσα από τα Global Styles ή από τις ρυθμίσεις του ίδιου του block. Δεν χρειάζεστε custom CSS για να εφαρμόσετε αυτές τις προσαρμογές. Ο Site Editor προσφέρει επίσης προεπισκόπηση σε διαφορετικά viewport μεγέθη όσο δουλεύετε, ώστε να ελέγχετε τη συμπεριφορά της διάταξης σε κάθε οθόνη.

Τα block themes μπορούν να ορίζουν δικά τους breakpoints για κινητά και tablet μέσα στο theme.json. Με αυτά τα breakpoints αντικαθιστούν τις προεπιλογές που χρησιμοποιούν τα responsive styles και η ορατότητα των blocks.

Σταθερή πλοήγηση σε κάθε editor

Η admin bar ακολουθεί πλέον όλες τις επιφάνειες επεξεργασίας. Έτσι διατηρείτε ορατή την τρέχουσα θέση σας και έχετε άμεση πρόσβαση στα γνώριμα εργαλεία, είτε γράφετε ένα άρθρο είτε επεξεργάζεστε το design του site. Η έκδοση περιλαμβάνει και μικρές οπτικές βελτιώσεις στην admin bar.

Νέος editor για τις εικόνες

Το WordPress αντικαθιστά το προηγούμενο εργαλείο περικοπής που εμφανιζόταν inline με ένα ειδικό modal για την επεξεργασία media. Το γνώριμο κουμπί Crop συνεχίζει να ανοίγει τη διαδικασία, αλλά συγκεντρώνει πλέον περισσότερες λειτουργίες σε ένα σημείο.

• Κόψτε μια εικόνα ελεύθερα ή με συγκεκριμένη αναλογία διαστάσεων.
• Αναστρέψτε την οριζόντια ή κάθετα.
• Περιστρέψτε την με ακριβή έλεγχο ή με προσαρμογή σε καθορισμένα βήματα.
• Επεξεργαστείτε τα μεταδεδομένα της εικόνας.

Notes με rich text και αναφορές συνεργατών

Τα Notes υποστηρίζουν rich text και αναφορές με @mentions. Μπορείτε να γράφετε έντονο ή πλάγιο κείμενο, inline code και links, ενώ με το @ αναφέρετε έναν συνεργάτη και τον ειδοποιείτε.

Μπορείτε επίσης να αφήνετε σημείωση πάνω σε συγκεκριμένο τμήμα κειμένου και όχι μόνο σε ολόκληρο block. Το ίδιο block μπορεί να φιλοξενεί πολλαπλές συζητήσεις, ενώ μπορείτε να συμπτύσσετε μεγάλα Notes για να διατηρείτε καθαρό το περιθώριο του editor.

Media στον browser και περισσότερα formats

Η συμπίεση, η αλλαγή διαστάσεων και η δημιουργία thumbnails για εικόνες εκτελούνται πλέον στον browser. Το WordPress χρησιμοποιεί build του libvips σε WebAssembly, μειώνοντας το φορτίο του server και περιορίζοντας προβλήματα με τα όρια μνήμης της PHP ή upload timeouts, ιδιαίτερα σε μεγάλα αρχεία.

Το core προσθέτει εγγενή υποστήριξη για AVIF, HEIC και HDR gain maps, δηλαδή formats που παράγουν σύγχρονες κάμερες και κινητά. Προαιρετικά, μπορείτε να ενεργοποιήσετε μετατροπή GIF σε video, η οποία συνήθως δημιουργεί μικρότερα αρχεία. Οι ενδείξεις προόδου και οι αυτόματες επαναλήψεις κάνουν τα uploads πιο ανθεκτικά όταν διακόπτεται η σύνδεση.

Νέα blocks και περισσότερος έλεγχος εμφάνισης

Η έκδοση προσθέτει τα blocks Playlist και Tabs. Το Playlist επιτρέπει να ομαδοποιείτε πολλαπλά audio tracks σε μία playlist και να εμφανίζετε προαιρετικά waveform, ώστε ο ακροατής να βλέπει την εξέλιξη κάθε track κατά την αναπαραγωγή.

Το Tabs οργανώνει σχετικό περιεχόμενο σε panels με καρτέλες, χωρίς να εμφανίζει όλες τις πληροφορίες ταυτόχρονα. Χρησιμοποιήστε το όταν θέλετε να παρουσιάσετε συνδεδεμένες ενότητες χωρίς να φορτώσετε υπερβολικά τη σελίδα.

Τα Button blocks αποκτούν ξεχωριστα style controls για τις καταστάσεις hover, focus και active. Μπορείτε να εφαρμόσετε τα styles σε ένα μόνο κουμπί ή σε όλα τα κουμπιά του site.

Πιο προβλέψιμος post editor

Ο post editor λειτουργεί πλέον πλήρως μέσα σε iframe για όλα τα themes, όπως ήδη συμβαίνει στον Site Editor. Ο καμβάς επεξεργασίας εκτελείται ξεχωριστά από το WordPress admin interface, ώστε τα admin styles να μην επηρεάζουν το περιεχόμενο.

Οι μονάδες που εξαρτώνται από το viewport και τα media queries στοχεύουν απευθείας τον καμβά του editor. Έτσι οι responsive διατάξεις συμπεριφέρονται πιο προβλέψιμα κατά την επεξεργασία και η εμπειρία παραμένει πιο συνεπής ανάμεσα στους editors.

Εργαλεία για developers

Το WordPress 7.1 επεκτείνει APIs και εργαλεία που αφορούν icons, αυτοματισμούς, admin interfaces και responsive styling. Η SVG Icon API γίνεται δημόσιο API, ώστε να καταχωρίζετε δικές σας συλλογές icons και μεμονωμένα icons και να τα χρησιμοποιείτε σε όλο τον editor μαζί με την ενσωματωμένη βιβλιοθήκη.

// Συναρτήσεις της δημόσιας SVG Icon API.
wp_register_icon_collection();
wp_register_icon();
wp_get_icon();

// Συναρτήσεις της δημόσιας SVG Icon API.
wp_register_icon_collection();
wp_register_icon();
wp_get_icon();

Η Abilities API επεκτείνει την υποδομή που εισήγαγε το WordPress 6.9. Προσθέτει κύκλο εκτέλεσης που δέχεται filters, custom validation και κοινόχρηστο discovery. Οι προσθήκες αυτές διευκολύνουν τις ολοκληρώσεις και τους αυτοματισμούς πάνω στο WordPress, συμπεριλαμβανομένων εργαλείων που αξιοποιούν AI.

Ένα νέο Design System θέτει τη βάση για το theming των admin interfaces του WordPress. Περιλαμβάνει υποστήριξη για χρώμα, στρογγυλότητα και styles του cursor. Χρησιμοποιήστε semantic design tokens και το React component ThemeProvider για να δώσετε συνέπεια σε custom admin interfaces χωρίς να απομακρύνεστε από την αισθητική του WordPress.

Οι δημιουργοί themes αποκτούν responsive styling και pseudo-state styling για τις καταστάσεις hover, focus, focus-visible και active μέσω του theme.json. Η έκδοση προσθέτει επίσης νέα filters για τη ρύθμιση των οθονών DataViews και DataForm που υποστηρίζουν τα Pages, Templates, Parts και Patterns στον Site Editor.

Βελτιώσεις προσβασιμότητας

Οι νέες συναρτήσεις wp_get_tooltip() και wp_get_toggletip() προσθέτουν προσβάσιμα tooltips σε περισσότερα σημεία του WordPress admin, όπως τα post meta boxes και η οθόνη σύνδεσης. Η υποστήριξη για screen readers βελτιώνεται επίσης στις admin διεπαφές, με σαφέστερες ετικέτες και πιο προβλέψιμη πλοήγηση στους πίνακες λίστας άρθρων.

Τα νέα Tabs και Playlist blocks, μαζί με βελτιώσεις στην πλοήγηση και την αλληλεπίδραση στον editor, διευρύνουν τις αλλαγές προσβασιμότητας της έκδοσης. Ελέγξτε τα custom blocks και τα admin interfaces σας με τις νέες συναρτήσεις tooltips και με screen reader, πριν προχωρήσετε σε deploy.

Ρυθμίσεις απόδοσης και Media Library

Η Media Library χρησιμοποιεί infinite scrolling από προεπιλογή. Κάθε χρήστης μπορεί να επιλέξει ξανά την pagination, αν προτιμά την προηγούμενη πλοήγηση μεταξύ σελίδων.

Μπορείτε να ορίζετε τις προεπιλογές speculative loading μέσα από environment variables ή constants. Με αυτόν τον τρόπο οι hosts και οι ιδιοκτήτες site ρυθμίζουν τον τρόπο με τον οποίο το WordPress κάνει prefetch σελίδων χωρίς να γράψουν plugin.

Προετοιμάστε την αναβάθμιση

Δοκιμάστε το WordPress 7.1 πρώτα σε staging περιβάλλον. Ελέγξτε τα responsive styles των block themes, τα custom styles για pseudo-states, τη συμβατότητα plugins που επεξεργάζονται media και κάθε custom admin interface που χρησιμοποιεί τον editor.

Αν συντηρείτε themes ή plugins, αξιοποιήστε το theme.json για breakpoints και interactive states, εξετάστε τη δημόσια SVG Icon API για τις συλλογές icons σας και ελέγξτε τις αλλαγές της Abilities API. Για πλήρεις οδηγίες εγκατάστασης, αλλαγές αρχείων, διορθώσεις και αναλυτικές σημειώσεις για developers, χρησιμοποιήστε τις επίσημες Release Notes και το Field Guide.