- This topic has 5 replies, 2 voices, and was last updated 1 year, 6 months ago by David.
-
AuthorPosts
-
October 6, 2022 at 5:21 am #2365090Bo
I am trying to get my sidebar widgets aligned with the start of my product grid. Trouble is that the sidebar content and the product grid content are contained in totally different divs so I am not sure what I can do.
It is on this page, I would like to have black(ish) sidebar box at the same level as the first row of product images:
https://g625i1fva4-staging.onrocket.site/product-category/toej-og-udstyr/boernetoej-og-beskyttelse/boernetoej/Any good ideas?
October 6, 2022 at 6:48 am #2365184DavidStaffCustomer SupportHi there,
how would the Title and Breadcrumb be positioned ?
October 6, 2022 at 7:19 am #2365202BoIn my, vague, vision as they are now above the product grid.
If it would make it easier/possible, perhaps they could be centered over both the sidebar and product grid…October 6, 2022 at 8:51 am #2365423DavidStaffCustomer SupportHmmm…. i don’t think my brain is working properly today as this seems a little overkill, but it is woocommerce, so:
1. Add this PHP Snippet to:
add_action('wp', function(){ if ( is_woocommerce() && !is_product() ) { remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20 ); remove_action( 'woocommerce_archive_description', 'woocommerce_taxonomy_archive_description', 10 ); remove_action( 'woocommerce_archive_description', 'woocommerce_product_archive_description', 10 ); add_action( 'generate_inside_container', function(){ echo '<div class="grid-container woo_archive_header">'; },4 ); add_action( 'generate_inside_container', function(){ echo '</div>'; },10 ); add_action( 'generate_inside_container', 'woocommerce_breadcrumb', 5 ); add_action( 'generate_inside_container', 'woocommerce_taxonomy_archive_description', 5 ); add_action( 'generate_inside_container', 'woocommerce_product_archive_description', 5 ); } });
This will unhook and rehook the breadcrumb and archive description above the content.
Then some CSS to make sure it occupies its own row:
.woo_archive_header { width: 100%; } .woocommerce.archive .site-content { flex-wrap: wrap; }
October 8, 2022 at 10:16 am #2367279BoThank you for the suggestion. It got me thinking, and I manage to sneak in a fake side-bar div in the woocommerce_before_shop_loop hook. Then I could arrange it along with the products and ordering via css and accomplish what I was after ๐
October 9, 2022 at 4:16 am #2367587DavidStaffCustomer SupportAwesome – glad to hear you got a working solution ๐
-
AuthorPosts
- You must be logged in to reply to this topic.