Docs

[bigboxhead]

Hi,

I would like to change my homepage which is the shop page on my website to fullwidth but I want to leave all the other pages as they are at the moment. What would be the best way to achieve this?

[Paul R]

Hi,

Thanks for writing in!

You can add this in your child theme’s functions.php file located in wp-content/themes/x-child/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 ( x_is_shop()){         
         $layout = 'full-width';  
     }

    return $layout;

  }

Hope that helps.

[bigboxhead]

Hi,

Thanks for that, is there somewhere that I can go to for finding out how to do this?

[Rahul]

Hey There,

Regretfully, at this time I am not entirely certain what it is you’re trying to do.
If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do. We’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks for understanding!

[bigboxhead]

Hi,

At the moment I am happy with how all other pages on my site http://www.strawberryandblue.com are played out. The only page that I would like to change is the homepage (shop), this page I would like to display as fullwidth. What would be the easiest way for me to change only this page to fullwidth, leaving all other pages as they are now.

I asked if there was a link or where I could find information on inserting the code your colleague gave as I am not competent to insert this without some further instructions and I would hate to mess my site up by doing some stupid mistake.

Thanks
Kerry

[Thai]

Hi Kerry,

Please add the following CSS under Customizer > Custom > Global CSS:

.home .x-main.left {
    width: 100%;
}

.home .x-sidebar.right {
    display: none;
}

Hope it helps 🙂

[bigboxhead]

Thanks, the second option worked perfect

[Thai]

Glad it worked 🙂

If you need anything else please let us know.

[Author]

Posts