Fullwidth images when Sidebar

[joserodrigz]

Hi there,
How can I put the top images (header) in the background when sidebars ?

Thanks in advance !

[thai]

Hi There,

Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Then navigate to your child theme’s /framework/views/ethos/ directory create a file named wp-single.php and paste the code below:

<?php

// =============================================================================
// VIEWS/ETHOS/WP-SINGLE.PHP
// -----------------------------------------------------------------------------
// Single post output for Ethos.
// =============================================================================

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

get_header();

?>

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

        <?php while ( have_posts() ) : the_post(); ?>
          <?php x_get_view( 'ethos', 'content', get_post_format() ); ?>
          <?php x_get_view( 'global', '_comments-template' ); ?>
        <?php endwhile; ?>

      </div>

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

    </div>
  </div>

<?php get_footer(); ?>

After that adding this custom CSS under Theme Options > CSS:

.single-post .entry-thumb {
    width: 100%;
    margin-bottom: 25px;
}
.single-post .x-main .entry-featured {
    display: none;
}

Hope it helps

[joserodrigz]

Thanks !
Can you please send to me the option when no child theme ?
I Donn’t want to use child themes.

Thanks in advance !

[christian]

Hey @joserodrigz,

It’s possible with a bit of Javascript restructuring but, you do not have a featured image in your page. @thai’s code will move the Featured Image above the main content area. Please upload a featured image in your page first and we could show you another method.

Please note though that what we’re doing here is custom development. This is outside the scope of our support. We want to point you to the right direction but not to the point that we will continue providing you support for this case. By using the suggestion, you understand that issues arising from the use of the suggestion and further enhancements should be directed to a third party developer.

Thanks.

[joserodrigz]

Ok ok sorry…

[paul.r]

No worries. Have a nice day!