Changing colour of header & block quote texts

celabmq · Member · Dec 16, 2014 at 6:19 am
Copy link

Add topic to favorites
Hi,
Is it possible to change the colour of both Blockquote and Heading texts in the Tonal theme from the default to red, using CSS?
Thanks,
Tim
(PS – my blog is currently private, but I can invite you as viewer if it’s helpful)

The blog I need help with is: (visible only to logged in users)
nizamilputra · Member · Dec 16, 2014 at 7:51 am
Copy link
Hi, do you mean heading text is for post title?
Anyway, I sent request to your website .
staff-happychia · Staff · Dec 16, 2014 at 7:57 am
Copy link
Of course, yes :-)

Please try the following CSS and let me know if this what you are after.
```
h1, h2, h3, h4, h5, h6, .single-format-quote {
color:red;
}
```
celabmq · Member · Dec 16, 2014 at 11:41 pm
Copy link
Fantastic, thanks!

This works for header, but not for block quote, unfortunately. This page, for example, the quote is still in grey:

http://shockroomfilm.com/production-story/
staff-happychia · Staff · Dec 17, 2014 at 12:15 am
Copy link
Could you make your blog public so I can access it and get the correct CSS selector for blockquote? Thank you.
celabmq · Member · Dec 17, 2014 at 12:20 am
Copy link
Hi Chaitanya,

Not ready to go public yet, but I’ve just invited you as a viewer – let me know if you don’t get the invite.

Thanks!
staff-happychia · Staff · Dec 17, 2014 at 12:37 am
Copy link
Haven’t received the invite yet. However I can only look at this ~ 7 hours from now.
staff-happychia · Staff · Dec 17, 2014 at 12:49 am
Copy link
Received the invite. Will let you know the selector (my) tonight.
celabmq · Member · Dec 17, 2014 at 12:50 am
Copy link
Ok, thank you!
t
nizamilputra · Member · Dec 17, 2014 at 3:12 am
Copy link
Here css code for blockquote;
```
blockquote{
  color: red;
}
```
The blockquote style has opacity property, it means when you change the color, it will be little transparent . If you want to remove the opacity style you can use this css;
```
blockquote{
  color: red;
  opacity: 1;
}
```
If you want to change color of quote symbol, you can use this;
```
blockquote:before{
  color: blue;
}
```
celabmq · Member · Dec 17, 2014 at 4:20 am
Copy link
Oh brilliant, thanks Rizqi! That’s exactly what I wanted.
Done :)
Tim
nizamilputra · Member · Dec 17, 2014 at 4:37 am
Copy link
You are welcome. Glad can help you :).
staff-happychia · Staff · Dec 17, 2014 at 7:09 am
Copy link
Cool, this is sorted.

No items found.