How to set up Genesis Magazine Pro for Beaver Builder full width rows

Beaver Builder
1

Below is CSS and beaver-builder.php page template to set up Genesis Magazine Pro to enable the use of full width rows in the Beaver Builder plugin. Note: CSS is for creating page template with Genesis Extender.

Please keep in mind this is a bit of a hack of Junior Atoms’ code for Genesis Generate Pro. So back up your site first, even better - try it out on a test site. Source

Page Template: beaver-builder.php

<?php

//* 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 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();

CSS (add to end of childtheme style.css) - does not include media queries


/* Beaver Builder Junior Atoms
--------------------------------------------- */
/* Beaver Builder */

.page-template-my-templatesbeaver-builder-php.fl-builder.full-width-content.beaver-page .entry {
	background-color: none;
	box-shadow: none;
	padding: 0;
}

.page-template-my-templatesbeaver-builder-php.fl-builder.full-width-content.beaver-page .entry {
	margin-bottom: 0;
}

.page-template-my-templatesbeaver-builder-php.fl-builder.full-width-content.beaver-page .site-inner {
	clear: both;
	padding-top: 0;
}

.page-template-my-templatesbeaver-builder-php.fl-builder.full-width-content.beaver-page .site-inner .wrap {
	margin: 0 auto;
	max-width: none;
}

.site-header .wrap {
    max-width: 1100px;
}

.site-header .widget-area {
    float: right;
    text-align: right;
    width: 720px;
}

.nav-secondary .wrap,
  .nav-primary .wrap {
    max-width: 1100px;
}
2

Hey Kelly,

That’s awesome! Thank you for sharing.

Would you mind if I posted this on my blog? I would give you full credit of course:)

Thanks,

Colin

3

That would be great!

Cheers,
Kelly

4

Awesome!! Thanks Kelly! :slight_smile:

5

What about Prose theme ? I ve been searching, trying, experimenting with anything that could help since one full week, nights and days. NOTHING working. May I expect some help ? That’s such a disappointment to have bought something that does not work. Or does not seem to work. Same result.

What the heck am I doing wrong ???

6

Hi Jeanne:
I have not used Prose theme. But have you tried this free plugin, https://wordpress.org/plugins/genesis-dambuster/

7

Thanks for replying. I have finally found what this was about. The solution for me was here.

And then, indeed, with Dambuster, it began to work ! * Miracle *

Hope this would help anyone who has issues with the Prose theme.