Display Woocommerce Category Thumbnail Archive Page

I’m trying to dynamically display the category thumbnail on a product archive layout.

Here is an example the page: https://brewsky.nueramarketing.com/product-category/beer/

There is an image ahead of the headline which has a placeholder in it. Is this something that can be displayed using Custom Attributes?

Thank you in advance!

Hi Nuera,

Thanks for reaching out.
It seems that you are trying to get the Image from the Custom Attribute which has a different structure than the regular terms. Regretfully, that is not currently supported in Dynamic Content tags to show.
But if you are using the Default image option of the Product categories you can get it using the Dynamic Content tag. I would suggest you go through the following thread, which may help you on this.

Hope it helps.
Thanks

Hey Tristup,

I’m sorry, but I couldn’t follow those instructions. You are correct that I’m trying to pull in the default thumbnail from the product category, but those instructions don’t really explain how to display it.

I’d like to display the icon in two places in the layout:

  1. As the Graphic Icon in the Headline
  2. In the background of the Header section

I can see places to add this content, but I don’t know the Name or Value to apply to pull that content in. Is it more complex than simply adding something like {{dc:woocommerce:thumbnail_id}}?

Thanks for your assistance!

Hi Nuera,

To display the default thumbnail from the product category use Term Meta with key thumbnail_id. The full dynamic content value is {{dc:term:meta key=“thumbnail_id”}}

Hope that helps.

Thank you.

That’s perfect, thank you so much!

Last question for now- Can you tell me what the key is for displaying the Archive Title instead of the page title?

Hi Neura,

The right dynamic code to call the custom archive title is {{dc:archive:title}} but currently that shortcode is a bug. I will report this to our developer for further invesigation.

If you want a workaround, we will be using ACF. Please follow the steps below.

  • Create a custom field and assigned it to your product category taxonomy.
  • In your product category page, the field will show and you can fill the field.
  • To call the field you need a dynamic code something like this one {{dc:archive:meta key=“test-name”}}
  • If you are asking where I get the test-name key, please refer it to the number one screenshot.

Hope that helps.

Thank you.

OK WE’RE SO CLOSE!

I followed all the instructions and got everything set as directed, but it’s not displaying on the front end now. Is my dynamic code incorrect?

Hi Nuera,

The reason why it is not showing properly is because the open and close clause is wrong.

It should be {{dc:archive:meta key=“display_title”}}. I went ahead and change it for you.

Hope that helps.

Thank you.

Hey Marc,

I think I was editing when you went in and changed it and so I likely just saved over your work. That said, I did add the clause in the way you featured it here and it’s still not displaying.

Sorry, thank you, and please advise… haha

Hi Neura,

I change it again and it is now working properly. I am also very sorry, it was my mistake because I make the dynamic content code Bold Text and it leads the clause into the wrong one. But for the future preferences here’s the correct way to add it here {{dc:archive:meta key="display_title"}}.

Hope that helps.

Thank you.

You’re fantastic - thank you so much, all!

HI Neura,

You’re welcome! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

Related follow-on question. Is there a way to make sure a layout is applied to subcategories?

For example:
https://brewsky.nueramarketing.com/product-category/wine/red-wine/

Hi Neura,

I don’t see an option that applies dynamically to all product subcategories. I suggest that you added it manually to your subcategories using the OR option and apply the same process to your other subcategories. See the example screenshot below.

image

Hope that helps.

Thank you.

Ok, I’ll give that a shot.

Hopefully last question- Is there any cornerstone element that can display a dynamic list/menu of subcategories? I’d like to create a nicer-looking page filter for the shop pages.

Hello @Nuera,

You can use the “Terms” dynamic element to display the categories.

Hope this helps.

Hey Ruenel!

I’ve never used this element before so forgive my ignorance on how it functions. I have successfully found a way to display the categories, but I’m trying to display only the live Subcategories for a given Product Category within a dynamic layout.

I assume this is done through some kind of exception, as Marc_A suggested above, but I’m not seeing a method of displaying that.

Thanks!

Hi @Nuera,

It seems you are trying to show the Subcategories of current categories. If that is the case, you need to use the custom hook within your existing Looper Provider and pass the {{dc:term:id}} as a parameter to the custom hook function as explained in the following thread.
And you may need to change the function a little to get the JSON parameter that sends to the custom Hook function, please find that change in the below code.

$term_id = cs_dynamic_content( $args['parent_cat'] );

Reference Thread:

  1. WC sub-categories in "Terms (cloud)"
  2. Reading elements of a looper
  3. https://theme.co/forum/t/bug-pro-4-3-3-cant-pass-json-to-custom-loopers/89573/4

Hope it helps.
Thanks

HAHA Ok, so this graphic designer is hanging on as best he can here… Thank you so much!

Here is what I’ve got so far, but it’s not returning anything on the front end just yet.

You can see an example of the live page at: https://brewsky.nueramarketing.com/product-category/beer/

I’ll admit that I didn’t understand much from your last bit of instruction though, so forgive me if I’m omitting any critical details. Very much appreciated!

Hi @Nuera,

You need to add the JSON as shown in the screenshot given in my post.

{
    "parent_post":"{{dc:term:id}}"
}

The code you have added into the JSON that should be used in the PHP code to fetch the parameter, and the code will look like that.

add_filter('cs_looper_custom_subcat', function($result, $args) 
{    
    $term_id = cs_dynamic_content( $args['parent_cat'] );      
    $cat_args = array(
        'hide_empty' => 1,
        'child_of'=> $term_id,
        'taxonomy' => 'product_cat',
        
    );    
    $subcats = get_categories($cat_args);
    return $subcats;
}, 10, 2);

Hope it helps.
Thanks