The Child Themer plugin essentially does two things. It helps you create your child theme and it provides a powerful editor to edit your child theme. That’s all it does. And does in an awesome way!

While Beaver Builder is our favorite theme to start with, Child Themer also supports these other themes:

• Genesis Framework
• Beaver Builder Theme
• GeneratePress Theme
• Ocean Starter Theme
• TwentySixteen Theme
• TwentySeventeen Theme

Create The Child Theme

First off, creating your child theme. If you are developing and customizing WordPress sites, chances are you are running up against the need to create child themes. It’s the WordPress way of customizing a parent theme without compromising your ability to update that parent theme in the future.

With Child Themer, you simply enter a few pieces of information about your child theme and click create. Child Themer then creates a new child theme based on the active theme. If you already have an active child theme and want to make a clone of it, select the Clone the currently active Child Theme? option.

Edit The Child Theme

The editor included in Child Themer gives you the features of an offline editor, but in the back-end of your WordPress site. Line numbering, code lookup and syntax highlighting are included. There’s also plenty of templates available to mimic your favorite code editor.

When you save, Child Themer pre-checks your code and won’t save if doing so would cause a fatal error.

There’s also a front-end CSS editor included with a sweet little search feature. How many times have you scrolled huge CSS files looking for a certain class?

Related Product Videos

Child Themer Preview

https://vimeo.com/195361657

Child Themer File Editor Preview

https://vimeo.com/195656566

Child Themer Final Teaser

https://vimeo.com/195977635

Beaver Builder has released more news about their upcoming plugin and theme releases and 3rd party developers have been busy with their own new updates. Here’s a rundown of the latest and greatest…

Beaver Tunnels 2.0

The awesome plugin, Beaver Tunnels just updated to version 2.0 and got a total brand makeover and a new website too. This is one bit of software we could not do without and the new updates extend the power of Tunnels even further. The new Tunnels includes an updated user interface in the admin back end making it easier to define display rules. There are a few new display conditions including page types, cust0m post types and time-based conditionals. If you’re running Beaver Builder in a white label environment, Beaver Tunnels now respects those settings too. More about Beaver Tunnels on our product page and watch David Waumsley’s YouTube review.

Free theme from Beaver World

Beaver World released an amazing new e-commerce theme for Beaver Builder users called BSHOP based on WooCommerce. The theme is very clean and well laid out and incorporates a nifty cost filter too. If you want to set up shop quick, with a minimal, modern, responsive e-commerce theme, then download the free BSHOP theme now.

Subscribe Form Stylesheets

The clever folks at BeaverAddons have created a simple series of CSS stylesheets for getting those subscribe forms looking great. Like their contact form stylesheets, these CSS rules are brilliant for adding unique effects to your forms. Check out the 5 free styles here.

Beaver Builder October Update

Beaver Builder released an Alpha version of the soon to be released plugin version 1.9. The full release notes are available here. One of the top requested features included in this release is columns in columns. Included is a great update to the responsive settings for row, column and module padding and margin settings allowing for greater control of elements at varying device sizes. Here’s Justin with a rundown of the new features…

Powerpack updates and Discounts

There is no doubting the power of Powerpack and up until the 30th of October you can get PowerPack at 30% discount. That’s $49 Unlimited Sites, 35+ Modules, 20+ Page Templates & 100+ Row Templates, Support & Updates for 1 Year – bargain! Powerpack just updated to Version 1.1.8 and it now includes a new module called content tiles. Tiles displays a block of posts in a grid view with overlay post titles and comes with a few pre-defined layouts – great for blog headers.

Ultimate Addons Releases new templates

Ultimate Addons for Beaver Builder keeps getting more and more powerful and the recent update to Version 1.3.1 brings a new cloud-based template library which includes 40 page templates and 195 section templates. The new Cloud Templates library makes downloading and adding the pre-built page and section designs to your site really simple and reduces the plugin weight enormously.

NEW! Creative Beaver

Creative Beaver is a new initiative by Martin Nickisch Conde that aims to crowdsource ideas for Beaver Builder templates. Martin will build out designs from the submitted requests based on their support through upvotes. It’s a novel approach to creating resources for Beaver Builder and helps to ensure that the community gets relevant resources that include unique ideas. Cast your vote and add your ideas here.

Interviews by David Waumsley

There is no doubt that Beaver Builder makes running a web development agency a whole lot easier. However, web development is an extremely competitive and tough business, requiring dedication, nerves and perseverance to achieve success. David’s interview series takes a look at the workings of a number Beaver Builder based agencies, offering an incredible insight into the success of each of these businesses. In the latest interview, David talks to Dutch-based developer Peter Luit about his work and how his incredible curiosity enables him to get to grips with the real issues facing modern web development.

BeyondBeaver

Finally, Grant over at BeyondBeaver has updated his site – it’s looking amazing and you’ll find plenty of great Beaver Builder tips and tricks on his blog and awesome YouTube channel. Grant publishes plenty of great child themes and templates to help you get your own site up and running fast. Check them out here.

Wrap Up!

That’s it, folks! If you’re enjoying the many festivals around the world, play safe and have fun and for those of you enjoying the first buds of spring – send us some sunny smiles!

One of the most common questions asked about the Beaver Builder theme is how you create unique header and footer designs for your site. Whilst the customiser does offer some powerful options, it’s not a complete solution. Access to further design options is not available in the Beaver Builder theme as of now – the only way round it is to set your page template to ‘no headers and footers’ and design the complete blank canvas accordingly.

