Vous souhaitez modifier le « Designed by Elegant Themes | Powered by WordPress » situé en bas de votre thème DIVI ou Extra mais vous ne trouvez pas où personnaliser cela ?

Pas de panique, je vais vous présenter deux façons simples de modifier votre footer.  La première est spécifique à Divi, l’autre utilise Javascript pour remplacer les crédits et fonctionne à la fois avec Divi et le thème Extra.

Modifier le footer sur DIVI avec la fonction « Personnaliser »

Si vous utilisez Divi, la première méthode consiste simplement à naviguer dans le Customizer, à trouver l’option Pied de page et cliquer sur « Barre inférieure » comme sur le screen ci-dessous :

Modifier le footer du theme DIVI

En bas de la fenêtre des options du pied de page, vous trouverez l’option « Désactiver les crédits de pied de page »  et en dessous, vous verrez le champ « Modifier les crédits de pied de page » (voir la capture d’écran ci-dessus). Il vous suffit maintenant de placer votre nouveau texte de bas de page (ou tout autre élément que vous souhaitez ajouter) dans ce champ !

Extra : Modifier le footer via le Javascript

Comme Extra ne dispose pas encore de l’éditeur de pied de page intégré au Customizer, vous pouvez utiliser ce petit code JavaScript pour obtenir le même effet.

<script>
var year = new Date();
year = year.getFullYear();
jQuery(function($){
$('#footer-info').html('&copy; ' + year + ' <a href="/mentions-legales/">Mentions Légales</a>');
});
</script>

Dans le JavaScript ci-dessous, vous verrez que l’année est dynamique (elle s’affichera quelle que soit l’année en cours). En fait, il remplace le HTML de l’élément identifié par l’ID du pied de page par le HTML que vous placez dans le paramètre .html.

La seule partie de ce script que vous voudrez modifier se trouve à la ligne cinq, là où j’ai noté dans mon exemple <a href= »/mentions-legales/ »>Mentions Légales</a>.

Assurez-vous simplement de ne pas utiliser de guillemets simples entre la première et la deuxième virgule après le signe plus et la dernière avant la fin de la ligne.

Où mettre ce code ?

Il y a plusieurs possibilités… Mais la méthode que je recommande est de le placer dans le champ « Add code to the < head > of your blog »  que vous trouverez dans l’onglet Options du thème > Intégration (situé sous le nom Divi ou Extra sur votre tableau de bord WordPress).

Modifier le footer du theme Extra

A noter qu’il existe une autre méthode qui consiste à placer une copie du fichier footer.php dans votre thème enfant et à l’éditer, mais si Elegant Themes met à jour le fichier footer.php, vous perdrez vos changements à moins de remettre à jour manuellement votre fichier.

Comment centrer le footer dans DIVI ?

Suite à une question en commentaire, voici le code CSS à ajouter pour centrer le footer dans le thème DIVI.

.bottom-nav {
float: none!important;
text-align: center!important;
}

#footer-info {
width: 100%;
margin:0 auto;
text-align: center!important;
}

/* Si vous utilisez les réseaux sociaux en bas, ajoutez ce code */
@media only screen and (min-width: 980px) {
#footer-bottom .et-social-icons { margin-bottom:-28px;
}
}