Wondering how to start a food blog? Thinking about switching your site to a fresh, new look? Find out the differences between the Foodie Pro theme and Brunch Pro theme and learn the pros and cons of Shay Bock’s new WordPress food blogging template – from someone who has used it inside and out.
With the name change and relaunch of my website came a fresh new design. On my old site, Ramsons and Bramble, I was using Foodie Pro – Shay's older food blogging theme for the Genesis framework. It has served me extremely well for the past couple of years and remains heartily recommended – see my Foodie Pro review for full details of this theme.
But it was time for a change. My design feet were itchy and being a fan of Shay Bocks’ work I wanted to give her new child theme a whirl. As with Foodie and Foodie Pro, I have spent many, many hours playing around with Brunch Pro, really investigating its every capability and making it look exactly how I want it. This is what I discovered.
If you have any questions about this theme, I’m happy to answer them in the comments!
Brunch Pro theme: Widgetized areas
Like Foodie Pro, Brunch Pro has a huge number of widgetized areas. These areas enable you to place a range of different website content into your blog with drag-and-drop ease. The sidebar is widgetized, but the theme also includes many other areas that you can easily adapt in this way. This theme comes with the capability to import all the demo widgets at once (full details available here) which is very helpful during set-up if you don’t have much content yet. An older post on the Foodie Pro takes you through some of these widget areas.
The homepage is really well widgetized, which is great for a professional-looking, magazine-style layout (see my homepage). One feature that differs from Foodie Pro is the ability to include three skyscraper images (hero images) at the top of the homepage. The theme is set up for these to show individual posts, but I opted for three category-linked graphics instead. This adjustment is extremely easy to make and Shay includes full details on her site.
Brunch Pro has an After Entry area so you can add content to the end of each post (for example a profile widget as with my site, an advert, a newsletter sign-up or some other call to action). This is a great place to reach readers that have remained engaged right to the end of your post.
There is also a Before Header area which enables you to put a message or newsletter sign-up across the top of every page of the site. For me though, this looked a little thick on the finished site, pushing more important content out of the above-the-fold area, so I decided not to use it.
The footer has four widget areas for you to add profile details, logos, social media icons, popular posts and adverts. However, I opted not to put much in my footer this time as feedback from Hotjar heat maps suggested very few people ever scroll down there.
Brunch Pro comes with Header Right area so you can place a leaderboard advert next to your logo – this was a feature I had to code myself in Foodie Pro. However for this redesign I have opted not to use this area as (on the advice of Foodblogger Pro) I have decided not to run adverts on the site for now.
I was also easily able to create a few more widget areas using simple web tutorials or plugins. I added a Before Entry area so I could include a message about the name change at the beginning of every post, as well as subject-specific Sidebars and a few more Recipe Indexes – more on them later.
These technical edits are detailed in a separate post, Styling Brunch Pro.
Brunch Pro theme: Featured posts widget
Like the Foodie Pro theme, Brunch Pro has its own featured content widget, enabling you to make beautiful, category- or tag-specific grids of your content in any area that can carry a widget – your latest posts, posts with the most comments, posts about cake. To name but a few.
This is most useful on the homepage and in the recipe index (described below), but it also allows you to place elegant image arrangements in your sidebar and footer. I love having the ability to display different numbers and sizes of images side-by-side, as you can see all over my site, as I think it makes the page look more interesting.
Brunch Pro theme: Recipes
One significant change between Foodie Pro and Brunch Pro is the change in recipe plugin. Where Easy Recipe was previously recommended, Brunch Pro now uses Simmer. I have been using Recipe Card, although this plugin is well out of date now. I experimented with Simmer and while the theme's recipe styling looked great on short recipes, it didn't look quite right on some of my longer, multi-stage recipes. I adjusted the CSS and got it looking more how I wanted (see it in action in this post – Spring mushroom lasagne), with all the ingredients first followed by the instructions – if anyone's interested in that code, leave me a note in the comments.
But I do find entering the recipes pretty laborious – you have to create each recipe in an entirely separate dashboard section, then insert it into the post. Although you can copy and paste ingredients in bulk, headers have to be written then dragged and dropped manually and there is no scope for ingredient amounts with a range like 30-60ml. As far as I can see you can't link from the ingredients, which is something I regularly do.
I plan to experiment with Simmer for recipes going forward – it's a much more up-to-date plugin and I imagine it has superior structured data, but a total switch of my old content seems impossible. For now my old recipes will remain with Recipe Card and I'll have to live with two different recipe designs on my blog at the same time. Not pleasing for my perfectionist web design tendencies.
I'll keep you updated with any changes!
Brunch Pro theme: Visual recipe index
Another great feature of this theme is the visual recipe index. There is a whole, separate widgetized page built into Brunch Pro that enables you to display your recipes in beautiful grids, using multiple featured content widgets like the homepage. This is a lovely way to direct your readers to your content, quickly, easily and visually.
My review of Foodie Pro expressed reservations that there was only one page like this in the theme. I can think of many situations where separate widgetized pages would be useful, indeed other bloggers have emailed and commented with similar thoughts. This situation remains the same in Brunch Pro, however I am pleased to report I have now found a workaround! Full details are included in my post, Styling Brunch Pro.
There is an alternative type of recipe index you could consider that I built for my old site. Because many of my recipes contain multiple components that are not necessarily reflected in the titles and featured images of the posts, I felt unable to include these in the visual index as it would look confusing. Instead I created a text-based recipe index where I could list all the sauce components, for example, from all the recipes that contained sauces under the title “Sauces”. In the visual index this would not look right as the picture might not obviously be of sauce. To make things a little more visual, I then added a picture of each type of dish (see above). When clicked on, the page jumps down to the point you can find the appropriate links.
I wrote a pretty comprehensive tutorial about how to build a recipe index yourself, however for my latest site design I have opted to only use the visual recipe index as the text-based index required me to enter each link manually – and I kept forgetting.
Brunch Pro theme: Visual content archives
As with Foodie Pro, you can customise your content archives. Content archives are the pages that are generated and displayed as search results or when a category or tag is clicked. You have many choices with this theme about how you want these pages to look – traditional image/title and image/title/excerpt or customisable visual grids as for the homepage and the recipe index.
These visual content archives can also be used to create subject-specific pages that look quite like the recipe index, if you don't want to go down the route of adjusting code. Although I strongly recommend that you do – it's fun!
For now, my visual content archives are set to display a square thumbnail and the post title, with two images side-by-side, ten posts/images per page, but this can all be adjusted.
Brunch Pro theme: Customisation
As with Foodie Pro, this child theme offers a huge range of customisation options that are imbedded in the theme and can be adjusted in your WordPress dashboard. Different sidebar/content layouts, as well as changes that would typically be made by altering the CSS code, making this a great theme for beginners.
In the dedicated Customiser you can:
- change the fonts, headers and menu items (style, sizes, colours)
- change the buttons and links (colours)
- upload your own background
- upload your own logo header
- set up your content archives
These customisations will enable you to easily create a beautiful, personalised website that really feels like your own, although I do encourage you to experiment with adjusting the CSS code to get the site looking exactly how you want it. It's a very rewarding skill and makes you feel like a website magician. For this redesign I made many, many CSS tweaks that were out of the scope of the Customiser and I wouldn't have been quite happy without them. My post Styling Brunch Pro details the changes I made.
Brunch Pro theme: Tutorials
Shay and her team also have made many tutorials to help you set up your site:
How to style Easy Recipe to match your Brunch Pro site
Using static images in their hero area with Brunch Pro
Using Type Kit with Brunch Pro
Using Google fonts with Brunch Pro
How to change the header size in Brunch Pro
How to use the customizer
Install Brunch Pro with demo content and import widgets
How to configure the Brunch Pro homepage
How to configure the Brunch Pro recipe index
How to add a retina-ready logo header to Brunch Pro
How to configure the Brunch Pro content archives
How to configure the Brunch Pro footer widgets
How to add a Simmer recipe
How to link to a category in your menu
Add a widget area before your entries (works with Foodie Pro)
These tutorials are clear and very useful, and if you have any problems setting up your site, her team will offer e-mail support with a fast turn around and will help you make your site look as the one in the demo does.
But this assistance only extends as far as mirroring the demo site – if you have any other questions about how to tweak your site, you will be directed to a hired developer. I fully understand how difficult it would be for Shay and her team to offer customisation support to the large numbers of people using this theme, but it can leave you a little stuck. Hiring a developer just isn’t an option for many people and some of us would dearly like to be able to make the changes ourselves, to learn these useful and rewarding computer skills, albeit with a nudge in the right direction.
As I said in my last review, perhaps a support forum, instead of e-mail support would be an option for this theme? I received many, many questions about minor edits of Foodie Pro that could have been better answered in a collective, searchable forum, although I was very happy to host so many people taking their first steps in code editing! Do continue with your queries for Brunch Pro!
Brunch Pro theme: Mobile responsiveness
Brunch Pro is fully responsive – this means it adapts to the screen size the reader is using and presents them with an optimised version of the website, in fact Brunch Pro has four different mobile sizes built into the theme. This responsiveness reduces loading time for small devices and enables the most important content to be seen more clearly on small screens.
The last incarnation of my site did away with mobile responsiveness all together, although it was included in the Foodie Pro theme. In fact I wrote a whole tutorial on how to disable the mobile theme in Foodie Pro. However for this site redesign I have decided to embrace it. Google has been very clear about its plans for demoting sites that are not mobile responsive and I can see from my own Google Analytics that my bounce rate is highest for mobile. Also, for now I am not running adverts, so the lack of sidebar on mobile devices didn't seem so important.
However I still wanted to prioritise the desktop look – it so much prettier! Specifically, I wanted my site to look the same as the desktop version for most screens and only become mobile responsive around the size of a small tablet. That felt like a good compromise to me. To do this in Brunch Pro I had to adjust the CSS, but it turned out to be much easier than I thought. I am now extremely happy with how my site looks on all devices and I'm trying to embrace the design challenge of mobile responsiveness rather than to just hate it 🙂 Full details will be included in my post, Styling Brunch Pro.
I'd love to know what you think of the change in the comments.
Brunch Pro theme: Recommended plugins
In addition to Simmer, Brunch Pro theme comes complete with styling for several important plugins, to make them blend as seamlessly as possible with the design of your site. Genesis Enews Extended plugin allows you to add various newsletter signup boxes to your site, which fit nicely with your chosen theme. Simple Social Icons similarly helps keep your fans up-to-date with your content, offering colour-customisable icon links to your social networks, via a widget. Gravity Forms are also recommended, but I already use the free Contact Form 7 for my simple contact form and that seemed enough for my needs.
Brunch Pro theme: WooCommerce shop
If you are hoping to build a beautiful, elegant shop with this theme, you can! Although the theme itself doesn’t offer WooCommerce compatibility, using the Genesis Connect for Woo Commerce plugin makes everything play nicely.
Brunch Pro theme: Conclusion
So there we have it. I'm extremely pleased I made the leap to change my theme, relaunch the site and move forward with a fresh, new design. I was perfectly happy with my old design, and with Foodie Pro, but Brunch Pro feels that bit more modern, that bit cleaner, that bit brighter, that bit more shiny. It is highly, highly functional and I hope, with the structure I created, easy to navigate. And once again I can say my site looks and works better now than at any point previously, and I have Brunch Pro to thank for it.
Build your own beautiful brand with this Genesis child theme, made for showcasing your gorgeous, colourful photography and your mouth-watering recipes.
Highly recommended!
Brunch Pro is a premium theme available from Studiopress.
It runs on the Genesis Framework.
You can buy Brunch Pro and Genesis together.
Or if you already have Genesis, get Brunch Pro separately.
