Return to previous page

Change Color of Tagcloud Tags, SKU in Catalog display

This topic has 5 replies, 2 voices, and was last updated 2 years, 9 months ago ago by Olga Barlow

WF-PMG

Participant

July 5, 2021 at 12:49

Hello,
I have added the Tag Cloud widget to the singel product sidebar and the Catalogue Sidebar, and would like to change the background color in which the buttons display. How can I do this, where do I find the settings for this?

A second question, I would also like to not display the SKU in the Catalog display of products. Can this be turned off, and if so, where?

A final question: Is it possible to have a grid like masonry display of the products in the catalog, where the products line up with each other? If so, where can I find the settings for this.

We are extremely pleased with the Theme. It is wonderfully complete, with many many features, and in general very easy to work with. Congratulations on a great product!

Regards,
Waldo Fenker

#293084 Copied Theme version: .7.2.11 WooCommerce version: 5.4.1

4 Answers
Olga Barlow

Support staff

July 5, 2021 at 13:45
Hello,

Thank you for using our theme!

1) We don’t have special option for the tag cloud but you can change bg color using custom code below. Add this to Theme Options > Custom CSS
```
.tagcloud a {
    background-color: #4a587f;
    color: #fff;
}
```
2) Go to Theme Options > WooCommerce > Shop > Product styles > Product Content Elements > disable SKU

3) Do you want to shop grid on the other page or you want to enable masonry for the shop page?

Regards
#293091 Copied
WF-PMG

Participant

July 5, 2021 at 16:33

1) Thank you! How do I change the hover color as well?

2) Thank you. That works.

3) I am talking about how the products line up when one clicks on a tag or a department page and gets a long list of products.
ie: https://phoenixmusic.nl/product-categorie/kledingaccessoires/
Seems it is caused by a difference in image sizes, some are not as tall as others. Is there a setting that lines everything up, or do I have to reformat the guilty images?
Thank you for your quick reply!

#293133 Copied

WF-PMG

Participant

July 5, 2021 at 19:49

4) One last question: When the tag cloud widget displays on the shop page sidebar, it appears in a small window which is collapsed until opened. The tags can then be scrolled.
example: https://phoenixmusic.nl/product-categorie/sieraden/armbanden/
When it appears in the single product page sidebar, all the tags are shown, example:
https://phoenixmusic.nl/product/armband-met-hanger-muzieknoten/
Is there a way to have the widget display on the single product page sidebar the same way it displays in the shop page sidebar?
Thanks as ever for your great service.
WF

#293147 Copied
Olga Barlow

Support staff

July 6, 2021 at 14:20
Hello,

1) Use the below code
```
.tagcloud a:hover {
    color: #fff !important;
    border-color: #4c69b1;
    background-color: #4c69b1;
}
```
2) Add the below code to custom CSS
```
.content-product .product-content-image img {
    max-height: 200px;
}
.content-product .product-content-image {
    min-height: 200px;
}
```
And also provide us with WP Dashboard and FTP access to your site to check the issue with the masonry for that page.

4) There is no option to add close toggle but you can add scroll if you want. Use the below custom
```
.single-product-sidebar .tagcloud {
    max-height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
}
```
Regards
#293225 Copied
Viewing 5 results - 1 through 5 (of 5 total)