A two colour Site Title

[kategorgeous]

Hello there and Happy belated Christmas ...

I would like my main site title to be two colours ie the first word in purple and then the next word in brown.

Is it possible?

Thanks

Kate

---

http://www.underbrella.co.uk
Learn from yesterday, live for today, hope for tomorrow

[willyr]

Kate, I suspect you can do it with html, but wouldn't it be easier to create a graphic with the title coloured as you see fit, and then use that graphic as a title?

If you go to your Appearance tab on the left, and then click on the header link from the menu, you can see how you can upload a graphic for the header.

Then, see the code snippets to remove the existing header graphic, if necessary.

Hope this helps.

Cheers,

Bill

http://www.all-about-ottawa.com
http://www.incredible-kingston.com
http://www.fix-my-compressor.com

[wpsmith]

Yes, you can do this. I had to this for a client site back not too long ago. You can do this one of two ways:

First, you can filter what's already there:

add_filter( 'genesis_seo_title', 'wps_seo_title', 10, 3 );
/**
* Modify the Genesis SEO Title.
*
* @param string $title Default HTML title output.
* @param string $inside HTML blog name output.
* @param string $wrap h1 or p based on settings.
* @return string $title Modified HTML title output.
*/
function wps_seo_title( $title, $inside, $wrap ) {
// do something using <span> tags to manipulate your colors
return $title;
}


Second, remove the Genesis default and roll your own. Doing it this way will render the Homepage Settings in the SEO Settings pointless unless you build in the same logic.

remove_action( 'genesis_site_title', 'genesis_seo_site_title' );
add_action( 'genesis_site_title', 'wps_seo_site_title' );
/**
* Echo the site title into the header.
*/
function wps_seo_site_title() {
//do something, output some HTML
}


---

Travis Smith | Recommended StudioPress Developer & Contributor
WP Smith | @wp_smith | GitHub

Due to the forums, please paste code using Pastebin, JS Fiddle (for JavaScript) or GitHub.
How to use Firebug for Designers by SixRevisions

[kategorgeous]

Huge thanks but ooh heavens that sounds a bit complicated! How about I make the site title blank in the settings and set up a heading with Simple Hooks?

Would you be able to send me the link to the site that you managed to achieve the two colour HTML effect? Thank you

---

http://www.underbrella.co.uk
Learn from yesterday, live for today, hope for tomorrow

[wpsmith]

I would recommend the first approach. The site that I did this on has changed to an image logo since the launch of the site not worrying about the SEO of their site name.

So here's basically what I did:

add_filter( 'genesis_seo_title', 'wps_seo_title', 10, 3 );
/**
* Modify the Genesis SEO Title.
*
* @param string $title Default HTML title output.
* @param string $inside HTML blog name output.
* @param string $wrap h1 or p based on settings.
* @return string Modified HTML title output.
*/
function wps_seo_title( $title, $inside, $wrap ) {
return sprintf( '<h1 id="title"><span class="color1">%s</span><span class="color2">%s</span></h1>', 'text for color 1', 'text for color 2'  );
}


---

Travis Smith | Recommended StudioPress Developer & Contributor
WP Smith | @wp_smith | GitHub

Due to the forums, please paste code using Pastebin, JS Fiddle (for JavaScript) or GitHub.
How to use Firebug for Designers by SixRevisions

[Author]

Posts