That’s fine when you have just one page to do, but when you need to make amendments to a whole bunch of pages, you could find yourself spending a lot of time doing so.

That’s where ‘BB Header Footer‘ makes thing easy. Instead of using the ‘No Header/Footer’ template and then adding headers and footers manually, use this plugin to ‘replace’ your header and footer with one you’ve pre-designed. The plugin allows you to select an alternative header or footer from a pre-design Beaver Builder page layout or template and apply it to your whole site. At the moment it’s only able to replace your headers and footers site wide, but Nikhil tells me that they’re working on an update to the plugin that will allow you to choose unique designs on a page by page basis.

Removing the default header may seem like a bad idea as you lose structured markup which Google uses to understand the content and layout of your pages. However Nikhil has confirmed that his plugin will retain the markup generated by the default headers.

So how do you go about replacing the Beaver Builder theme header using this plugin? Here’s a step by step guide. In the screenshot below we’re going to replace the standard header and navigation elements, outlined in yellow, with our new design.

Step One – Create a header template

In the screenshot below we’ve created a new template called ‘New Header’ that will be used to replace our standard BB theme header. If you don’t see ‘Templates in the WordPress admin sidebar, make sure you have them enabled in the Beaver Builder Page Builder options under Settings –> Page Builder –> Templates tab.

Step 2 – Design your new header

Using the Beaver Builder page builder, design your new header using the modules you need. In this example, we’re going to make our header row background colour yellow and we’re going to add a menu and social network icons to the design.

Step 3 – Publish your new design

In the screenshot below, you can see the default header and navigation menu and below it our new, very yellow design that will replace it.

Step 4 – Choose your new template

Head over to Settings –> Page Builder –> BB header Footer tab and from the header drop down, choose your new template. Click on Save Settings to enable BB Header Footer to apply the template as your new site wide header.

Step 5 – Check design

Head to the front end of your site and you should now see that the new template design replaces your standard Beaver Builder header.

Nikhil’s plugin makes replacing standard header and footer designs really easy and with updates coming to the plugin, we should start to see further customisation options available too. A great start and we’re looking forward to seeing how the plugin grows.

For support options, use Nikhil’s Github page located here.

I like to give as many visual clues as possible to help users understand the context and depth of my site. Highlighting menu items is an important way of indicating where they are on the structure of the site. It also reinforces the main sections of your site – the sections that should be the basis of your header menu.

So keeping main menu items highlighted when viewing subpages is really important to me. There are two ways to achieve this:

Nested Menu Items

The first way expects that you have nested sub-menu items in your header menu.

Add nested menu items to your header menu as per the screenshot below.

With ‘Themes’ and ‘Modules’ nested below ‘Products’ in this example and using the CSS code above, ‘Products’ will always remain highlighted when navigating to either of these sub-pages. The screenshot below shows that I am on the module page and the ‘Products’ menu item is still highlighted.

Nested Pages

This next option expects that the pages and subpages of your site are nested. See the screenshots below for an example. In the CSS code, you’ll notice that the only thing that has changed, is instead of – ‘.current-menu-ancestor’ – we now write ‘.current-page-ancestor’. This ensures that any pages nested below your main menu item will remain highlighted.

In the screenshot above you can see that Modules is a subpage of Products so using the CSS will ensure that when you are on the Modules page, the Products menu item will remain highlighted.

Add either CSS snippet to your style.css file in your child theme, or add it to the Beaver Builder Global settings CSS tab, or in the theme Customiser –> Code –> CSS Code tab.

This solution is in part thanks to the Beaver Builder support article I found here.

Jon brings brilliant knowledge and energy to SureFire and alongside his core services he shares his experiences through, courses, podcasts and his pretty extensive blog.

Podcasts

You can find Jon sharing valuable, hard-earned knowledge on Developer to Millionaire and via his new collaboration with Kim Doyle over at Freedom Papers Podcast. Both Jon and Kim have walked the walk in the web business, sharing both their successes and failures with candid honesty.

Training & Courses

Jon has put together a course series called ‘Ultimate Workflow with Beaver Builder, Genesis, and Views‘ walking you through the entire process of creating a powerful WordPress site with Beaver Builder, custom post types, taxonomies and front end display templates. Jon kindly let me take a look at the course and I have to say, it’s pretty extensive so you’re going to learn a ton from this. His 12 part course on the Genesis Framework gives you a complete overview of building Genesis child themes, action hooks and filters, and in-depth CSS styling for the framework. Jon has published the first video in the series free, so go check it out.

Jon is planning on adding more courses soon.

Obviously, the Beaver Builder theme is 100% compatible with the plugin but many developers use Genesis and Genesis Child themes in combination with Dynamik Builder with great success. GeneratePress is fast becoming another popular choice.

David Waumsley has written an extensive post on this subject – a must read if you’re trying to decide on a suitable theme for your next Beaver Builder project.

Other themes offer varying levels of success – you’ll find specific settings like hiding page titles in your theme require some fiddling to get to work. However since most of the page builder functionality resides within the content element of your theme, you should find the Beaver Builder plugin works well with just about any well-coded theme.

In this video, Adam Preiser talks through GeneratePress, Studiopress and Dynamik Builder as theme options for Beaver Builder.

For WordPress themes we know to work well with Beaver Builder, see our theme product pages here.