Création d’un spectacle – Luc Petit – Partie 2 : Intégration du contenu

Une fois le contenu de votre spectacle prêt, il ne reste plus qu’à l’intégrer sur le site.

Nous allons donc : #

  • Créer la galerie d’images
  • Dupliquer le spectacle de base créé et appelé : Spectacle de base.
  • Intégrer les liens des vidéos.
  • Intégrer l’image utilisée pour le spectacle.
  • Intégrer les textes.
  • Intégrer les caractéristiques du spectacles.
  • Intégrer les logos de la presse ainsi que les liens vers les articles créés sur le site dans le blog.
  • Intégrer éventuellement les différents logos des Awards.
  • Intégrer la galerie.

Il suffira ensuite de publier notre spectacle.

Création de la galerie liée à votre spectacle #

Vous avez donc préalablement redimensionné et renommé vos images, elles sont prêtes à être ajoutées.
Nous nous rendons dans l’administration dans le plugin « Modula » afin de créer votre galerie et l’organiser.

En vidéo #

Dupliquons maintenant le spectacle de base #

Pour dupliquer un post, il vous suffit de cliquer sur le bouton « New Draft » de la sorte :

Une fois votre article dupliqué, WordPress ouvre le draft de ce nouvel article, il vous faudra le renommer et remplacer les données tel que nous allons le voir ci-dessous.

Les modifications à ne pas oublier lorsque votre article a été dupliqué : #

  • Votre titre.
  • Votre permalink.
  • Votre image qui sera utilisée pour l’aperçu de l’article dans la liste des spectacles.
  • Les données du référencement naturel (voir la partie SEO du site).
  • La date du spectacle afin que celui-ci s’affiche dans le bon ordre sur le site.

Image par défaut de l’article #

Votre image fera 960px sur 450px, il vous suffit d’utiliser le fichier PSD ci-dessous pour obtenir la bonne taille.

Après avoir créé votre image il suffit de l’intégrer dans votre article dupliqué de même que changer le titre et le permalien de la sorte :

Comme vous le remarquerez dans la vidéo ci-dessus, il ne faut pas oublier le champ ALT de l’image, ceci pour un bon référencement naturel.

Intégration des liens vidéos #

Une fois votre titre modifié, bien vérifier que le permalink possède le bon titre :

Remarques :

PAS d’accent dans le permalink.

PAS d’espace.

Regardons maintenant pour intégrer les vidéos dans le header, nous avons pour rappel ajouté deux vidéos : la version courte et la version longue.
La version courte sera directement affichée dans le header du spectacle et la version longue dans le popup.
Regardons sur Vimeo pour récupérer les liens vidéos car ils sont différents du lien directe :

Comme vous le voyez, il est inutile de mettre le lien avec la résolution en 1920px, choisir plutôt celle avec la résolution en 1280px (la seconde). En cas de problème de pixellisation, modifiez et prendre la résolution en 1920px.

Concernant le popup avec la vidéo, dans la configuration est présent un ID :

Cet ID n’a pas besoin d’être changé SAUF si vous souhaitez utiliser plusieurs Popup sur la même page.
Dans cette éventualité, contactez-nous, la procédure vous sera expliquée.

Intégrer l’image utilisée pour le spectacle : #

Cette image sera utilisée sur la page d’accueil pour illustrer le spectacle ainsi que dans la liste des spectacles.

Sa taille sera de 960x450px (72dpi), vous devez procédez de la même façon que lorsque vous créez les images de la galerie voir notre article ici.
Respectez bien les tailles de manière à conserver un site rapide et léger.

J’intègre l’image principale de mon spectacle : #

Intégrer les textes : #

L’intégration des textes se fait via la section logo, nous voyons également la partie permettant d’intégrer le lieu et la date du spectacle :

Lorsque un élément mentionne qu’il ne faut pas l’éditer, ne le faites pas il s’agit dun élément dynamique qui ne nécessite aucune édition.

Intégrer les caractéristiques du spectacles : #

Dans la précédente vidéo, je vous montre également comment modifier les caractéristiques du spectacle qui sont affichés dans la sidebar.

Intégrer les logos de la presse ainsi que les liens vers les articles créés sur le site dans le blog. #

Ces logos sont intégrés dans le contenu, une fois ces logos créés (voir notre tutoriel d’introduction ici).
Il faut les intégrer de la sorte :

Sur la vidéo vous pouvez voir que je clique après le logo existant que j’insère deux espaces et qu’ensuite je clique sur Média pour insérer le nouveau logo.

Pour insérer un lien sur le logo il suffit simplement de cliquer sur le logo en question et d’un intégrer un lien :

Intégrer éventuellement les différents logos des Awards : #

Voyons maintenant comment insérer les logos des partenaires ou Awards, vos logos sont prêts et vous avez suivi les directive de notre autre article sur le sujet et disponible ici.

Si vous ne souhaitez pas afficher les logos Awards sur un spectacle il suffit de désactiver la section de la sorte :

Sur la vidéo vous pouvez voir dans la procédure qu’il est possible de désactiver uniquement certains dispositifs : Mobile, tablette, desktop. Cette procédure peut donc être utilisée lorsque vous souhaitez désactiver un éléments sur un dispositif précis : ne l’afficher que sur desktop, pas sur tablette et mobile par exemple. C’est très utile.

Intégrer la galerie : #

Notre galerie a été préalablement conçue pour le spectacle via le gestionnaire de Galeries « Modula », voir la procédure expliquée dans ce même article ici.

Ensuite voici la procédure en vidéo pour intégrer votre galerie :

Votre galerie est intégrée ? Et bien voilà votre spectacle est pratiquement prêt à être publié.
Que reste-t-il ? Il vous reste à vérifier l’optimisation SEO qui sera gérée via Yoast dans notre prochain tutoriel à découvrir ici.