Custom post type fullwidth layout

[Ghiotto]

Hi, I have created my custom post type template and all works fine.

So, I would like to change the page layout for this custom post type. The code inside wp-single-{my-custom-post-type}.php is this:

<?php

// =============================================================================
// VIEWS/RENEW/WP-SINGLE-PROGETTI.PHP
// -----------------------------------------------------------------------------
// Single custom post Progetti output for Renew.
// =============================================================================

$fullwidth = get_post_meta( get_the_ID(), '_x_post_layout', true );

get_header();

?>

  <div class="x-container max width offset">
    <div class="<?php x_main_content_class(); ?>" role="main">

      <?php while ( have_posts() ) : the_post(); ?>
        <?php x_get_view( 'renew', 'content', get_post_format() ); ?>
      <?php endwhile; ?>

    </div>

    <?php if ( $fullwidth != 'on' ) : ?>
      <?php get_sidebar(); ?>
    <?php endif; ?>

  </div>

<?php get_footer(); ?>

Before Footer there’s an if statement that said if fullwidth is off, then get sidebar. And at the top there a declaration of $fullwidth. So, it is a variable. How can I set fullwidth to on, excluding in this way the sidebar?

Thank you very much

[nabeel]

Hi Alessandro,

Thank you for reaching out to us. A simple way would be to set the $fullwidth variable to on in your template to bypass the sidebar check. You can use this code instead:

<?php

// =============================================================================
// VIEWS/RENEW/WP-SINGLE-PROGETTI.PHP
// -----------------------------------------------------------------------------
// Single custom post Progetti output for Renew.
// =============================================================================

$fullwidth =  'on';

get_header();

?>

  <div class="x-container max width offset">
    <div class="<?php x_main_content_class(); ?>" role="main">

      <?php while ( have_posts() ) : the_post(); ?>
        <?php x_get_view( 'renew', 'content', get_post_format() ); ?>
      <?php endwhile; ?>

    </div>

    <?php if ( $fullwidth != 'on' ) : ?>
      <?php get_sidebar(); ?>
    <?php endif; ?>

  </div>

<?php get_footer(); ?>

Hope this helps!

[Ghiotto]

Thank you for your answer. Setting $fullwidth = 'on'; simply the sidebar disappear, but the content still follow the css rule for sidebar layout.

I have discovered that the difference between a page with fullwith layout and a page with side content layout is the presence of full css class on the contaner that have also x-main class. In fact the css selector x-main.full set the full width content.

I think there’s a script that check if a page has class single or something similar to determine what class give or not to x-main container.

So, I would like to mantain this string <div class="<?php x_main_content_class(''); ?>" role="main"> and I have tried to change it in <div class="<?php x_main_content_class('full'); ?>" role="main">, but the class full is not attached. Alternatively I can remove the php code and put directly css clasees x-main full.

Let me know, thank you very much

[rad]

Hi Alessandro,

Please add this code to your child theme’s functions.php

  function x_get_content_layout() {

    $content_layout = x_get_option( 'x_layout_content' );

    if ( $content_layout != 'full-width' ) {
      if ( is_home() ) {
        $opt    = x_get_option( 'x_blog_layout' );
        $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
      } elseif ( is_singular( 'post' ) ) {
        $meta   = get_post_meta( get_the_ID(), '_x_post_layout', true );
        $layout = ( $meta == 'on' ) ? 'full-width' : $content_layout;
      } elseif ( x_is_portfolio_item() ) {
        $layout = 'full-width';
      } elseif ( x_is_portfolio() ) {
        $meta   = get_post_meta( get_the_ID(), '_x_portfolio_layout', true );
        $layout = ( $meta == 'sidebar' ) ? $content_layout : $meta;
      } elseif ( is_page_template( 'template-layout-content-sidebar.php' ) ) {
        $layout = 'content-sidebar';
      } elseif ( is_page_template( 'template-layout-sidebar-content.php' ) ) {
        $layout = 'sidebar-content';
      } elseif ( is_page_template( 'template-layout-full-width.php' ) ) {
        $layout = 'full-width';
      } elseif ( is_archive() ) {
        if ( x_is_shop() || x_is_product_category() || x_is_product_tag() ) {
          $opt    = x_get_option( 'x_woocommerce_shop_layout_content' );
          $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
        } else {
          $opt    = x_get_option( 'x_archive_layout' );
          $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
        }
      } elseif ( x_is_product() ) {
        $layout = 'full-width';
      } elseif ( x_is_bbpress() ) {
        $opt    = x_get_option( 'x_bbpress_layout_content' );
        $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
      } elseif ( x_is_buddypress() ) {
        $opt    = x_get_option( 'x_buddypress_layout_content' );
        $layout = ( $opt == 'sidebar' ) ? $content_layout : $opt;
      } elseif ( is_404() ) {
        $layout = 'full-width';
      } else {
        $layout = $content_layout;
      }
    } else {
      $layout = $content_layout;
    }
    
   if ( is_singular('progetti') ) {
        $layout = 'full-width';
   }

    return $layout;

  }

The key part that makes it possible is this at the bottom which you can change or add more.

   if ( is_singular('progetti') ) {
        $layout = 'full-width';
   }

Thanks!