- This topic has 15 replies, 2 voices, and was last updated 4 years ago by David.
-
AuthorPosts
-
February 27, 2020 at 4:40 am #1178463FunkyCss
Hi guys is any way we can archive this kind of layout with any possible way ? i mean with css or php or acf ?
THis is made with gutenberg but client wants it dynamic so he can import products , ok i can create some ACF for the subcategory color or image ,
but i am curious how i can give this layout when they get displayed on the parent category .
February 27, 2020 at 5:40 am #1178524DavidStaffCustomer SupportHi there,
Woo actually provides an extension to do that:
https://docs.woocommerce.com/document/woocommerce-nested-category-layout/
February 27, 2020 at 6:46 am #1178611FunkyCssHi David yes this will be the way to go if i cant set it up myself .
I have created the archive template and i have managed to display the Products and i am really near
// Set the query $products = new WP_Query( $args ); // Standard loop if ( $products->have_posts() ) : while ( $products->have_posts() ) : $products->the_post(); // Your new HTML markup goes here ?> <div class="grid-container"> <div class="grid-50"> <h2><?php the_title(); ?></h2> </div> <div class="grid-25"> paparia </div> <div class="grid-25"> Pro </div> </div> </div>
I just want to figure out how i will display the rows with the subcategories inside The Loop , i will be back if i find a solution on this .
Thanks David π
February 27, 2020 at 7:24 am #1178774DavidStaffCustomer SupportYeah not easy – you need to first create a Loop for the categories, and within that output another loop for the products within. Woo can get real complicated as different product types can effect the way they are displayed.
Be good to see what you come up with.
February 27, 2020 at 7:31 am #1178783FunkyCssYeah i see , thanks david for your help , i appreciate ! π
February 27, 2020 at 7:32 am #1178786DavidStaffCustomer SupportYou’re welcome
February 28, 2020 at 2:26 am #1179417FunkyCssHi David so i figured out how to call with this plugin the subcategories and their images ,
There is any chance to have help with the css to create the layout like this one ?
February 28, 2020 at 8:09 am #1179815DavidStaffCustomer SupportWe can’t offer custom development in the forum unfortunately. Although most days it feels like we do π
If you have the Archive set up – more then happy to take a look and provide some pointers if possible.
February 28, 2020 at 11:48 pm #1180251FunkyCssHi David i feel sad to hear that we ask a lot in the forum !
And i was not actually right i mean i have set up the archive page and changed the private link .
I managed to create the category with the image and call the subcategories .
I just asked if there is a option to insert the images in the left of products .
I know this is a woocomerce template and i will share in the forum this layout and the code with other members how it was created .
February 29, 2020 at 6:25 am #1180444DavidStaffCustomer SupportNo problems – happy to help where we can.
The shop when displaying category thumbnails uses this function i believe:https://woocommerce.wp-a2z.org/oik_api/woocommerce_subcategory_thumbnail/
So you could use that to insert the Image as the first item in your list – before you loop through the products
February 29, 2020 at 8:49 am #1180718FunkyCssYeah this works too , i have used before this action
add_action( 'woocommerce_archive_description', 'woocommerce_category_image', 2 ); function woocommerce_category_image() { if ( is_product_category() ){ global $wp_query; $cat = $wp_query->get_queried_object(); $thumbnail_id = get_term_meta( $cat->term_id, 'thumbnail_id', true ); if ( $image ) { echo '<img src="' . $image . '" alt="' . $cat->name . '" />'; } } }
And works as well check out in my second subcategory i have used an image
March 1, 2020 at 6:29 am #1181255DavidStaffCustomer SupportAwesome – looks great.
So you just need a wrapper around the category<img>
and the subcategory-products<ul>
so you can have the img aside of the products.March 1, 2020 at 1:07 pm #1181651FunkyCssHallo David and sorry that i spam you so much lately .
I will not bother a lot I promise.
So i guess i have to do that on the plugin that creates the nested categories or is something more easy that i cant see ?
So what i understand is that i need to wrappers one for category and one for products and display them lets say as flex.
I will give a shot .
If i fix this layout i will never use again the Woo standard is so basic and not practical at all.
March 2, 2020 at 3:16 am #1182029DavidStaffCustomer SupportIt would need to be added at the Plugin creating the nested categories.
March 4, 2020 at 1:11 am #1184393FunkyCssThanks David
-
AuthorPosts
- You must be logged in to reply to this topic.