Format of widget : AJAX Product Tabs

Hello,

I am using the AJAX Product Tabs widget and I would need help to customize the result a bit more than what the control panel allows:

1/ I would like to customize the color of tab titles. For now I can only choose the color of the line below and not the color of the font (see screenshot). Could you please help me to have the titles black when normal (instead of grey), and yellow when hovered or active (instead of black)?

2/ On the product thumbnails below the tabs, the format of the price is different than in the rest of the shop. Here it appears as “€30,00” and in the rest of the shop it is “30€”. Is it possible to adapt the format of the price please (remove decimal digits + have € on the right side of the number)?

Thank you!

Attachments:

You must be logged in to view attached files.

Hello,

1) Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

li.wd-active .wd-nav-link .nav-link-text {
color: yellow;
}

.wd-nav-tabs .wd-nav-link .nav-link-text:hover {
color: yellow;
}

2) Please deactivate all the third party plugins, activate the parent theme then check back. If the problem still continues then leave all the third party plugins deactivated and provide the admin panel login details of the website.

Best Regards

Hello Aizaz,

1/ Thank you the code works for the hovering part. Regarding my request to have the text in black when normal (not hovered and not active), would you have custom CSS as well please?

2/ I followed your instructions but no change unfortunately. I deactivated all the plugins except those related to woocommerce, elementor and woodmart core. Could you please check? You will find the admin logins below.

Thank you

Hello,

Please provide the URL of the page where you added the AJAX Product Tabs to check it myself and help you out accordingly.

Best Regards

Hello Aizaz,
You will find it below.
Thanks!

Hello,

It seems to be caused by the WooCommerce payments official plugin but to see its settings you need to configure it first. As for now, we can’t check anything to make it work since it is not configured yet.

Kind Regards

Hello Artem,

I have finally configured my payments and I no longer have WooCommerce payments official plugin installed. Now my question 2/ is resolved: prices are shown correctly.

Regarding my question 1/, I would still like to set the titles of tabs in black when normal (not hovered and not active). We already changed it for hovered or active but not inactive. Would you have custom CSS for this please?

You’ll find admin access below in case you need it (my website is still in maintenance mode).

Many thanks

Hello,

Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

span.tab-label.nav-link-text {
color: black;
}

Best Regards

Hello Aizaz,

This works great now, thank you very much!

Juliette

Hello,

We are Glad that your issue has been Resolved.

Let us know if there’s anything else we can do for you! You can always reach us at any time. We are always here to help you.

Have a wonderful day.

Topic Closed.
Best Regards.

[Author]

Posts