Genesis has built-in column classes which we can use to arrange widget areas next to each other vertically in columns. In this article I share code for registering multiple widget areas and displaying their content in various combinations (number and split ratio) of columns. Note:
- In the sample code below genesis_after_header hook is used. You might want to replace it with one of the many Genesis hooks depending on where you want the columnized widget areas to appear.
- Also an if conditional is set to restrict the widget areas container to site's homepage/front page. You may want to adjust that depending on your design needs.
- Screenshots were taken with Genesis Sample as the active theme. Code may need minor adjustments in other child themes. After adding the code, go to Appearance > Widgets and drag your desired widgets into the widget areas.
2-Columns 50% - 50%
To view the full content, please sign up for the membership.
Already a member? Log in below or here.