This members-only tutorial provides the steps to add a hero section on the homepage with a transparent site header overlay with the header and logo shrinking when scrolling down.
- set transparent background for the site header
- set hero image as background covering both the site header and hero section
- set site header and the logo to shrink upon scrolling down
- invert the nav menu item colors in
- use a different logo image in
in Genesis Sample.
Tested in Genesis Sample 2.10.0 and Genesis 2.10.1.
.my-header's opening div tag
widgetarea and add
.my-header's closing div tag.
Add the following at the end of Genesis Samples
To view the full content, please sign up for the membership.
Already a member? Log in below or here.