Archived topic
How to put 2 different colors on the website title?
3 replies · Started by Jerome on February 20, 2021
Hello!
I just bought Generate Press Premium. I would like to put 2 different colors on my website title "monconseillerfitness" with "monconseiller" in grey (html code 727272) and "fitness" in blue (html code 005dbf).
Is there a way to do that? Thank you very much
Hi there,
you would need to use some PHP to do that, this snippet will do that:
add_filter( 'generate_site_title_output', function( $output ) {
$titleHTML = 'monconseiller<span class="site-title-accent">fitness</span>';
return sprintf(
'<%1$s class="main-title" itemprop="headline">
<a href="%2$s">%3$s</a>
</%1$s>',
( is_front_page() && is_home() ) ? 'h1' : 'p',
esc_url( apply_filters( 'generate_site_title_href', home_url( '/' ) ) ),
$titleHTML
);
});
How to add PHP: https://docs.generatepress.com/article/adding-php/
This will wrap the second word in a span that can then be styled using this CSS:
.main-title .site-title-accent {
color: #005dbf;
}
How to add CSS: https://docs.generatepress.com/article/adding-css/
Thank you very much David for your answer. It worked really well!
Glad to hear that!