Introduction au CSS

Introduction au CSS
0

(Marie-Pierre Guignard) #1

Publiez vos questions & commentaires sur cette leçon ici!


(François Douville) #2

Je tente de mettre la partie sous /* Pour les articles de blogues */ afin de modifier seulement le design des articles. Ça ne semble pas fonctionner. Je ne vois pas où est le problème. Mon site (en construction!) est proteinov.com… Merci!


(Jean-Sébastien Gagné) #3

Salut @francois.douville,

Le code sélectionne les articles uniques de cette façon : body.single

Il serait appliqué, par exemple, sur l’article https://www.proteinov.com/insectes-proteine-animaux/ de ton site web, mais pas sur https://www.proteinov.com/blogue/ .

Cependant, je constate que le code s’affiche partout sauf sur les articles uniques. Essaie d’ajouter le code directement sur l’article dans la section de l’éditeur permettant d’ajouter du CSS. Tu vas pouvoir voir si les modifications sont appliquées…

Où est-ce que tu as ajoutés le code exactement ?


(François Douville) #4

Oui Ok je vois la différence. J’avais mis le code dans “theme options”, puis “style & layout settings”. Par contre, même en insérant le code dans l’article lui-même, ça ne fonctionne pas. Je crois que c’est parce que ma page blogue s’affiche pas correctement. On vois directement mon article. On devrait voir un bref résumé des articles et les gens pourront cliquer sur l’article qu’ils veulent. Peut-être parce que j’ai seulement un article, il s’affiche directement? Information peut-être utile : j’ai mis la page blogue comme “posts page”.


(Jean-Sébastien Gagné) #5

Pourtant, je peux voir que le code se trouve à présent sur l’article et que les modifications ont été apportées. Qu’est-ce que tu aimerais accomplir exactement ? Je peux te donner le code CSS à ajouter tout simplement. :slight_smile:

Si c’est concernant l’extrait des articles, ils devraient se trouver sur ta page : /blogue

Tu n’as qu’à sélectionner “Post excerpt” à la place de “Post content” comme expliqué dans cet article : https://thrivethemes.com/tkb_item/excerpts-full-content-display/


(François Douville) #6

Merci! Tout fonctionne à merveille!


(Olivier Lambert) #7

Un message a été déplacé vers un nouveau sujet : Besoin d’un coup de main avec mon design! (CSS)


(Éloïk) #8

Wow! Je suis fascinée!! J’ai hâte d’aller faire le petit cours de 7 heures! Merci! :grin:


(Olivier Lambert) #9

:heart: !!! On a aussi une formation donné par @karelle ici:


(Alexey Leblond) #10

J’ai du mal à comprendre comment faire le span class=“change highlight” et que ça fonctionne?anyone? :sweat_smile:


(Olivier Lambert) #11

Veux-tu me donner plus de détails stp? Tu parles d’une étape de la vidéo? Quel est le timestamp de cette étape (ex: 4 min 12). Ça va m’aider à te fournir des explications de plus :slight_smile:


(Alexey Leblond) #12

Le même effet que sur ton site olivierlambert le h1.heroTitle.uppercase

merci :smiley:


(Olivier Lambert) #13

Oooohhhh je vois!

Eh bien en fait, “heroTitle” et “uppercase” doivent être défini dans ta feuille de style!

Tu dois donc avoir ceci dans ton CSS:

.heroTitle{
	box-sizing:border-box;
	color:rgb(14, 30, 43);
	display:block;
	font-family:Proxima-Nova-Black, sans-serif;
	font-size:42px;
	font-weight:800;
	line-height:46.2px;
	margin-bottom:10px;
	margin-top:40px;
}

.uppercase{
	text-transform:uppercase;
}

À noter que la police d’écriture doit être installé sur ton site pour qu’elle fonctionne! Je ne te recommande pas de copier/coller mon code, mais bien de jouer avec les paramètres toi-même pour donner exactement le look que tu souhaites :slight_smile: