How to make full width slider/image in any genesis child theme?

Beaver Builder
1

Hi,
I am very, very new to BeaverBuilder and I want to use it on a couple of sites that I am using Genesis child themes (various themes).

The problem:
When I add a row and select FULL WIDTH, it stays within the container.

How to I make a row full width true full width?

Thank you in advance!

Kirsten

2

Genesis ChildTheme edge-to-edge requires a page template and css. Here are some examples:
For Genesis > Dynamik Child Theme:
http://cobaltapps.com/forum/forum/dynamik-skin-forums/tools-tips-other-skin-resources-aa/39470-fun-with-beaver-builder#post39470

for Genesis > Magazine Pro Child Theme:
http://forum.wpbeaverbuilder.com/support/q/bb-and-genesis-for-landing-pages/#post-7552

For Genesis > Generate Pro Child Theme:
http://cobaltapps.com/forum/forum/dynamik-skin-forums/tools-tips-other-skin-resources-aa/39470-fun-with-beaver-builder?p=41573#post41573

3

Thank you Kelly but that did not work. I even downloaded the magazine pro and tried that code with it and all it did was mess up my site. Perhaps I pasted the code in the wrong area?

I never, ever pay this much for plugins and I am so frustrated!

All I want is the capability to create a full width home page like the “HOPE” template using genesis as the base theme.

Can someone please help me? I’m on a deadline (of course).

Keeping my fingers crossed and thanking in advance.
Kirsten

4

Hi Kirsten,
perhaps this could help: Full Width Genesis. This is a great video from Colin (Dynamik Beaver). It’s based on Dynamik Website Builder but should work with Genesis only as well.

Regards, Leo

5

Hi Kirsten:
I use Magazine Pro on a # of sites, and the BB full width template + css works.

Step #1: Full width page template:

What did you name your page template? I use Genesis Extender so I don’t name the page template within the code.

I’ve added the template name to the Junior Atoms Code:

<?php

/**
* Template Name: Beaver Builder 
* Description: Used for edge-to-edge Beaver Builder Page
*/ 
*/ 

//* Add beaver-page body class
add_filter( 'body_class', 'beaver_body_class' );
function beaver_body_class( $classes ) {
    
    $classes[] = 'beaver-page';
    return $classes;
    
}

//* Force full width content
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' );
 
//* Remove breadcrumbs
remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );

//* Remove Home Featured
remove_action( 'genesis_after_header', 'generate_home_featured' );

//* Remove Site-Tagline
remove_action( 'genesis_after_header', 'minimum_site_tagline' );
 
//* Remove entry header
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_open', 5 );
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_close', 15 );
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );

//* Remove edit link
add_filter( 'genesis_edit_post_link' , '__return_false' );

//* Remove comments template
remove_action( 'genesis_after_entry', 'genesis_get_comments_template' );

//* Run the Genesis loop
genesis();

This is based on Junior Atoms code and should work on any Genesis site.

Step #2:let’s look at the CSS to see what needs to be fixed. We need a url (or make it private for BB support to help).

Magazine Pro uses different CSS than Dynamik or other Genesis themes. So the css solution will be theme specific.