Google Analytics

Google Analytics allows to monitor the traffic on each page of a website. It also allows to track the user’s actions on the page.

This article explains how to use the Google Analytics events with the embedded form and the pop-in.

In order to understand this article, you must have a basic understanding of the functioning of Google Analytics. For more information, go to the following page.

A Google Analytics event can be emitted in two ways:

At the end of the payment, the embedded form redirects the buyer to the payment confirmation page, also called the “browser return”. This URL is defined via the kr-post-url-success parameter:

  <!-- Javascript library. Should be loaded in head section -->
  <script 
   src="https://api.systempay.fr/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js" 
   kr-public-key="73239078:testpublickey_Zr3fXIKKx0mLY9YNBQEan42ano2QsdrLuyb2W54QWmUJQ" 
   kr-post-url-success="paid.html">
  </script>

  <!-- Javascript library. Should be loaded in head section -->
  <script 
   src="<?php echo $client->getClientEndpoint();?>/static/js/krypton-client/V4.0/stable/kr-payment-form.min.js"
   kr-public-key="<?php echo $client->getPublicKey();?>"
   kr-post-url-success="paid.php">
  </script>

For more information, go to: Getting started: single payment.

This page receives (in POST parameters) the newly created transaction. For more details, see the Payment completed page. Using this information, you can emit an event as follows:

<?php
require_once __DIR__ . '/vendor/autoload.php';
$client = new Lyra\Client();
$formAnswer = $client->getParsedFormAnswer();
?>
<script type="text/javascript">
ga('send', 'event', 'payment', 'new_transaction', 'status', "<?php echo $formAnswer['kr-answer']['orderStatus']; ?>");
</script>

This example emits a new_transaction event in the payment category. The transaction status is also sent.

This example uses our PHP SDK. For more information, go to: Server SDKs.

If your website is of single page application type, you must emit the Google Analytics events in JavaScript. For this, use the events of the embedded form.

In order to retrieve the newly created transaction, you must use the KR.onSubmit event.

Example of code using jQuery:

<script type="text/javascript">
    $(document).ready(function() {
      KR.onSubmit( function(event) {
        /* emit a Google Analytics event */
        ga('send', 'event', 'payment', 'new_transaction', 'status', event.clientAnswer.orderStatus));
        
        /* return values:
         * true: kr-post-success-url is called using POST
         * false: kr-post-success-url is not called, execution stops.
         */
        return false;
      });
    });
</script>

For more information on JavaScript events, go to: JavaScript client reference.