Développement

Extension WordPress : EL-Gallery

Image : EL-Gallery_Bannière
EL-Gallery est une galerie ultra-légère en javascript & css pour remplacer celle de WordPress.

Elle s’adaptera simplement et intelligemment à la largeur de votre site web sans avoir besoin de passer des heures à la configurer.

Quelques options sont tout de même à votre disposition si vous le souhaitez, mais l’extension fonctionnera immédiatement après son installation.

Installation :

  • Ajoutez le dossier « el-gallery » dans le dossier « /wp-content/plugins/ » de votre site.
  • Activez l’extension dans le menu « Extensions » dans l’administration de votre WordPress.

Les shortcodes de galeries seront automatiquement transformés en EL-Galleries !

Détails :

Je ne suis pas un développeur professionnel, mais puisqu’il n’y avait aucune extension à la fois assez simple et capable de fonctionner sur un site au design adaptatif, j’ai décidé de coder une extension répondant à ces critères.

EL-Gallery devrait fonctionner correctement sur tous les navigateurs capables de prendre en compte le CSS3 et le javascript.

Si vous avez des suggestions ou des questions, veuillez me contacter directement ou proposer des changements sur la page GitHub du projet.

Cette extension a été imaginée pour fonctionner sur n’importe quelle appareil ; pour qu’elle s’adapte intelligemment aux appareils mobiles, nous vous recommandons d’installer l’extension WP Mobile Detect.

Configuration :

Une fois installée, l’extension aura ajouté un menu EL-Gallery dans la section « Apparence » de l’administration de votre site.

Vous y pourrez y changer la durée des diapositives ainsi que diverses fonctionnalités :

  • EL-Gallery utilise le design adaptatif, et il est possible que vous vouliez choisir une largeur spécifique à partir de laquelle les miniatures seront affichées à 5 par ligne au lieu de 8.
  • Vous pouvez désactiver les flèches de navigation pour un rendu visuel plus sobre.
  • Il est possible que vous vouliez désactiver les liens sur les images.
  • Si vous avez installé l’extension WP Mobile Detect, n’oubliez pas d’activer l’option correspondante afin que les images puissent s’afficher à un format plus léger sur les appareils mobiles.

Exemples :

Un example d’utilisation d’EL-Gallery sur un wordpress utilisant un autre thème.

Téléchargement :

 

Boutons CSS3 : Flat-Button

Exemple

 
Flat-Button est un module simple en CSS3/LESS que vous pouvez ajouter à n’importe quel élément de votre site web.

Il a été créé pour être installé et utilisé facilement sur n’importe quelle page et avec n’importe quel thème.

Installation :

Rendez-vous simplement dans la section « Make your own Flat-Buttons » de la page web Flat-Button et créer votre propre version du module !

Une fois que vous avez choisi vos couleurs, copiez simplement le code LESS ou le code CSS3 sur votre page web et ajoutez la classe « flat-button » à des éléments de vos pages web.

Détails :

Flat-Buttons a initialement été créé pour le site Alpha-Gamma.fr, et a depuis été adapté pour plus de versatilité de une plus grande compatibilité avec d’autres sites.

Flat-Button vient pré-configuré avec de nombreuses variantes et fonctionalités :

  • Des boutons Noirs et Blancs.
  • La possibilité de changer la taille de vos boutons à partir de la taille de votre police.
  • Des variantes telles qu’une version « sans-hover » et une version « creusée ».
  • Un code entièrement compatible avec Font Awsome.
  • Des couleurs entièrement customisables.
  • Aucune restriction sur la police utilisée.

Laisser un commentaire