This was originally titled “Adding an Info Bar to top of a site v.2” because we are building on that tutorial’s example, but then I realized this tip’s power is really in the ACF control manipulating a GPP Element, not so much the Element’s job (ie, Info Bar).
BTW, if you’re interested in adding an Info Bar to your site, that’s covered here.
So what are we doing here, and why? GPP Elements’ display rules are powerful, but for some website owners, they can be overwhelming. (“What does Singular mean? Do I choose Page or Pages? WHAT’S A TAXONOMY?!”)
Instead, we are providing the website owner a convenient toggle on their Options Page to activate & display a GPP Element block. Toggled to ON = the block is shown to website visitors; toggled to OFF = the block does not appear.
Required:
1. GeneratePress Premium (GPP) for the Elements module. (Ensure GPP’s Elements module is activated.)
2. Advanced Custom Fields (ACF) Pro.
3. Code Snippets.
- Add a class to your GPP Element’s main container. In our example, that’s class
container__cindys-top-bar. - Set the Element type to “Hook”, and Hook name to “before_header”.
- Set your Display Rules. In this example, we want the Info Bar to appear across the entire site.