• France
lyra.com
Search
Categories
Tags
docs.
France
Spain
Europe (English)
India
Home
Implementation
Embedded form (cards)
REST payment API
REST PCI-DSS payment API
REST SEPA API
Hosted payment
Data collection form
File exchange
Mobile payment
Snippets
Plugins
Marketplace
Back Office
Merchant Back Office
Expert Back Office
Guides
Help
FAQ
Video tutorials
Support

Displaying the payment page in an iframe

For more information, see our Implementation of a Payment Page Into an iFrame guide available in our online document archive.

  1. Create an HTML <iframe> tag on the page where you would like to display the fill out form (this page should correspond to the “Payment” stage of your purchase journey):
    ... <body> <iframeid="idFrame" name="nameFrame" src="https://www.mystore.com/payment/form.php"/> </body> </html>

    Populate the src attribute with your payment form URL.

     In order to correctly display 3D Secure pages, we recommend a minimum size of 400px * 400px.
    Example of an integrated payment page:
    Example of an integrated 3D Secure page:
  2. Edit your payment form:
    • Populate your vads_action_mode parameter with IFRAME to enable the iframe mode and obtain a clean display of the payment page.
    • Add the target attribute to your <form> tag and populate it with the title of your iframe.
    • In iframe mode, the buyer cannot view or download the payment receipt. The receipt must be sent to the buyer by e-mail. Therefore, the vads_cust_email parameter is required.
    • Use the vads_iframe_options field if you would like to customize the background color and the font of the entry fields.
      vads_iframe_options = {"fieldsBackgroundColor":"#000000","fieldsFontColor":"#FFFFFF"}
    ... <form method="POST" action="https://secure.lyra.com/vads-payment/"target="nameFrame"> <input type="hidden" name="vads_action_mode" value="IFRAME" /> ... ...
  3. Manage the end of payment:

    In iframe mode, there is no button to cancel or return to the shop. You can, however, automatically redirect the buyer to the order confirmation page.

    For this, in your payment form, populate the parameters below:
    • vads_redirect_success_timeout and vads_redirect_error_timeout with " 0",
    • vads_url_success with the URL of your order confirmation page,
    • vads_url_return with the URL of your return page in case of rejected payment,
    • vads_return_mode with the " POST " or " GET " value to retrieve the payment result and display it on your order confirmation page if necessary,
    • vads_theme_config with the " FORM_TARGET=_top " value in order to define the way the return page will be displayed.
      You can also use the following values depending on your needs: " _self", " _parent", " _framename".
Example of a confirmation page that displays payment details
Recruitment

Head Office :

LYRA NETWORK
109, rue de l’innovation
31670 Labège
FRANCE

2.8.1-doc-1.8