Last year a group of friends and I took a much-needed getaway trip to the mountains of Colorado. Naturally, I had to design a website for this event we call Brocation. You can view the website here.
One of the things I wanted on the site was a section to showcase members of our trip — a way to display photos with a link to our Twitter accounts.
Here’s a screenshot of what I came up with:
I thought it might be helpful to show you how I did that. Implementing in your custom theme will vary depending on what you have.
Here are the steps I used to add a grid of photos on my homepage:
1. Register the “members” widget area in the functions file:
2. Hook the “members” widget area after the site header:
3. Add HTML for the member images into a text widget:
4. Add CSS for member images in theme style sheet:
If you’re looking to add your photos section in another location, here’s a comprehensive list of Genesis Hooks for you to use as reference.
I’m also pleased to share with you some Genesis code snippets that I use when I’m developing websites with the Genesis Framework. They are free to use, so go ahead and do whatever you want with them.