Return to previous page

Add to Cart button on mobile devices…

This topic has 14 replies, 3 voices, and was last updated 6 years, 2 months ago ago by Olga Barlow

appdevtr33

Participant

September 11, 2018 at 04:58

Hi,
How can I make sure that the add to cart button always visible on the mobile devices under the product picture?
Hover effect is not as good as user experience on mobile devices.
Thanks

#199259 Copied

13 Answers

Rose Tyler

Support staff

September 11, 2018 at 07:58

Hello,

Please provide us with your site URL and describe the problem in more details.
Thanks in advance.

Regards

#199265 Copied

appdevtr33

Participant

September 11, 2018 at 20:44

Hi,
I used burger demo of xstore theme.

How can I make sure that the add to cart button always visible on the mobile devices under the product picture?
Hover effect is not as good as user experience on mobile devices.

#199304 Copied
Rose Tyler

Support staff

September 12, 2018 at 07:11
Hello,

Thanks for the reply.
Please add this code in Theme Options > Styling > Custom css > Global custom css:
```
.single_add_to_cart_button.button {
    border: 2px solid;
}
```
and Custom css for mobile:
```
.single_add_to_cart_button.button {
    display:  block;
    margin-top: 20px;
}
```
Let me know the result.

Regards
#199315 Copied
appdevtr33

Participant

September 13, 2018 at 11:47

Hi Rose,
I added “!important” to each css line. But nothing changed.
I tried after cleaning the entire caches (MaxCDN, CloudFlare, W3 Total Cache and browser cache)
Regards

#199415 Copied

Rose Tyler

Support staff

September 13, 2018 at 12:08

Hello,

I do not see the problem on your site on my mobile. Have you tried to check from another device?
Please describe the issue in more details http://prntscr.com/ktx3nr for better understanding the desired result.

Regards

#199416 Copied

appdevtr33

Participant

September 14, 2018 at 10:56

Hi again,
There has been a misunderstanding.
I want to show add to cart button under the product on the mobile main page. Not in the product detail page. There are already there.
Regards

#199480 Copied

Rose Tyler

Support staff

September 14, 2018 at 13:49

Dear @appdevtr33,

Do you mean this button http://prntscr.com/kud9p7 on Home page?
Please provide a screenshot to help me understand more.
You can use such screenshot maker as Lightshot https://prnt.sc/ and provide links to screenshots.
Also, provide temporary wp-admin access in the Private Content area http://prntscr.com/kudb7z

Regards

#199484 Copied

appdevtr33

Participant

September 14, 2018 at 23:59

Hi,
I wonder if it will be like the picture I sent;
https://prnt.sc/kuk7ik/
I just want it to be mobile screen size.
Regards

Please, contact administrator
for this information.

#199503 Copied

Olga Barlow

Support staff

September 15, 2018 at 11:14

Hello,

Check now.
Also, I would like to offer you to update theme to version 5.0 beta. It has lots of improvements for the page speed and new options, improved theme options. If you want we could update theme for you. We need FTP access to your site and you need to disable CDN during theme update. What do you think?

Regards

#199504 Copied

appdevtr33

Participant

September 16, 2018 at 12:01

Hi,
Thank you. I’ll do theme update soon.
Regards

#199514 Copied

Rose Tyler

Support staff

September 17, 2018 at 07:23

Hello,

Let us know if you need any further assistance.

Regards

#199525 Copied

appdevtr33

Participant

September 18, 2018 at 08:52

Hi,
Thank you for your helps. I wonder how you did it. Did You do with WPBakery grid products settings or with main theme file manipulation. I didn’t see any child theme css manipulation. I’m afraid all work will be lost if I update the theme :).
Regards.

#199601 Copied
Olga Barlow

Support staff

September 18, 2018 at 10:53
Hello,

I have enabled the add to cart button in grid element settings and added custom styles to page custom to hide it for the desktop version
```
@media only screen and (min-width: 993px) {
    .mpc-product__content .mpc-wc-add_to_cart-wrap {
    display: none;
}
}
```
So, you won’t lose these changes after theme update.

Regards
#199611 Copied
Viewing 14 results - 1 through 14 (of 14 total)