Landing Page Customization on iOS

To provide more engaging experience to the invited users, you can customize the content of the landing page for each Smart Invite sent from the client side.

Configuration

Possible configuration options:

• Title: Title of the page.
• Description: Short description.
• Image: Landing page image. Can be an image URL or instance of UIImage.
• Video: Landing page video to be displayed instead of an image. At the moment we support only YouTube video URLs.

Example:

1. Customize content via Smart Link parameters:

   Android

   val image: Bitmap = ... // get image
   
   val linkParams = mapOf(
       LinkParams.KEY_CUSTOM_TITLE to "Hey friend!",
       LinkParams.KEY_CUSTOM_DESCRIPTION to "Check out this record!",
       LinkParams.KEY_CUSTOM_IMAGE to image
   
       // Alternatively, you can add a YouTube video instead of an image:
       // LinkParams.KEY_CUSTOM_YOUTUBE_VIDEO to "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
   )
   

   iOS

   var linkParams = [String: Any]
   linkParams[LinkParams.customTitle]  = "Hey friend!"
   linkParams[LinkParams.customDescription] = "Check out this record!"
   linkParams[LinkParams.customImage] = landingPageImage
   
   // Alternatively, you can add a YouTube video instead of an image:
   linkParams[LinkParamKeys.customYouTubeVideo] = "https://www.youtube.com/watch?v=dQw4w9WgXcQ"
   

   Unity

   Texture2D landingPageImage = ...; // get your image here
   
   var linkParams = new Dictionary<string, object>();
   linkParams["$title"] = "";
   linkParams["$description"] = "Check out this record!";
   linkParams["$image"] = landingPageImage;
   
   // Alternatively, you can add a YouTube video instead of an image:
   // linkParams["$youtube_video"] = "https://www.youtube.com/watch?v=dQw4w9WgXcQ";
   

   Flutter

   var linkParams = Map();
   linkParams['\$title'] = '';
   linkParams['\$description'] = 'Check out this record!';
   linkParams['\$image'] = 'https://api.adorable.io/avatars/250/documentation_app.png';
   
   // Alternatively, you can add a YouTube video instead of an image:
   // linkParams['\$youtube_video'] = 'https://www.youtube.com/watch?v=dQw4w9WgXcQ';
   

   React Native

   const linkParams = new Map();
   linkParams['$title'] = '';
   linkParams['$description'] = 'Check out this record!';
   linkParams['$image'] = 'https://api.adorable.io/avatars/250/documentation_app.png';
   
   // Alternatively, you can add a YouTube video instead of an image:
   // linkParams['$youtube_video'] = 'https://www.youtube.com/watch?v=dQw4w9WgXcQ';
   

   Web

   const linkParams = {
       '$title': '',
       '$description': 'Check out this record!',
       '$image': 'https://api.adorable.io/avatars/250/documentation_app.png'
   };
   
   
   // Alternatively, you can add a YouTube video instead of an image:
   // linkParams['$youtube_video'] = 'https://www.youtube.com/watch?v=dQw4w9WgXcQ';
   

2. Send customized invitation via GetSocial Data API:

   Android

   val customInviteContent = InviteContent()
   customInviteContent.linkParams = linkParams
   Invites.send(customInviteContent, InviteChannelIds.EMAIL, {
       Log.d("Invites", "Invite is sent successfully")
   }, {
       Log.d("Invites", "Invite is cancelled")
   }, { error: GetSocialError ->
       Log.d("Invites", "Failed to send an invite: $error")
   })
   

   iOS

   let customInviteContent = InviteContent()
   customInviteContent.linkParams = linkParams
   Invites.send(customInviteContent, onChannel: InviteChannelIds.email, success: {
       print("Customized invitation via email was sent")
   }, cancel: {
       print("Customized invitation via email was cancelled")
   }, failure: { error in
       print("Failed to send customized invitation via Email: \(error)")
   })
   

   Unity

   var customInviteContent = new InviteContent();
   customInviteContent.AddLinkParams(linkParams);
   Invites.Send(customInviteContent, "email",
       () => {
           Debug.Log("Customized invitation via email was sent");
       },
       () => {
           Debug.Log("Customized invitation via email was cancelled");
       },
       (error) => {
           Debug.Log("Failed to send customized invitation via email, error: " + error);
       });
   

   Flutter

   var customInviteContent = InviteContent();
   customInviteContent.linkParams = linkParams;
   Invites.send(customInviteContent, InviteChannelIds.email,
       () => print('Customized invitation via email was sent'),
       () => print('Customized invitation via email was cancelled'),
       (error) => print('Customized invitation via email failed, error: $error'));
   

   React Native

   const customInviteContent = new InviteContent();
   customInviteContent.linkParams = linkParams;
   Invites.send(customInviteContent, "email",
       () => {
           console.log('Customized invitation via email was sent');
       },
       () => {
           console.log('Customized invitation via email was cancelled');
       }, (error) => {
           console.log('Customized invitation via email failed, error: ' + error.message);
       });
   

   Web

   const customInviteContent = new GetSocialSDK.InviteContent({
       linkParams
   });
   
   Invites.send(customInviteContent, "email")
       .then((inviteUrl) => {
           console.log('Invite URL: ', inviteUrl);
       }, (error) => {
           console.log('Customized invitation via email failed, error: ', error);
       })
   

Next Steps

• Setup mobile app to receive Smart Links on Android and iOS.
• Check the Smart Links best practices.
• Customize your Smart Link Domain.

Give us your feedback! Was this article helpful?

😀 🙁