Integration

Banner format

Below we tell you how to instantiate one or more In-App messages in banner format.

Remember that you should first have them defined in the indigitall console. See our user manual for more info.

One single banner
Create a div on your page. The size must match what you have defined in the indigitall console ( Tools> In-App / In-Web Schemas).

<InAppComponent inAppCode={'YOUR_INAPP_CODE'} width={400} height={600} />

If a width and height size different from the one we have defined in the console is assigned, it is likely that the InApp will not display correctly.

Multiple banners
If we want to have several InApp, the previous step has to be carried out for each component that we want to show.

PopUp Format

Here we tell you how to instantiate an In-App message in popup format.

Remember that you should first have it defined in the indigitall console. See our user manual for more info.

InApp.showPopUp(
    {
      inAppCode: 'YOUR_INAPP_CODE',
      closeIconDisabled: false,
    },
    (state, inApp) => {
      //DO SOMETHING
    },
    (error) => {
      //DO SOMETHING
    }
  );

If you want to customize the icon to close the Popup, you can do it with the following method to which you can pass the name of the image or icon that you must attach in the native versions. In the case of android in the drawable folder and in the case of iOS in assets , if you wanted to use our icon, it would be enough to pass a null. The parameter closeIconDisabled is in case you don't want to show any icon, setting it to true to hide it or false to show it.

InApp.showPopUp(
    {
      inAppCode: 'YOUR_INAPP_CODE',
      closeIconDisabled: false,
      imageCloseButtonName: 'YOUR_ICON_BUTTON_NAME'
    },
    (state, inApp) => {
      //DO SOMETHING
    },
    (error) => {
      //DO SOMETHING
    }
  );


  InApp.showPopUpWithParams(
    {
      inAppCode: 'YOUR_INAPP_CODE',
      closeIconDisabled: false,
      imageCloseButtonName: 'YOUR_ICON_BUTTON_NAME'
    },
    () => {
      //onload
    },
    (inAppCode, showTime) => {
      //show time
    },
    () => {
      //did clicked
    },
    () => {
      //didclosed
    },
    () => {
      //did dismissed
    },
    () => {
      //didExpired
    },
    () => {
      //didClickout
    },
    () => {
      //did show more
    },
    () => {
      //did dismiss forever
    },
    (InApp) => {
      //Show inApp
    },
    (error) => {
      //log error
    }
  );