الوصف
Ce plugin ajoute les styles alternatifs “Slider” & “Diaporama” au bloc Galerie natif de WordPress (Gutenberg).
Le slider est réalisé principalement en CSS, grâce aux nouvelles fonctionnalités CSS (scroll-snap, overflow, anchor-name).
Un **léger script JavaScript ** est utilisé uniquement pour ajouter la navigation clavier avec les touches fléchées ( ),la gestion tactile et le défilement automatique du mode diaporama.
- Fonctionne avec le bloc Galerie natif de WordPress
- Styles “Slider” & “Diaporama” sélectionnables dans le panneau Styles du bloc
- Diaporama: défilement automatique avec transitions fluides en fondu toutes les 5 secondes, avec au survol pause automatique et navigation manuelle possible.
- Responsive: largeur automatique en fonction de la taille medium_large de la première image
- Navigation avec boutons & marqueurs de défilement intégrés du navigateur
- Une fois que le slider à le focus, la navigation clavier est possible avec flèche gauche () et flèche droite ()
- Animation fluide au défilement (fade-in / fade-out)
✅ Compatible avec thème classique & thème de blocs(FSE).
Utilisation
- Dans l’éditeur de blocs (Gutenberg), insérez un bloc Galerie
- Aux Paramètres du bloc Panneau Styles, sélectionnez le style Slider ou Diaporama
- Visualisez en Front End le bloc Galerie transformé en un Slider.
Démo
Découvrez le plugin en action sur notre Site De Démos
Traductions
◆ Anglais
◆ Français
Decouvrez nos autres plugins
◆ Easy Custom Event Tickets
◆ Editor Custom Color Palette
◆ Filter Bar Custom Post Type
◆ Rouergue Creation Top Notice Bar
◆ Rouergue Creation Events Sidebar
◆ Rouergue Creation Carousel Style Query Loop
لقطات الشاشة


التنصيب
- Depuis le tableau de bord de votre site, accédez à Extensions -> Ajouter nouveau.
- Rechercher Slider Galerie Native Responsive
- Cliquez sur installez et activer le plugin
الأسئلة المتكررّة
-
Le slider utilise des spécifications CSS récentes.
Actuellement, il est supporté par Chrome, Edge et Opera. -
Le plugin utilise-t-il du JavaScript ?
-
Oui, un script JavaScript très léger est utilisé pour étendre les fonctionnalités CSS :
* Navigation au clavier avec les flèches ( / ).
* Défilement automatique toutes les 5s (mode Diaporama) avec pause au survol.
* Amélioration de la navigation tactile sur mobile et gestion du bouclage (loop).Le rendu visuel et la mise en page reposent sur le CSS natif.
-
Oui.
- Flèche droite () : image suivante
- Flèche gauche () : image précédente
Un mode loop permet de revenir au début ou à la fin.
-
Puis-je changer les styles (couleurs, tailles, etc.) ?
-
Oui, en surchargeant le fichier CSS du plugin via votre thème enfant ou via l’outil du menu Apparence/Personnaliser/CSS personnalisé.
Exemple:
-
changer la largeur du slider, entrez la régle CSS suivante:
.wp-block-gallery.is-style-sngr-gallery-slider{width:720px;max-width:100%;} -
Masquer les boutons et/ou marqueurs de défilement sur mobile:
@media (max-width:480px){
/* Boutons */
.wp-block-gallery.is-style-sngr-gallery-slider::scroll-button(*){
display:none;
}
/* Marqueurs */
.wp-block-gallery.is-style-sngr-gallery-slider::scroll-marker-group{
display:none;
}
}
-
المراجعات
لا توجد مراجعات لهذه الإضافة.
المساهمون والمطوّرون
“Slider Galerie Native Responsive” هو برنامج مفتوح المصدر. وقد ساهم هؤلاء الأشخاص بالأسفل في هذه الإضافة.
المساهمونترجمة ”Slider Galerie Native Responsive“ إلى لغتك.
مُهتم بالتطوير؟
تصفّح الشفرة، تحقق من مستودع SVN، أو الاشتراك في سجل التطوير بواسطة RSS.
سجل التغييرات
1.0.8
- Ajout au panneau styles des paramètres du bloc, du style Diaporama:
Défilement automatique avec transitions fluides en fondu toutes les 5
secondes, avec au survol pause automatique et navigation manuelle
possible.
1.0.7
Compatibilité avec WordPress 7.1
1.0.6
Optimisation du code
1.0.5
Modifié
- Chargement des scripts CSS & JS uniquement si un bloc galerie
est présent.
1.0.4
Modifié
- Augmenter la spécificité des régles de style
1.0.3
Corrigé
- Sécurisation des variables injectées dans l’attribut HTML “style” du
bloc Galerie afin de respecter les bonnes pratiques de sécurité WordPress. - Le style Slider n’est pas appliqué au bloc Galerie, lorsque plusieurs
classes CSS sont présente.
1.0.2
Corrigé
- Amélioration de la navigation tactile:
Correction du bug de saut intempestif lors d’un simple toucher(sans swipe).
1.0.1
- Ajout de la navigation clavier avec les touches
- Ajout d’un mode loop pour la navigation clavier
- Mise à jour de la documentation
1.0
- Première version stable
- Ajout du style “Slider” pour le bloc Galerie
- Slider responsive en CSS pur
