Ufo Post Carousel
Carrousel léger et accessible de publications ou de Custom Post Types pour WordPress, sans dépendance JS externe (pas de Splide).
by The WordPress Contributors · github.com/vince-alien/ufo-post-carousel
Install
No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:
wp plugin install https://github.com/vince-alien/ufo-post-carousel/archive/refs/heads/main.zipReadme
=== UFO Post Carousel === Contributors: The WordPress Contributors Tags: block, carousel, posts, cpt, accessibility Tested up to: 6.7 Stable tag: 0.1.2 License: GPL-2.0-or-later License URI: https://www.gnu.org/licenses/gpl-2.0.html
Carrousel de publications léger et accessible, sans dépendance JS externe.
== Description ==
Bloc Gutenberg dynamique affichant un carrousel horizontal d'articles ou de
Custom Post Types. Contrairement à ufo-splide-blocks, ce bloc n'embarque
aucune librairie de slider : la navigation repose sur un scroll natif
(overflow-x: auto + scroll-behavior: smooth), ce qui le rend plus léger
et intrinsèquement accessible au clavier (chaque carte reste un lien
standard, atteignable par Tab). Le CSS scroll-snap-type a été retiré en
0.1.2 : sur ce site il empêchait Lighthouse/PageSpeed Insights de détecter
un LCP pour toute la page (voir Changelog).
Le style utilise les classes utilitaires Tailwind CSS déjà compilées par le
thème ufo-agency-boilerplate (aucun processus de build propre au plugin :
les fichiers .php/.js du dossier src/ sont simplement ajoutés aux
sources scannées par Tailwind dans le thème). Les couleurs utilisées suivent
les tokens sémantiques déjà établis dans le thème (primary, secondary,
tertiary, slate-*) et le design des cartes reprend celui du bloc
ufo-splide-cpt.
= Accessibilité =
- Liste sémantique (
<ul>/<li>/<article>), pas de widget ARIA carousel complexe : chaque carte reste toujours dans l'arbre d'accessibilité. - Chaque lien de carte a un nom accessible unique (« En savoir plus : {titre de l'article} ») pour éviter les liens ambigus dupliqués, aussi bien pour les lecteurs d'écran que pour la navigation agentique.
- Respecte
prefers-reduced-motionpour désactiver le scroll fluide. - Boutons précédent/suivant avec
aria-labeletaria-controls, étatdisableden début/fin de liste. - Fonctionne sans JavaScript (scroll natif + ancre standard) ;
view.jsn'ajoute que le confort des boutons flèches.
== Installation ==
- Uploader le dossier du plugin dans
/wp-content/plugins/ufo-post-carousel. - Activer le plugin depuis l'écran « Extensions » de WordPress.
- S'assurer que le thème actif recompile ses styles Tailwind après avoir
ajouté les chemins
@sourcedu plugin (voirtailwind/tailwind-theme.cssdu thème).
== Changelog ==
= 0.1.2 =
- Correction : suppression de
scroll-snap-type(snap-x snap-mandatory) sur le track du carrousel. Cette propriété CSS empêchait Chrome d'enregistrer une entrée Largest Contentful Paint pour la page entière (état NO_LCP), ce qui faisait échouer les audits Lighthouse/PageSpeed Insights sur toute page contenant ce bloc. Confirmé en production : 100/100 mobile et 100/100 desktop après correction.role="list"ettabindex="0"sont conservés (non responsables du problème). Effet de bord : le petit effet d'accroche visuelle au scroll (snap) est perdu ; le scroll fluide (scroll-behavior: smooth) est conservé.
= 0.1.0 =
- Version initiale.