[Resolved] Seperate h2, h3 topics

[breaked]

Hi,

I would like to style the h2 and h3 headlines separately. Is there a way to distinguish between the blog and static pages via css?

[Leo]

Hi there,

I would recommend setting the static pages using Customizer > Typography, then for blog page using CSS:

.blog h1,
.archive h1 {
    font-size: 20px;
}

[breaked]

Hi Leo,

I changed the typography via customizer. Unfortunately, nothing happens with the additional css code. I don’t know why.

[breaked]

I tried

.single .site-content h2 {
	font-weight: bold;
	border-bottom: 3px solid black;
}
.single .site-content h3 {
	text-decoration: underline;
	font-weight: bold;
}

But for this reason the widget title h2 also changes….

[Leo]

Can you link me to your site?

[breaked]

I edited the first post so you can see the link.

I solved the problem with the following code:

.single .site-content h2 {
	font-weight: bold;
	border-bottom: 3px solid black;
}
.single .site-content h3 {
	text-decoration: underline;
	font-weight: bold;
}

.widget h2 {
	border:none !important;
	font-weight:normal !important;
}

However, I don’t know why I have to set widget h2 with important.

[Leo]

That’s because the widget is included in .site-content

Glad you found the solution!

[breaked]

I figured out that with

.blog h1

nothing happened at my site. Could you explain?!

[Leo]

What do you mean? What’s the current issue?

Can you let me know which elements you are referring to on your site?

[breaked]

The problem is solved.

But I want to know what the elements are for .blog h1,
.archive h1 can be used.

Blog and archive are probably solid elements?!

[Leo]

Not quite sure what you mean still.

You would add .blog and .archive in front of selector if you only want them to change on index pages.

Hope this answers your question. If not let me know 🙂

[breaked]

Sorry, maybe because of the poor English language skills. When I appeal to .blog and .archive, nothing happens to me.
Is there something in the documentation?
If not, not too bad. The problem has already been solved.

[Leo]

When .blog and .archive are added, the code will only apply to the main blog page and archive pages.

.single will make the code apply to single posts which I believe is what you were after 🙂

[breaked]

Thanks.

That was exactly what I’m looking for.

[Leo]

No problem 🙂

[Author]

Posts