Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

Créer un site web pour les designers avec WordPress et Genesis

Régler les paramètres généraux de Genesis dans les articles

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Vous allez maintenant aborder le paramétrage des réglages généraux de Genesis au niveau des articles.
04:17

Transcription

Dans cette séquence, nous allons voir les paramètres généraux de « Genesis » que nous pouvons appliquer cette fois au niveau des articles, c’est-à-dire qu’on va pouvoir personnaliser la mise en page article par article. Donc, dans la liste de mes articles, j’ai créé un nouvel article que j’ai appelé « Nouvelle exposition » pour plus de facilité. Je descends un petit peu. Nous avons ici le bloc « Réglages pour la mise en page ». Donc, au niveau de la mise en page, proprement dit, eh bien, comme au niveau des réglages généraux, vous voyez qu’on a qu’un seul type de mise en page. Donc, ce qui va nous intéresser ici c’est la personnalisation des styles CSS. Nous allons pouvoir, eh bien dans un premier temps, ajouter une classe CSS qui soit spécifiquement dédiée à l’affichage du body de cet article, et uniquement de celui-ci. Pour ce faire, eh bien dans le dossier de votre installation locale « WordPress », dans le dossier « wp-content », dans le dossier « themes », dans le dossier « ambiance-pro », c’est bien le thème que nous utilisons, vous allez pouvoir modifier le fichier « style.css ». Vous pouvez l’ouvrir avec un simple éditeur de texte ou avec un éditeur de code gratuit comme « TextWrangler » sous Mac ou « Editplus plus » sous Windows. Vous vous placez tout à la fin de ce fichier, donc on est bien dans l e fichier du thème « ambiance-pro », « style.css ». Et ici, je place un petit commentaire afin de bien détailler mon code. Et ici, eh bien j’ai créé ma classe CSS qui va me permettre, eh bien, de personnaliser l’arrière-plan de mon article. Donc, ici, eh bien j’ai mis comme propriété « background-color » avec une couleur verte. Alors pour plus de facilité si je puis dire, pour éviter de me tromper, je vais pouvoir sélectionner le nom de cette classe, je vais la copier avec le raccourci clavier qui correspond à ma plateforme, je reviens dans ma session « WordPress », et dans la classe CSS personnalisée pour le body, je colle, là encore, avec le raccourci clavier correspondant à ma plateforme. Je mets à jour mon article, et je viens dans l’onglet de mon site publié. J’affiche l’article « Nouvelle exposition ». Et voyez que nous avons bien une couleur d’arrière-plan au niveau du body qui est verte. Alors si jamais la mise à jour ne s’effectue pas tout à fait correctement, ce qui peut parfois arriver, n’hésitez pas à fermer l’onglet de votre site publié et à le réafficher depuis votre interface d’administration. Je reviens sur la page d’accueil, j’ouvre l’article par défaut, et voyez que celui-ci conserve son arrière-plan standard tel qu’il était à l’installation, car nous n’avons pas personnalisé l’affichage. Nous avons personnalisé l’affichage uniquement de l’article « Nouvelle exposition ». Je reviens dans mon administration. Eh bien, sur le même principe, on va pouvoir appliquer une classe CSS pour l’arrière-plan de l’article. Nous avons ici le champ « Classe CSS personnalisée pour cet article ». Je reviens dans mon fichier CSS, et ici, eh bien, je vais pouvoir utiliser cette classe qui va permettre d’appliquer un arrière-plan coloré jaune. Je copie le nom de ma classe, je reviens dans l’administration, et je colle dans le champ de la « Classe CSS personnalisée pour cet article », et nous allons avoir un fond jaune. Je mets à jour mon article, je reviens dans l’onglet de mon site publié, j’affiche l’article en question, « Nouvelle exposition », et nous avons bien un fond d’article qui est jaune. Là encore, si je reviens dans l’article par défaut, eh bien, celui-ci n’est pas personnalisé. Nous avons travaillé uniquement sur « Nouvelle exposition ». Donc, voilà comment vous allez pouvoir, si vous le souhaitez, eh bien, personnaliser article par article les paramètres d’affichage avec des classes personnalisées pour cet article.

Créer un site web pour les designers avec WordPress et Genesis

Créez et personnalisez votre site web avec WordPress et le framework Genesis. Profitez ainsi de fonctionnalités adaptées aux besoins spécifiques de votre métier.

1h23 (27 vidéos)
Aucun commentaire n´est disponible actuellement
 
Thématiques :
Design web
CMS
Spécial abonnés
Date de parution :2 mai 2016

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !