Category banner and Category menu alignment

Hello,

I have two issues with category page.

I added an HTML block into the description of the category to make appear a Full-width banner, I set the full size for the banner image 1920×900 and set the row full width without a gap, but when I check the category page it remains small.

Plus I added in the category page a left side bar, but the problem is that the menu side bar goes up on the Banner menu.

So what I need is to have a full-width banner and the left menu category goes aligned with the breadcrumb to better understand.

In attached you can see the problem and how I would like to be

Thanks for your help

Regards

Andrea

Attachments:

You must be logged in to view attached files.

more info

Short code : html_block id=”3515″

Hi,

We see that your image has a CSS class “alignnone” that limits it’s width with CSS rules https://gyazo.com/3a731d976f44cb930b65045731b87ec4
Try to change this image alignment or remove that CSS code.
Also, this row will overlap the sidebar because it is located in the HTML div with products and is not related to the sidebar.

Regards

Hi,

I’ve changed the alignment for the category banner and now is perfect.

How can fix the problem with the sidebar and show the category left menu aligned with the products and not over the Category banner added with the HTML block?

What do you suggest me to have a banner for each product category and on the left the category sidebar like the picture that I sent to you?

Thanks for your support

Andrea

You may need to customize HTML structure of the shop page. Try to move the code

<?php do_action( 'woocommerce_archive_description' ); ?>

before this code

<?php
		/**
		 * woocommerce_before_main_content hook
		 *
		 * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
		 * @hooked woocommerce_breadcrumb - 20 
		 */
		do_action( 'woocommerce_before_main_content' );
	?>

in the file basel/woocommerce/archieve-products.php.

Regards

Thanks, it’s working like a charm!

Last question, how I can make the product page full width like the banner because when I add the left category menù, it takes space but indented in the page and it does not remain on the extreme left of the page.

Could you please provide a screenshot to this question also?

I attached the image with before and after

Attachments:

You must be logged in to view attached files.

Our theme doesn’t have such kind of layout. You can try our content full width option in Theme Settings -> General Layout.

I tested your content full with, and it’s perfect thanks

Regards

Andrea

Great, you are welcome!

[Author]

Posts