Twenty Eleven (copy) – make content wider for one col layout

Hi.

This is what did. I am being detailed for people like me who are new to this whole process of modifying templates. Our normal template option is 2 column, sidebar to the right. We needed a template with no sidebar that used 100% of the page width for a few special pages.

I copied the sidebar-page.php file to fullwidth-page.php;
changed the comment at the top to
* Template Name: Fullwidth
(so that it appears in the list of available templates on the wp page we are adding);
and removed the line <?php get_sidebar(); ?>
which created a template that had no sidebar, but that also did not display full width and had the vertical bar where the sidebar would normally be.

So, the next step is to edit the style.css file.

As posted above, each template generates a template specific identifier in the body css – in my case it is called
.page-template-fullwidth-page-php since the template name is “fullwidth”. Using that, I added the following CSS to the end of the style.css file. Note that I am not a css expert by any means so the following may not be the optimal solution syntactically, but it worked!

/* Murray Hopkins: To make the content of the fullwidth template 100% and to remove the vertical bar
that normally divides the side-bar - that appears even if there is no side bar!
*/
.page-template-fullwidth-page-php.two-column.right-sidebar #main{
	width: 100%;
	background: 0 none;
} 

.page-template-fullwidth-page-php.two-column.right-sidebar #primary{
	width: 100%;
}

.page-template-fullwidth-page-php.two-column.right-sidebar #content{
/* to better line up with our particular header design. Set this to suit your situation */
	padding-left:76px;
}

.page-template-fullwidth-page-php .entry-header,
.page-template-fullwidth-page-php .entry-content,
.page-template-fullwidth-page-php .footer.entry-meta,
.page-template-fullwidth-page-php #comments-title {
    width: 100%;
}

Thanks for all the previous posts that allowed me to work this out.

Suggestions on better css syntax greatly appreciated.

Murray

I must to leave a word here. Thank you greenfuture! Perfectly work with your codes.

Thank you. I have been searching hi and lo for this!

I’ve read all this and am stuck on how to make the right column a bit wider so my fixed-whith widgets are not scaled down.

Can anybody please point me in the right direction?

Thank you!

I’m talking about that blog:
https://blog.kunstgriff.net

@igeorg

please start your own topic – your problem is different.