BTS NDRC, épreuve E5B : tutoriel WordPress

Activer les réseaux sociaux sur le site

Des icônes vers les comptes de l'entreprise permettent au client de la suivre, de voir ses nouveautés et de partager ses produits. Pour l'entreprise, elles relient le site à ses réseaux sociaux : un visiteur qui s'abonne reverra la marque à chaque publication.

Dans la circulaire

Famille « Apparence » de la liste WordPress : « Activer les réseaux sociaux » (annexe VI-3 de la circulaire nationale d'organisation, session 2026).

Critères de la grille d'évaluation concernés : 3. « la cohérence entre les techniques, les outils mobilisés, les contenus et les moyens de diffusion » ; 5. « le suivi des publications et le contrôle de l'image ».

Où le trouver

Avec Astra : Apparence › Personnaliser › Pied de page (ou En-tête), bouton « + » d'une case, élément « Social » ; ses réglages s'appellent « Icônes de réseaux sociaux ».

Dans une page ou une zone de widgets : le bloc « Icônes de réseaux sociaux » de WordPress.

Les étapes

  1. Ouvrir Apparence > Personnaliser > Pied de page. Le constructeur du pied de page, sous l'aperçu, compte trois rangées découpées en cases ; sur le modèle, il ne contient que l'élément Copyright, dans la rangée du bas.
  2. Survoler une case vide, cliquer sur « + » et choisir Social dans la liste « Insérer éléments ». Le même élément existe dans le constructeur d'en-tête.

    Capture 1. La liste « Insérer éléments » du pied de page : encadrés, l'élément Social, la case choisie et le pied de page du modèle, réduit au copyright :

    Constructeur du pied de page d'Astra : au-dessus de la première case de la rangée du milieu, encadrée en rouge, la fenêtre Insérer éléments propose Bouton 1 et 2, Diviseurs 1 à 3, HTML 1, HTML 2, Footer Menu, Social, encadré en rouge, et Widget 1 à 6, les éléments payants marqués d'un cadenas. Dans l'aperçu, le pied de page du site se limite à la ligne Copyright 2026 Alia Nature, Propulsé par Thème WordPress Astra, encadrée en rouge ; en bas, l'élément Copyright dans la dernière rangée du constructeur.

    Voir la capture en grand

  3. Cliquer sur l'élément placé : la section Icônes de réseaux sociaux s'ouvre. Elle propose d'office Facebook, Twitter et Instagram, un réseau par ligne. La flèche d'une ligne déplie ses champs : Label, Icône et URL, où l'on colle l'adresse de la page de l'entreprise sur ce réseau. L'œil affiche ou masque l'icône, la croix retire le réseau ; la liste déroulante et le bouton « Add Icon » ajoutent un réseau (Pinterest, TikTok, YouTube, LinkedIn, WhatsApp…).

    Capture 2. La section « Icônes de réseaux sociaux », ligne Facebook dépliée : encadrés, la ligne du réseau, le champ URL et l'ajout d'un réseau :

    Section Icônes de réseaux sociaux de l'outil de personnalisation, onglet General : la ligne Facebook, avec sa flèche et son œil, encadrée en rouge, est dépliée sur les champs Label (Facebook), Icône (Bibliothèque d'icônes ou Personnalisé) et URL, vide, encadré en rouge ; dessous, les lignes Twitter et Instagram, chacune avec une flèche, un œil et une croix, puis la liste déroulante réglée sur Behance et le bouton Add Icon, encadrés en rouge ; plus bas, l'interrupteur Afficher le libellé et l'alignement. À droite, l'aperçu de la page d'accueil.

    Voir la capture en grand

  4. Plus bas dans la section, « Afficher le libellé » ajoute le nom du réseau à côté de l'icône et « Alignement » place les icônes à gauche, au centre ou à droite de leur case. L'onglet DESIGN règle leurs couleurs et leur taille.
  5. Vérifier l'aperçu, puis cliquer sur Publier et contrôler le pied de page sur le site, sur ordinateur et sur mobile.
  6. Autre solution, dans une page ou une zone de widgets : insérer le bloc Icônes de réseaux sociaux de WordPress ; son bouton « + » ajoute un réseau et un clic sur une icône ouvre le champ de son adresse.

