Inline markdown css

Support Themes & Styling
1

HI guys,

sorry if the question sounds trivial. I’m sure I read this in the online documentation, but I cannot find it anymore.

Is it possible to add some custom css class directly into a markdown file? Supposing to have a page with some headers and you want to change the color (or other style) of only the headers in that page.

Is there a way to easily add some custom css class like:

My headercolor:“blue”

?

Thanks for any suggestion and sorry for the noise

Cheers

Matteo

2

Hi @ghtmtt, you might want to explore Markdown Extra but depending on the theme/setup sometimes this might cause display issues (I have had mixed results). There is more info here: Add own classes in markdown/html tags?

You must enable Markdown Extra in your system.yaml configuration file.

3

Hi Paul,

great thanks. I’m a little bit “afraid” to use Markdown extra because what you described.

I needed to change some headers of the hero class in what is my homepage. I did:

<div class="title-h3">
<h3>My h3 header</h3>
</div>

in the markdown file, and:

.title-h3 h3, .title-center h3 {
	font-weight: bold;
	color: #51a351;
	text-shadow: 2px 0 0 #d9c32e, -2px 0 0 #d9c32e, 0 2px 0 #d9c32e, 0 -2px 0 #d9c32e, 1px 1px #d9c32e, -1px -1px 0 #d9c32e, 1px -1px 0 #d9c32e, -1px 1px 0 #d9c32e;

}

in my custom css.

I thought this is a smart solution…

2 Likes
4

Great, wrapping a Div is a great option that you don’t have to use Markdown Extra for👍