email622
posted this
02 August 2020
I'm using Paddle.com (pop-up store) on my site for accepting payments. My site is built on Joomla and designed with JD Builder (Joomla addon). I'm using Nicepage for creating the template.
All works well on desktop, but om mobile (chrome), the Paddle.com payment solution does not work well with this setup. When clicking on the BUY link/button the Paddle overlay pops up for half a second, then the entire page becomes white.
By disabling all the stylesheets on my site one by one I was able to single out the Nicepage stylesheet "template.css" (no custom css included) as the source of the problem. More exactly this:
body,
aside,
.u-sidebar-block,
section,
header,
footer {
position: relative;
}
By overriding using this custom code Paddle.com is working again.
body {
position:static;
}
I was not able to reproduce the issue by creating a plain non-joomla html page adding the problematic CSS there. So I havent been able to figure out why this code only seems to be an issue using Joomla/JD builder/Nicepage in combination.
Steps to reproduce:
Build a blank Joomla page using JD builder. Add nothing to the page except the Javascript and CSS required for the Paddle.com popup store. Click on the buy button on a mobile phone (or simulate a mobile device using chrome developer tools on desktop)
I'm using Paddle.com (pop-up store) on my site for accepting payments. My site is built on Joomla and designed with JD Builder (Joomla addon). I'm using Nicepage for creating the template.
All works well on desktop, but om mobile (chrome), the Paddle.com payment solution does not work well with this setup. When clicking on the BUY link/button the Paddle overlay pops up for half a second, then the entire page becomes white.
By disabling all the stylesheets on my site one by one I was able to single out the Nicepage stylesheet "template.css" (no custom css included) as the source of the problem. More exactly this:
body,
aside,
.u-sidebar-block,
section,
header,
footer {
position: relative;
}
By overriding using this custom code Paddle.com is working again.
body {
position:static;
}
I was not able to reproduce the issue by creating a plain non-joomla html page adding the problematic CSS there. So I havent been able to figure out why this code only seems to be an issue using Joomla/JD builder/Nicepage in combination.
Steps to reproduce:
Build a blank Joomla page using JD builder. Add nothing to the page except the Javascript and CSS required for the Paddle.com popup store. Click on the buy button on a mobile phone (or simulate a mobile device using chrome developer tools on desktop)
Vote to pay developers attention to this features or issue.
