Full width posts?

Is there a way to make posts full width and get rid of the sidebar? If not, can I reduce the sidebar width and increase post width?

Ok, managed to find a way to reduce the sidebar width, thus increasing the post width with hints from here(https://athemes.com/forums/topic/two-lay-out-questions/) but the problem with that hint was that images still remained the same width as previously, so i’d change the second question to how to make the images same width a text if full width posts are not possible?

On page attributes change Template to Full Width, it removes the sidebar.

I do only see the page attributes-option for pages, not posts. I am a newbie on wordpress though so am I missing something here? I was able to create a full width page, but would also like to have all my posts full width.

As default, the sidebar are displayed on post. You have to create a child theme if you want to remove the sidebar.

Let me know if you still want to remove the sidebar to make the post full width.

Hi Awan,

Ok, thanks. I think creating a child theme is not a problem and I still would like to get rid of the sidebar to get the posts full width!

Ok, and here you go:

  1. create a child theme
  2. duplicate single.php, archive.php and sidebar.php from parent theme to child theme
  3. single.php, change this line:
    <div id="primary" class="content-area"> to
<div id="primary" class="content-area" 
style="<?php echo ( ! is_active_sidebar( 'sidebar-1' ) )? 'width:auto;' : ''; ?>">
  1. archive.php, change this line:
    <section id="primary" class="content-area"> to
<section id="primary" class="content-area" 
style="<?php echo ( ! is_active_sidebar( 'sidebar-1' ) )? 'width:auto;' : ''; ?>">
  1. sidebar.php, remove all code within this file then add this code:
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
<div id="secondary" class="widget-area" role="complementary">
	<?php dynamic_sidebar( 'sidebar-1' ); ?>
</div><!-- #secondary -->
<?php endif; // end sidebar widget area ?>
  1. add this code to your style.css
.single-thumb img {
    width: 100%;
}

Awesome, thank you!