InPost Gallery
Extension WordPress qui associe un ensemble d'images à n'importe quel article et l'affiche au moyen de scripts de galerie et de diaporama pilotés par shortcode.
- Première version
- Installations actives
- 700+
- Note
- Lire les avis
À propos
InPost Gallery conserve une liste d'images dans les post meta de n'importe quel type de contenu activé et la restitue au moyen de shortcodes. Chaque shortcode encapsule un script front-end (YoxView, Fancybox, Galleria, Nivo Slider, Camera), et un sixième shortcode place une seule image.
L'essentiel du travail d'ingénierie se trouve dans l'éditeur. Dans l'éditeur classique (TinyMCE), les shortcodes apparaissent comme des espaces réservés cliquables, et un double-clic ouvre un formulaire déjà rempli avec les attributs actuels du shortcode. L'extension n'a pas d'intégration avec l'éditeur de blocs. La liste d'images elle-même est une meta box sur l'écran d'édition de l'article. Elle déclare la prise en charge à partir de WordPress 3.5 et est testée jusqu'à la 6.9, une plage qui inclut le changement d'API TinyMCE de WordPress 3.9.
Côté front-end, les vignettes sont découpées à la taille demandée à la première utilisation et mises en cache à côté du fichier d'origine. Une galerie entière peut se réduire à une seule image de couverture qui charge la galerie dans une fenêtre contextuelle par AJAX, ce qui permet à une grande galerie de tenir dans un widget de barre latérale.
InPost Gallery · galeries dans les articles
ce qui a été résolu
Éditeur visuel de shortcodes
dans le produitCe que cela apporteLes rédacteurs modifient les galeries via un formulaire dans l'éditeur d'articles au lieu de modifier des codes à la main, ce qui signifie moins de pages cassées.
- Problème
- Les shortcodes à nombreux attributs sont difficiles à modifier à la main dans le contenu d'un article. L'éditeur classique (TinyMCE) devait les afficher comme des objets, ouvrir un formulaire avec leurs valeurs actuelles et les réécrire sans abîmer l'article.
- Solution
Un plugin TinyMCE remplace les shortcodes par des images d'espace réservé au chargement et les reconvertit en texte à l'enregistrement. Le formulaire d'édition est rendu côté serveur et obtient ses valeurs de l'analyseur de shortcodes propre à WordPress, exécuté en mode capture.
- Stack
Afficher les shortcodes comme des objets modifiables dans l'éditeur visuelBeforeSetContent remplace les shortcodes par des espaces réservés ; PostProcess restaure le texte
Le serveur imprime une regex construite à partir des clés de shortcodes enregistrées. Sur BeforeSetContent, chaque correspondance reçoit un sc_id, son texte d'origine va dans une table, et elle est remplacée par une image d'espace réservé avec l'icône du shortcode et un résumé des attributs dans le title. Sur PostProcess, les espaces réservés sont remplacés à partir de la table, de sorte que l'article enregistré contient des shortcodes ordinaires et rien de spécifique à l'éditeur.
Le formulaire d'édition doit s'ouvrir avec les valeurs actuelles du shortcodeExécuter do_shortcode() en mode capture pour que WordPress analyse les attributs dans la requête
En mode édition, get_shortcode_template() définit un drapeau shortcode_mode_edit, ne garde que le premier shortcode enregistré du texte posté via get_shortcode_regex(), et exécute do_shortcode(). Le gestionnaire de shortcode de l'extension voit le drapeau et stocke les attributs analysés au lieu de produire du HTML. Les champs du formulaire lisent ensuite leurs valeurs par défaut via set_default_value(), qui les assainit.
Cela évite un second analyseur d'attributs : les guillemets, l'échappement et les espaces sont gérés par le même code qui restitue le shortcode côté front-end.
L'état du formulaire doit redevenir un texte de shortcode valideSérialiser les champs marqués en attributs ; échanger les guillemets doubles ; joindre les champs de liste avec ^
changer() parcourt chaque élément de formulaire marqué avec data-shortcode-field. Les guillemets doubles à l'intérieur des valeurs sont remplacés par des guillemets simples pour qu'ils ne puissent pas fermer l'attribut. Un champ nommé content devient le contenu encadré. Les champs répétés marqués save_as_one sont collectés et joints avec ^ en un seul attribut, puisque les attributs de shortcode ne peuvent pas contenir de tableaux.
WordPress 3.9 a changé l'API des plugins TinyMCELivrer deux builds de l'éditeur et en choisir un selon $wp_version lors de la mise en file des scripts
TinyMCE 4 dans WordPress 3.9 a remplacé les gestionnaires comme onBeforeSetContent.add() par ed.on('BeforeSetContent'). L'extension garde l'ancienne build dans js/wp38/ et la nouvelle dans js/, et choisit entre elles à la fois pour le script d'administration et pour le plugin TinyMCE enregistré.
Ajouter un type de galerie ne devrait pas nécessiter de modifier le cœurShortcodes découverts à partir des fichiers de modèles ; la même liste contrôle quels modèles sont chargés
get_shortcodes_array() analyse views/shortcodes/popups/ et enregistre un shortcode par nom de fichier. Chaque clé a un modèle front et un modèle de formulaire d'éditeur. get_shortcode_key_folder() ne retourne le dossier que pour les clés connues, de sorte que les appelants AJAX ne peuvent pas orienter l'include vers un autre fichier, et get_shortcode_template() se rabat sur inpost_gallery pour les noms inconnus.
Données d'images et vignettes
dans le produitCe que cela apporteDe nombreuses images peuvent être choisies d'un coup dans la médiathèque, un même ensemble peut alimenter plusieurs galeries, et les vignettes sont créées une seule fois pour que les pages se chargent vite.
- Problème
- Les images sont choisies dans la médiathèque sous forme d'URL, groupées et réordonnées par article, et chaque shortcode demande sa propre taille de vignette. Redimensionner à chaque affichage de page est trop lent, et enregistrer une taille d'image pour chaque réglage de shortcode possible n'est pas envisageable.
- Solution
Les diapositives sont stockées comme un seul tableau dans les post meta. Les vignettes sont produites à la première requête avec WP_Image_Editor, puis servies depuis le disque.
- Stack
Chaque galerie demande sa propre taille de vignetteRedimensionner à la première utilisation avec WP_Image_Editor, enregistrer sous nom-LxH.ext, réutiliser le fichier s'il existe
get_image() prend un alias de taille comme 200x150 et appelle un redimensionneur adapté d'Aqua Resizer 1.1.7. Il calcule la taille cible avec image_resize_dimensions(), cherche un fichier nom-LxH.ext existant à côté de l'original et retourne son URL, ou redimensionne et l'enregistre à la première requête. La classe est renommée (Inpg_Aq_ResizePN) et enveloppée dans class_exists pour ne pas entrer en conflit avec les thèmes qui embarquent la bibliothèque d'origine.
Sélectionner plusieurs images d'un coup depuis la fenêtre modale des médiasIntercepter send_to_editor, collecter les URL, ajouter les diapositives par AJAX séquentiel dans l'ordre de sélection
L'extension ouvre la fenêtre modale standard des médias et remplace temporairement window.send_to_editor. Le HTML inséré est analysé dans un tampon masqué pour y trouver les cibles de liens ou les sources d'images. add_meta_slide_items() demande une diapositive rendue à la fois et lance la requête suivante dans le callback, de sorte que les diapositives gardent l'ordre de la sélection. La liste est triable et renumérotée après chaque changement.
Les images d'un article doivent pouvoir alimenter plusieurs galeries différentesLes diapositives portent un numéro de groupe ; les shortcodes sélectionnent par groupe, par liste de positions ou par N au hasard
inpost_gallery_data est un tableau de diapositives avec imgurl, title et group (de 1 à max_thumb_groups, 30 par défaut). Les modèles front le filtrent par groupe, ou par une liste de positions séparées par des virgules en base 1, et random=N mélange et conserve N diapositives (-1 mélange tout).
Des galeries construites à partir d'images d'autres articlesSyntaxe d'expression dans post_id (takebyid, take), analysée comme du JSON ; requête préparée
Un post_id qui commence par { est traité comme une expression. Les parenthèses deviennent des crochets et les guillemets simples deviennent des guillemets doubles, puis json_decode() l'analyse. takebyid prend des blocs post:count:first|last|rand parmi les articles listés. take sélectionne les N derniers articles publiés d'un type de contenu ; le sens du tri est limité à ASC ou DESC et le type de contenu et la limite sont liés avec prepare().
Livraison côté front-end
dans le produitCe que cela apporteUne galerie entière peut tenir dans une barre latérale sous forme d'une seule image cliquable, et chaque page ne charge que les scripts de galerie qu'elle utilise réellement.
- Problème
- Une galerie doit tenir dans un widget de barre latérale sous forme d'une seule image, des galeries avec des scripts différents peuvent partager une page, et le point d'entrée AJAX qui restitue les galeries est ouvert aux visiteurs anonymes.
- Solution
L'image de couverture porte un instantané sérialisé des attributs du shortcode, et un gestionnaire AJAX public restitue de nouveau le même modèle à partir de celui-ci via le registre des shortcodes. Chaque modèle met en file ses propres ressources.
- Stack
Afficher une galerie entière comme une seule image de couverture cliquableInstantané des attributs avec le drapeau de fenêtre contextuelle désactivé, stocké en JSON base64, restitué par AJAX
draw_html() copie les attributs avec show_in_popup à 0 dans une clé attributes, puis active le drapeau pour la couverture. Le modèle de couverture imprime l'instantané en JSON base64. front.js le poste avec la clé du shortcode, et get_gallery_by_shortcode() le décode, force de nouveau show_in_popup à 0 pour que la réponse soit toujours la galerie et jamais une autre couverture, et restitue le même modèle. Un drapeau côté client bloque les doubles clics pendant l'exécution de la requête.
Un gestionnaire AJAX public inclut des modèles PHP par leur nomLa clé du modèle doit être résolue via le registre des shortcodes connus avant l'include
get_gallery_by_shortcode() est enregistré pour les utilisateurs anonymes et reçoit la clé du shortcode depuis le client. Il n'inclut un modèle que si get_shortcode_key_folder() trouve la clé parmi les shortcodes découverts à l'init ; toute autre valeur ne restitue rien.
Charger chaque script de diaporama uniquement là où il est utiliséLes modèles mettent en file leur propre CSS et JS au rendu ; chaque instance reçoit un conteneur uniqid
Les mises en file des scripts et des styles se trouvent en haut de chaque modèle de shortcode, de sorte qu'une page ne charge que les bibliothèques des galeries qu'elle affiche réellement, imprimées dans le pied de page. Chaque instance reçoit un identifiant de conteneur uniqid(), si bien que plusieurs galeries, y compris sur des scripts différents, peuvent fonctionner sur une même page.
Chiffres
wordpress.org- Installations actives 700+ compteur de wordpress.org.
- Avis 18 Moyenne de 4.0 sur 5.
- Années de maintenance 14 Depuis 24 avril 2012, dernière mise à jour 6 mars 2026.