Helpful Tips

Responsiveness

Include the "viewport" meta tag in the HTML file where the widget is initialized to ensure optimal responsiveness across various screen resolutions:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Enabling Apple Pay in Cross-Origin iFrames

To utilize Apple Pay within an iframe that's loaded from a different origin (website domain) than Partner's main application, allow="payment" attribute should be added to the <iframe> tag. This attribute signals to the browser that the iframe requires access to payment-related functionalities, including Apple Pay.
Example:

<iframe src="[enter-your-url]" allow="payment"></iframe>

By adding this attribute, the iframe is granted the necessary permissions to initiate and complete Apple Pay transactions, even when embedded in a cross-origin context.

📘

The allow="payment"attribute is a relatively new feature and may not be fully supported by all browsers (Safari 17 and later).

Google Pay and Apple Pay in WebView integration

In WebWiew integration, set the pb-mob-app cookie to true so that the Google Pay / Apple Pay popup triggers redirect to a regular mobile browser. This is required for Google Pay and Apple Pay to work properly in this integration type.

sandbox attribute

If you're embedding the Paybis widget inside an <iframe> with the sandbox attribute, make sure that it includes the necessary permissions to allow the widget to function properly.

<iframe
  src="[enter-your-url]"
  sandbox="allow-scripts allow-same-origin allow-presentation allow-popups allow-popups-to-escape-sandbox"
  allow="clipboard-read; clipboard-write *; payment *; camera; microphone;"
></iframe>