Adjusting sidebar layouts

Below I will show you the code for the various sidebars. How to force a layout. Then how to add a new sidebar layout.

The layout acronyms:
c = full width content.
c_sp = content left with right primary sidebar.
sp_c = content right with left primary sidebar.
c_sp_ss = content with right primary and right secondary sidebars.
sp_ss_c = content with left primary and left secondary sidebars.
sp_c_ss = content with left primary sidebar and right secondary sidebar.

Force layout

An example. In the functions.php add the following code.

// Force full width content layout.
add_filter( 'beans_layout', 'example_force_layout' );
function example_force_layout() {
return 'c';
}

It will then force all the pages to use full width content layout.

 

Force layout depending on condition.
The following uses a condition. If front page then full width, if page is contact then right sidebar, or else use left sidebar.

add_filter( 'beans_layout', 'example_force_layout' );
  function example_force_layout() {
     if ( is_front_page() ) {
        return 'c'; // Full width content
     }
     if ( is_page(contact) ) {
        return 'c_sp'; // Content left - sidebar right
     }
    else {
        return 'sp_c'; // Sidebar left - content right
    }
}

Adding a new sidebar layout

The following is from the child themes Bench and Banks.
github.com/ThemeButler/tbr-banks/blob/master/functions.php
Download the new sidebar layout icon: github.com/ThemeButler/tbr-banks/blob/master/assets/images/c.png add to an assets/images folder in the root of your child theme.

Add the following to your functions.php file:

// Add admin layout option. Will be seen in the customizer and in page/post option below the content area.
beans_add_smart_action( 'beans_layouts', 'banks_layouts' );
   function banks_layouts( $layouts ) {
    $layouts['banks_c'] = get_stylesheet_directory_uri() .  '/assets/images/c.png';
    return $layouts;
}

// To setup the document so that changes in the customizer are seen before saving then one needs to setup the add action with wp.
add_action( 'wp', 'banks_setup_document' );

function banks_setup_document() {
// Add grid min width for Banks slim content
    if ( beans_get_layout() == 'banks_c' )
    beans_add_attribute( 'beans_content', 'class', 'tm-centered-content' );
}

In the style.css or style.less file add:

.tm-centered-content {
   max-width: 1200px;
   margin-right: auto;
   margin-left: auto;
}

 

Beans-new-sidebar-layout

Remove the option to change the sidebar layout.

Remove the option to adjust the sidebar layout by removing the option inside the post and page and the customizer.

// Remove layout options from pages and posts.
beans_remove_action(  'beans_do_register_post_meta' ); // will remove the options from pages
beans_remove_action(  'beans_do_register_term_meta' ); // will remove the options from posts

// Remove layout options from the customizer.
function default_layout_remove() { 
global $wp_customize;
$wp_customize->remove_section( 'beans_layout' ); // Section name of the default layout.
}
add_action( 'customize_register', 'default_layout_remove', 11 );

 

Code I need to test:
Removes layouts.
https://community.getbeans.io/discussion/creating-and-using-page-templates/#post-1530

add_filter( 'beans_layouts', 'example_modify_layouts' );

function example_modify_layouts( $layouts ) {
unset( $layouts['c_sp_ss'], $layouts['sp_c_ss'] );

return $layouts;
}

 

Resources:
getbeans.io/code-snippets/force-a-layout
codex.wordpress.org/Conditional_Tags
isitwp.com/ultimate-guide-wordpress-conditional-tags/
developer.wordpress.org/themes/basics/conditional-tags/
developer.wordpress.org/themes/basics/template-hierarchy/

community.getbeans.io/discussion/force-layout-with-custom-sidebar/
community.getbeans.io/discussion/left-sidebar-layout-with-different-width/

community.getbeans.io/discussion/hide-post-options-in-dashboard/
kb.wpbeaverbuilder.com/article/357-remove-a-customizer-panel wordpress.stackexchange.com/questions/58932/how-do-i-remove-a-pre-existing-customizer-setting
css-tricks.com

No comment yet, add your voice below!


Add a Comment

Your email address will not be published. Required fields are marked *

Comment *
Name *
Email *
Website