Woocommerce products style is wrong and the local currency is not detected

Support
#1

Hi. See the following image:

image
image1578×960 317 KB

The style for the shorcode `[product_category category=“2”] seems wrong: the Buy button is mixed with the image.

On the other hand, the currency should be USD ($) because I’ve set the proxy in United States. However, the price is shown in British Pounds instead.

Checkout does show the currency correctly (direct link to check yourself here: https://www.edinventa.com/segunda-mano/?add-to-cart=7956 ). Screenshot:

image
image2534×978 297 KB

So any idea to fix those 2 issues? :slight_smile:

Thanks!!

Carlos

#2

Hi Carlos,

Thanks for reaching out.

The screenshot does not help much and the page you mentioned is not available on the website menu. It seems some custom CSS code might be the reason behind this issue.
I would like to suggest you troubleshoot the common issues related to the

  1. Child Theme.
  2. CSS/JS customization
  3. Disabling Cache

Regarding the proxy settings, regretfully it does not comes within the theme support. I would like to suggest you hire a developer for further help.

Thanks

#3

Yes: I’ve hidden it as it’s not shown correctly. You can see it by visiting this link: https://www.edinventa.com/segunda-mano/

I’ve also recorded a 1 minute video where you can see that I have enabled the parent theme and deleted the custom css code (and clear cache): https://d.pr/v/cRHMKM

But it’s still wrong. May you take a look?

PS: this issue exists from the beginning. However, at that time the way I “fixed” it was not using a woocommerce shortcode but just creating a normal page with a link to add to cart.

This time, I’d like to fix it in a proper way!!

On the other hand, my other question is NOT related to any proxy!!! I just showed you how I tested it (because I’m not in USA now).

Woocommerce can show the currency depending on the country the user is. If the user is in USA, Woocommerce detects it and USD is shown. If the user is in UK, British Pounds. In any other case, it’s shown in EUR.

Is the issue clear now?

Thanksss

Carlos

#4

Hi Carlos,

You can add the colors into the Buy button from Theme Options > Buttons, especially by adding a semi-transparent background color will make the button visible on any surface.

Theme-Options-Pro (15)
Theme-Options-Pro (15)340×862 12 KB

And regarding the issue with the WooCommerce, I would suggest you contact their support for further help on this.
Please remember that we don’t offer any support to third party plugins or related issues.

Thanks

#5

Thanks for your attempt, but the border of the buttons or text is NOT configured as transparent in our website:

image
image1344×1498 307 KB

So any other idea?

Note: you can see yourself as I shared our the credentials in the previous message.

Thanks

Carlos

#6

Hi Carlos,

Instead of button style Transparent please select Flat or 3D option to get the Background Color option.

Theme-Options-Pro (16)
Theme-Options-Pro (16)420×901 11.1 KB

Screenshot-95-
Screenshot-95-417×863 20.1 KB

If the option Flat or 3D is affecting other buttons in the site I would suggest you hire a developer for further customization using custom CSS codes.

Thanks

#7

I’ve set it to flat, but it’s NOT working well yet. Screenshots:

image
image602×1690 19.3 KB

image
image1820×910 301 KB

#8

Hi Carlos,

The button text and background color are set to the same so it is not visible on hover too. I would suggest you set the background color and text color in contrast to making that viewable.
And regarding the Add to Cart button, its a default feature that the button appears on hover only,
I would suggest you hire a developer if you need to customize it further.

Thanks

#9

It’s not possible to hover on mobile: the default of the Pro theme is removing the Add to Cart button on mobile???

On the other hand, I’m a developer: may you share some link about how to customise your template? (I guess on a child theme)

Thanks

Carlos

#10

Hello Carlos,

In case if you want product Add to cart option there on the same page in small devices, you need to remove the hover effect for small devices so that Add to cart works there in small devices.

For that, you don’t need to override the template or customize the templates. You need to override the button CSS only. You can customize the code and using the media query CSS code to achieve your layout in mobile devices. https://www.w3schools.com/css/css_rwd_mediaqueries.asp

Thanks

#11

I want to show the Add to cart button always, not only in mobile.

So what is the class and/or template I have to modify to do that?

I mean, I do NOT want to modify all the buttons of the page, only the buttons of YOUR template, that’s why I’m asking you guys

Thankss

Carlos

#12

Hi Carlos,

To make the Add to Cart always visible you need to override the existing CSS for the button.
Here I have tried to style the specific item and it works, you can take this following code as an example.
Please copy and paste the following code to Theme Options > CSS, to get the output.

.woocommerce li.product .entry-header .button
{
    opacity:1 !important;
}

Remember that the above code will work if copied as it is and don’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We do not provide support for custom codes that means we can’t fix it in case it conflicts with something in your site nor will we enhance it.

Thanks

#13

It works perfectly. Thanks!

Well to be exact, I’ve added a background color:

/* Shows the Add to cart button always (or Buy button is the plugin direct to checkout is enabled) */
.woocommerce li.product .entry-header .button
{
   opacity:1 !important;
   background-color: white;
}

Result:

image
image990×908 209 KB

Thanks so much!! :slight_smile:

Carlos

#14

Hi Carlos,

Glad to help you out.

Thanks

#15

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.