Attention

Placer l'élément ne suffit pas : chaque réseau affiché doit recevoir l'adresse de la page de l'entreprise. Pendant l'épreuve, Internet est limité au site du sujet : les pages des réseaux ne s'ouvriront pas, on contrôle donc l'adresse recopiée dans le champ URL plutôt qu'en cliquant sur l'icône.

Captures réalisées sur le site modèle Alia Nature (WordPress 7.0.2, thème Astra 4.13, extension Spectra) : selon la version installée le jour de l'épreuve, un libellé peut changer.

Bien choisir les réseaux affichés

Une icône promet au client un compte vivant : n'afficher que les réseaux où l'entreprise publie vraiment, avec l'adresse de sa propre page. Exemple pour Alia Nature, présente sur Facebook et Instagram :

Exemple : les icônes de réseaux sociaux d'Alia Nature
Réglage Réussi À éviter
RéseauxFacebook et Instagram, les deux comptes animés par la marqueLes trois réseaux proposés d'office, gardés tels quels, dont Twitter, que la marque n'utilise pas
AdresseL'adresse complète de la page de la marque, en https://Un champ URL vide, comme sur le modèle, ou l'adresse d'accueil du réseau
PlaceDans le pied de page, centrées au-dessus du copyright ; dans l'en-tête si les réseaux comptent pour la venteDes icônes en double, dans l'en-tête et dans le pied de page, qui encombrent la page
  • Choisir les réseaux d'après la cible : une marque de produits naturels vendus par des conseillers mise sur l'image (Instagram, Pinterest) et sur la communauté (Facebook).
  • Vérifier chaque adresse, lettre par lettre, avant de publier.
  • Garder les icônes sobres : les couleurs de la marque ou celles des réseaux, pas un mélange des deux.

Sur le modèle, l'élément Social n'est placé ni dans l'en-tête ni dans le pied de page : le site ne montre aucune icône. Ses réglages proposent Facebook, Twitter et Instagram avec des adresses vides (capture 2), et un menu « Réseaux sociaux », vide lui aussi, n'est attribué à aucun emplacement. Placer l'élément tel quel donnerait des icônes qui ne mènent nulle part : c'est l'exemple à ne pas suivre.

À l'épreuve

Exemple de consigne

Alia Nature anime une page Facebook et un compte Instagram. Affichez dans le pied de page du site les icônes de ces deux réseaux, centrées au-dessus du copyright, avec les adresses données en annexe, et retirez l'icône Twitter, que l'entreprise n'utilise pas.

Ce que l'examinateur vérifie

  • Les deux icônes visibles dans le pied de page de toutes les pages, centrées.
  • Les adresses de l'annexe, complètes et exactes, une par réseau.
  • Plus d'icône Twitter.
  • Le résultat publié et contrôlé sur mobile.

Les erreurs fréquentes

  • Placer l'élément Social sans renseigner les adresses : les icônes ne mènent nulle part.
  • Garder les réseaux proposés d'office au lieu de ceux de l'entreprise.
  • Coller l'adresse d'accueil du réseau au lieu de celle de la page de la marque.
  • Fermer l'outil de personnalisation sans cliquer sur « Publier ».

L'essentiel à retenir

  • Apparence > Personnaliser > Pied de page (ou En-tête), « + » dans une case, élément Social.
  • Icônes de réseaux sociaux : une ligne par réseau, la flèche pour l'adresse (URL), l'œil pour masquer, la croix pour retirer, « Add Icon » pour ajouter ; puis « Publier ».
  • Seulement les comptes réellement animés, avec l'adresse complète de la page de la marque.

Voir aussi

Dans la série des tutoriels WordPress :

Sur la stratégie : Choisir ses réseaux selon la cible. Documentation officielle de WordPress, en anglais : le bloc Icônes de réseaux sociaux.

Tous les tutoriels WordPress