Center Content On Posts Page With Sidebar

hi

My posts pages use a left sidebar, but what happens is the content along with the sidebar are aligned center. Naturally, this throws out the alignment of the footer.

How is it possible to align just the posts center with the sidebar then to the left of the content?

I assume it will be a tweak in the _content-post-header.php file, just wasn’t sure what tweak would do it.

I am using the Ethos stack

cheers

Hello @guybower1,

Can you please provide the URL of the page in question so that we can check and give some suggestions?

Thank you.

hi Jade

Thanks for getting back to me

Apologies for not supplying that earlier. I just assumed it would be a stock answer of change x php file with this code.

I have put the details in a secure not above. The page is the post Blog Template

cheers

Hi @guybower1,

Sorry, but I am not entirely certain of what you’re trying to do.

Do you want the footer to be aligned with the Content? If so, please add another container on your footer bar, and have that container same width as the sidebar.

If that’s not what you need, please clarify.

Cheers!

hi Friech

Thanks so much for your reply.

My apologies, I thought it was pretty clear in the original post. The post content and the sidebar are currently used together for alignment, that is obviously the default, therefore the footer at the bottom looks odd, as it has a centre aligned opt in form.

I wish to align the content of any posts page only to the centre of the page. The sidebar will sit to the left and not be anything to do with the alignment, but I want the content of the posts to be centre aligned.

Here is a screen shot of the bottom section of the posts page and the footer. The footer is correctly centre aligned; the posts page is not, due to the fact that the sidebar further up the page is also being used in the calculation of the centre alignment. I want that sidebar excluded from the alignment. It can simply sit alongside the content, but I want the content to align to the centre of the page

Does that help?

cheers

Hello @guybower1,

Thank you for the clarifications. What you have in mind requires a complete overhaul of the blog post layout. Please see this illustration first:

The page is consists of three parts, namely the header, the content, and the footer. The content section is divided into two columns. The left side for the sidebar which is 20% and the post content column on the right which is around 80% width. If you change the width of the post content to 100%, there will be no longer enough space to display the sidebar. It cannot be moved to the left side as well because it can create further layout complications.

What you will need is a custom blog post template (much like the page templates) that has a different structure than what we currently have. Regretfully this requires custom development which is outside the scope of our support already. I would recommend that you check out this previous thread regarding how you can create your own custom blog post template:

We can only give you guidance in starting your modifications because this is out of the scope of our support already. Please understand that our support only covers getting your site setup, bug fixes, and minor cosmetic changes.

If you are not comfortable doing all this modification, you might be interested in checking out our new service which is called “One”. We have a dedicated developer that will answer your questions and help you with any of your customization needs.

Thank you for your understanding.

hi Ruenel

Thanks so much for your reply

I had no idea it would be that much work. What you show on your diagram looks great when the content in the sidebar extends down towards the footer, but when it ends maybe halfway down the page, then you are left with the content and footer very obviously out of alignment.

I honestly thought it would be just a matter of using an offset in either wp-single.php or functions.php to push the entire content section to the left by a %. Once on a screen below the width of the content section, the sidebar can be removed and the content centred.

Odd that it seems a full rewrite of a php. I will check out the link you supplied, but it really seems like it should be simpler than this.

Regards

Hi @guybower1,

I can confirm the structure shown by @ruenel. That is how it is made and restructuring the content part is needed to achieve what you want.

You might want to review this display property.

hi Lely

I think I may have come up with a completely different method of doing exactly what I want using the dynamic builder and global blocks after watching a Pro user named Benedict Ursal build a dynamic template to control post title, featured image and post content

So the basic concept is to create a blank single.php file in the child theme folder and add the following

<?php get_header(); ?>
<?php echo do_shortcode(''); ?>
<?php get_footer(); ?>

The shortcode for the global block goes in the second line. It is this global block which will create the posts look

The functions.php file has this added to allow pulling in the posts content

function dc_post_content( $atts ){
	global $post;
	return do_shortcode( $post->post_content ); ?>
}
add_shortcode( 'dc_post_content', 'dc_post_content' );

My plan is to create a template with 2 columns, one will be 75% and the other 25% (those % can change depending on the look). The post title, featured image and post content can be in the 75% column with the 25% column to be used to look like a sidebar. The content layout in layout and design will be full width thus removing the real sidebar. The beauty of doing it this way is I can use padding or margins to move the content to the left so the main post content aligns correctly with the footer. There will be the appearance of a sidebar without there really being a sidebar

Post title is added using this {{dc:post:title}} Post featured image is added using this {{dc:post:featured_image}} and to add post content [dc_post_content] is added. It is not a native Pro or X code, but probably should be in the dynamic content area in the future, I think.

Now I can have absolute control over where I place the featured image, where the title and more importantly, I can adjust the post content the way I want it to be, regardless of stack

Having seen the video, does this seem like a feasible way to approach such a problem?

Thanks again

Hi @guybower1,

It’s always feasible regardless of content implementation since what you wish to achieve is layout control, but would still require customization. The video only shows on how to implement content on your preferred template, but not how to create layout within that template.

And my personal assumption is, it would be complex especially you’re trying to create a sidebar unaffected by another layout alignment. Alignment works on the total dimension it’s being aligned, hence, the content and sidebar dimension version footer dimension, then, it will always appear as your first screenshot.

The other solution is moving your sidebar outside the restricting layout and make it float (like fixed positioning), but again, that requires custom development that we can’t provide here in the forum.

Thanks!

hi Rad

Thanks so much for your reply

That route would have actually been quite simple to achieve, I think, as the layout is done in a normal page then saved as a template and placed in the global block along with the dynamic content parts listed above.

In the end what I did was make the sidebar sticky, so it now remains in place when scrolling, giving the impression of everything being centred.

I do believe that dc_post_content should be added to the dynamic content area, though. Posts pages have limited scope for exciting layout in both Pro & X, so being able to use the dynamic content was a great thing to find. Just such a shame it excludes the post content. I assume when the Layout Builder is released that will be addressed

cheers

Hey @guybower1,

The Dynamic Content does not take into account the custom creation of single post templates that is why the post content is not available as a Dynamic Content option.

The Layout Builder will allow the creation of custom single and archive templates so I believe it would surely include the content part. I’m just not sure it will be added as part of the Dynamic Content or a separate method.

Please stay tuned for product updates.

Thanks.

Will do mate and thanks for the reply

cheers

You’re most welcome!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.