Metro: big and bold header above container

[larsvanzanten]

Hi!

I'm using the Metro theme for my band's new website. I think it's absolutely gorgeous!

Just one thing: I want to create a big and bold header, but only on the homepage. I want to make a header (with transparancy, so the beautiful background is still visible) and some text before the container starts. Kind of like this theme from Indiefest. But like I said: only on the homepage! Any ideas on how to do that?

It would be even better if I could include a "slide down" option or something so that when users would click it the browsers slides down to the "regular" homepage.

Have you guys got any ideas on how to do this?

Thanks,
Lars

[wp guy]

Well, I can solve one of your problems - increasing the header size. Just adjust:
#header {
min-height: 87px;
overflow: hidden;
}

Check into this solution for only having your this header show up on the main page: http://www.jonbellah.com/2012/12/genesis-custom-header-for-multiple-page-layouts-and-templates/

http://efficientwp.com/tutorials/using-different-header-images-on-different-pages

[AnitaC]

For the header - home page only area - you could add in a Welcome Widget just for home page using Brian Gardner's instructions - http://www.briangardner.com/welcome-text-widget/ but you would need to add this to the code for "home page only."

if ( is_home() )

You could create a nice transparent image with the text you want and add it to that widget area.

Then to jump down the page as you want - you can add in a Page Jump using the instructions found here:

http://en.support.wordpress.com/splitting-content/page-jumps/#jump

---

Need help with customization or troubleshooting? Reach out to me.

[larsvanzanten]

Thanks for your comments! The welcome-text did the trick. Right now I'm linking in to an anchor-link which I put in the genesis_header Hook using the Simple Hooks plugin. I tried a few things to add a nice scroll effect but it didn't work out yet...

[larsvanzanten]

BTW: the site is live now: http://www.fmusic.nl. Happy to see your comments on it!

[AnitaC]

That looks great! Fantastic job!

---

Need help with customization or troubleshooting? Reach out to me.

[larsvanzanten]

Thank you!

[Author]

Posts