How to create a Woo shop page, with a sidebar, displaying my categories

[CyberBengt]

Hi

I have created a WooCommerce archive page with a sidebar to the left and the selected categories displayed, with image and name (all clickable), to the right. The sidebar is a widget area and contains a search function (YITH WooCommerce Ajax Product Search) and a hierarchical navigation for my categories and sub-categories ( YITH WooCommerce Category Accordion). This works perfect.

Now I want the startpage in my shop with the same layout, except for one thing: the space to the right should be populated with the main categories from start.
I copied the archive page for categories and assigned it as the shop page. But I can’t figure out how to set the right parameters.
The condition for the column is set to “Product taxonomi is Category”. The looper consumer is “All”. The Div with the backgound image has: {{dc:post:featured_image_id}}. The category name is: {{dc:woocommerce:product_title}}. But the whole area turns up empty.

Best regards
Bengt

[prakash_s]

Hello Bengt,

Thanks for writing to us.

You can add the Widget area element to another column in the layout builder and then you can select the widget area from there. After selecting the widget area you can set the widgets for the sidebar.
Please have a look at the given screenshot. Please select the column structure as per your design.

Now select the sidebar from here.

Add Widgets in the widget area.

Hope it helps
Thanks

[CyberBengt]

Thanks for quick reply about adding a widget. But this was not my issue. My problem is to populate the main space (not the sidebar with the widget.

I have 4 main categories. If I don’t assign a special archive layout, the standard shop page is populated with these 4 categories in an ugly design. I want to design this startpage for the shop with a sidebar containing my widgets and the main space containing the 4 categories (with adjusted design.

Best Regards
Bengt

[prakash_s]

Hello Bengt,

I would suggest you please create two WooCommerce Archive layouts. You need to create one layout for the Shop and another one for the Product category. Now you need to assign the layout to the Shop and product category pages like this. Please have a look at the screenshot below.

Hope it helps
Thanks

[CyberBengt]

Thanks
I have already tried this. For the category page it works perfect, but for the shop page I have problems displaying the 4 main categories. The shop page shows up with the sidebar, but there is no content in the area where it’s supposed to be the 4 categories. How do I assign this area? With a looper consumer or … ? I want to be able to design the appearance of the 4 main categories.

[ruenel]

Hey @CyberBengt,

We would like to check your site settings if we can log in to your site. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Thanks.

[CyberBengt]

Secure note is sent

[Ismael]

Thank you for the info.

We tried to log in, but 2FA is enabled. Please provide the backup codes or disable 2FA temporarily.

Warm regards.

[CyberBengt]

Codes are sent as secure note

[Ismael]

Sorry for the confusion. I thought the backup codes would allow us to log in. Unfortunately, we don’t have access to the email support@theme.co , where 2FA is sending the login authentication code. Please disable 2FA temporarily.

[CyberBengt]

OK, now the 2FA is disabled

[Ismael]

Thank you for the update.

We adjusted the Looper Provider on the Webbutik page to display the product categories. We also modified the dynamic content templates to fetch the thumbnail_id and URL of the terms.

Please make sure to purge the cache before checking the page.

Best regards.

[CyberBengt]

Hi

I noticed your changes: the looper provider in the row, the looper consumer set to All in the column 1 (in the row) and the dynamic content in the div’s below.

But something is not right. In Cornerstone I see two columns, with different content, both with the same name “column 1” inside the row. Has there been some kind of mix-up here?

And the display of my four main categories is not correct either. I want only these four categories to be visible, no others:

• 1-fas transformatorer
• Mättransformatorer
• Tillbehör & Reservdelar
• Övervakning & Kontroll

I want to reach the other subcategories through the widget in the sidebar, just as it works today. So I want my start page for my shop to contain the same as the default page for the store in WooCommerce (4 main categories), but with my design (with sidebar). Quite similar to what is on the old (current) website: https://unitrafo.se/butik/

Best regards
Bengt

[ruenel]

Hello @CyberBengt,

You can change the Looper Provider from Current Terms to All Terms.

If you only want to display the parent categories, you might want to check out this old thread:

• Display parent category with Loopers

Or you might be interested on these threads as well:

• Display product categories (WooCommerce) in a structured way (Parent / Child)
• Display Parent and Sub Categories on Single CPT View
• Support for WooCommerce archive pages with sidebar in Cornerstone

Best Regards.

[CyberBengt]

Hi,

I might have messed things up a bit. Could You please take a look and help me correct my settings, so I only see the 4 parent categories. I just want the page to look lige the old one: https://unitrafo.se/butik/

Best regards
Bengt

[Ismael]

Thank you for the update.

Did you edit the functions.php file? We can’t login to the site because there’s an error generated in the file.

Parse error : Unclosed ‘{’ on line 31 in /home/xxxxx/test.xxxx.se/wp-content/themes/pro-child/functions.php on line 45

Please revert the site from a backup or post the FTP details in a secure note so we can correct the functions.php file.

Best regards.

[CyberBengt]

Sorry for that. Now the functions.php is updated.

Best Regards
Bengt

[Ismael]

Thank you for the update.

We adjusted the dynamic content in the elements, specifically the term thumbnail_id and term name.

Unfortunately, there is no option to select specific categories when using Looper Provider > All Terms. You may need to create a custom Looper Provider for this.

[CyberBengt]

That’s a pity. I really like the possibilities in Pro, but it would be smooth to be able to filter out the top-level categories i the main shop page. I think many users would appreciate this function.

To achieve what I want, does it only require a change to the Looper Provider? Not the consumers or the dynamic content?
Is there a good instruction online for how to create a custom Looper Provider?

Best Regards

[Ismael]

Yes, you only need to change the Looper Provider – the dynamic templates are already setup to consume category or term data.

We may alter the All Terms looper provider to allow users to select specific terms. Unfortunately, this has not been confirmed yet and is not available at the moment. If you want to learn more about custom loopers, please check this link: https://theme.co/docs/loopers#custom

Thank you for your patience.