Introduction au champ personnalisé nx-YouTube – Septembre 2017

Nous allons voir comment faciliter l’indexaction de votre site par les moteurs de recherche avec l’utilisation d’un sitemap ou plan de site en français.


Le plugin Joomla! gratuit nx-YouTube Custom Field est un nouveau champ personnalisé qui vous permet de facilement charger des vidéos YouTube avant ou après n’importe quel article Joomla! (comme tous les autres champs personnalisés). Et oui, comme cela doit être le cas en 2017,  je suis content de vous le dire: c’est entièrement adaptatif (responsive).

 Introduction rapide – Qu’est-ce que le champ personnalisé nx-YouTube ?
Le plugin Joomla! gratuit nx-YouTube Custom Field est un nouveau champ personnalisé qui vous permet de facilement charger des vidéos YouTube avant ou après n’importe quel article Joomla! (comme tous les autres champs personnalisés). Et oui, comme cela doit être le cas en 2017,  je suis content de vous le dire: c’est entièrement adaptatif (responsive).Comparé à la majorité des plugins d’intégration YouTube, nx-YouTube Custom Field vous propose de nombreux paramètres qui peuvent rapidement être configurés pour chaque instance frontend du plugin. 
Les principaux pré-requis à l’utilisation de ce plugin sont une installation Joomla! 3.7.x, pour supporter les champs personnalisés, une vidéo YouTube sympa à intégrer et, enfin et surtout, une tasse de café, parce que le café c’est toujours bon…
Note :
Pour plus d’informations sur les champs personnalisés, je vous invite à consulter la documentation officielle de Joomla! (https://docs.joomla.org/J3.x:Adding_custom_fields).
Liste des fonctionnalités :

Choix entre 5 options de largeur
3 options d’alignement
Option Box shadow

Installation
Vous pouvez télécharger la dernière version de notre plugin nx-YouTube Custom Field directement depuis le Joomla! Extensions Directory (Lien) ou depuis notre page d’accueil (http://ytcf.nx-designs.ch). Pour l’installation elle-même, vous pouvez utiliser le système d’installation natif de Joomla. Téléchargez simplement le fichier ZIP et installez-le. Après l’installation, vous devez activer le plugin nx-YouTube Custom Field en vous rendant dans Extensions > Plugins.
Configuration
Créer un groupe de champs
Pour commencer, vous devez créer un groupe de champs (si vous ne l’avez pas déjà fait). Vous pouvez facilement faire cela en vous rendant dans Contenu > Groupes de Champs. Créons donc un groupe nommé « Multimedia ». Après avoir créé un groupe de champs, vous pouvez commencer à assigner des groupes à ce champ.
Créer et assigner un champ personnalisé nx-YouTube à notre groupe
Après avoir créé notre groupe de champs « Multimedia », nous pouvons désormais lui assigner des champs. Vous pouvez faire cela via Contenu > Champs. Créons un nouveau champ grâce au bouton Nouveau. La page qui s’affiche est le nouvel éditeur de champs. Sélectionnez « nx-YouTube Field » comme type. Vous retrouvez désormais différents paramètres pour ce plugin :

Hide Label (cacher l’étiquette)
Box-Shadow (ombre appliqué à la boîte)
Video-Width (largeur de la vidéo)
Alignment (alignement)

Box Shadow crée une ombre derrière votre video. Video-Width vous permet de sélectionner la largeur (en pourcentage) de la vidéo basée selon l’espace disponible (basé sur Bootstrap).L’option Alignment vous permet de définir l’alignement de la vidéo, à gauche, à droite ou centrer – si vous utilisez une largeur de 100% pour votre vidéo, cette option sera sans effet.
Une autre option importante est placée dans l’onglet « Options ». L’option « Automatic Display » vous permet de définir l’endroit où sera placée la vidéo, dans, avant ou après l’article. La dernière étape est d’assigner notre champ personnalisé à notre groupe de champs Multimedia.
Vous devez assigner votre champ personnalisé à un groupe, sinon il ne sera pas affiché lors de l’édition d’un article.
Réglage vidéo
Après avoir réglé toute la configuration, vous devez ajouter votre vidéo au nouvel onglet Multimedia (ou au nom que vous avez donné à votre groupe de champs) :

Le label du champ est la valeur que vous avez donné précédemment dans les paramètres du champ. Donc si vous utilisez plusieurs instances c’est une bonne idée d’utiliser des noms reconnaissables pour vos champs. Entrez simplement l’ID de votre vidéo YouTube video, l’URL courte ou l’URL complète comme valeur du champ.
Exemples
URL courte de vidéo YouTube :

URL complète de vidéo YouTube :

ID de vidéo YouTube :
https://www.youtube.com/watch?v= OBkty9qjVsw
Note : L’ID de la vidéo YouTube est la dernière partie de l’URL, ce qui suit « v= ».
Vous pouvez désormais ajouter une vidéo YouTube à tous les articles ou fiches contact que vous souhaitez.Chaque article peut avoir sa propre vidéo YouTube. Si vous ne souhaitez pas ajouter de vidéo dans certains articles, il vous suffit de laisser le champ vide.
Dans notre exemple, nous avons créé une instance de champ « nx-YouTube Custom » qui affiche notre vidéo centrée avec une largeur de 50%, publiée au-dessus du titre de l’article :

Sur un téléphone portable, le plugin passe sur un affichage à 100% grâce à l’utilisation de Bootstrap :

Bon à savoir
S’il vous reste un peu de café, voici quelques informations additionnelles à propos de ce champ personnalisé.
Plusieurs vidéos par article
Si vous avez besoin de plusieurs vidéos dans un article, vous pouvez utiliser plusieurs instances de champs nx-YouTube en les créant via Contenu > Champs et en les ajoutant au groupe de champs.
La même vidéo sur plusieurs/tous les articles
Si vous avez besoin de publier la même vidéo sur plusieurs articles, vous pouvez faire cela avec l’option « Default Value Option » dans Contenu > Champs > votre champ. Chaque instance de ce champ affichera alors la même vidéo.
Utiliser un champ personnalisé seulement dans certaines catégories
Pour afficher un champ personnalisé seulement dans certaines catégories, vous pouvez utiliser les paramètres de catégorie lors de l’édition du champ (Contenu > Champ > Votre champ). Supprimez le tag « Toutes les catégories » et ajoutez les catégories que vous souhaitez en utilisant le menu déroulant.

À propos de l’auteur
Marco Rensch
Je suis un développeur, webmaster, photographe et designer graphique freelance. Ma principale motivation est de mettre en place des solutions simples permettant une grande liberté de personnalisation par les webmasters. … et tout cela en parallèle à mon emploi auprès d’un fournisseur de télécom Suisse 🙂