see products of each category on one page

Hi @chupachota ??

You can achieve this by using shortcodes. To use shortcodes, you simply paste the code into your page backend and it will render automatically

[products columns="4" category="sweets"]

If you would like to learn more about shortcodes, please feel free to visit the following article from our documentation. Here is the link:

https://docs.woocommerce.com/document/woocommerce-shortcodes/

Cheers.

ok, it works, but it shows them in a different font format than the rest of the page. It can be fixed?
regards!

Great! Please share a link to your site to see what might be happening.

Thank you!

the link to my site is this: https://www.zyontrain.com/ and the page with the category “sweets” is this: https://www.zyontrain.com/dulces/ and how you can see the font It is different than on the shop page: https://www.zyontrain.com/shop/

Any ideas? Any help would be appreciated

Hi @chupachota ??

Apologies for the delay!

I’ve checked both of the links that you have shared with us and I can see that they are using the same song (Montserrat). Oftentimes something like this can be affected by your browser’s cache. I would suggest that you try clearing the cache/cookies and then try it again. You could also try from a different browser or device.

Here is a support page that can walk you through that: https://en.support.wordpress.com/browser-issues/#clearing-your-browser-cache

Cheers ??

I have tried to clear the browser cache, and also open the page from a different browser but it remains the same. The font of this page: https://www.zyontrain.com/dulces/ is not the same as that of the store: https://www.zyontrain.com/shop/

Thank you for the additional screenshots!

It seems that a theme or plugin is overriding the style (CSS) of that specific category. You perform a full conflict check in order to see what could be causing this. You can find a more detailed explanation on how to do a conflict test here.

However, I’ve generated a custom CSS code to fix this. Under Customize > Additional CSS, you can add the following code:
?

/* Set font-family to Montserrat on 4 column grid product category pages */
.woocommerce .columns-4 .product-content {
    font-family: Montserrat, sans-serif !important;
}?

If you’d like to learn more about CSS, I highly recommend using the free tutorials at w3schools. Here, you can find the basics of selectors (how to target the right element on the page), and properties (how to change the element on the page).

Cheers!

ok, it works for this theme (yith-proteo), but if I change the theme I have the same problem again. Is there a way to fix it to work with all themes?
thanks!

The custom CSS that is added stays with the current theme. If you change the theme, you need to add it again for your new theme. You just need to add the CSS again.

Hope that helps.

but if I change to the “neve” theme, and add the css you indicated, it looks like this: https://www.zyontrain.com/dulces/
https://www.zyontrain.com/shop/ and as before, the two pages do not appear with the same font.

Hey @chupachota,

Themes can override the fonts and some have settings that allow you to easily specify which font to use. For the “Neve” theme, you can contact the theme developer for assistance with this on their support forum, as this forum is just for the WooCommerce plugin.

ok, thanks for your help!

You’re welcome @chupachota. If you have any other questions, feel free to open a new topic!