App Native Slider

App Native Slider is a slider that consists of interconnected ads and uses the principle of native advertising. You can customize the ad depending on the functions and design of the app the slider will be displayed in.

Example of App Native Slider ad:

Image requirements

  • Make sure to use high-resolution images: this will improve the banner's display quality on mobile devices, but might also take it longer to load.
  • We recommend reducing the image file size using a file compression service, such as TinyPNG.
  • Acceptable image formats: PNG, GIF (without animation), JPG.
  • The maximum size of a single file is 300 KB.

Creating a native banner

  1. Decide which native ad elements you want to include in the banner.

  2. Prepare the JSON code. Specify the parameters that you want to customize (ad elements and their values) in the code.

    Example of JSON
    {
      "content": [
        "text",
        "button"
      ],
      "text": {
        "value": "Customizable text from an Adfox ad unit"
      },
      "button": {
        "label": "Custom button",
        "link": " https://ya.ru/ ",
        "backgroundColor": "#5D9B9B"
      }
    }
    
  3. Write JSON to a string and use the \ character to escape quotes.

    Example of JSON with escaped quotes
    {   \"content\": [     \"text\",     \"button\"   ],   \"text\": {     \"value\": \"Customizable text from an Adfox ad unit\"   },   \"button\": {     \"label\": \"Custom button\",     \"link\": \"https:\/\/ya.ru\/\",     \"backgroundColor\": \"#5D9B9B\"   }
    
  4. To ensure correct display of native elements in your app, add support for reading JSON data on the app side. Note that each native ad element specified in JSON must be properly implemented in the app code.

    Example of parsing JSON data (Kotlin)
    
    private fun processAdditionalText(rawJson: String) {
        try {
            val jsonObject = JSONObject(rawJson)
            val contentJSONArray = jsonObject.getJSONArray("content")
    
            repeat(contentJSONArray.length()) { index ->
                val elementName = contentJSONArray.getString(index)
                val elementConfiguration = jsonObject.getJSONObject(elementName)
    
                when (elementName) {
                    "text" -> addTextToLayout(elementConfiguration, index)
                    "button" -> addButtonToLayout(elementConfiguration, index)
                }
            }
        } catch (e: JSONException) {
            adInfoFragment.log(e.message ?: "JSON parsing error")
        }
    }
    
    private fun addTextToLayout(textConfiguration: JSONObject, index: Int) {
        val textView = TextView(this).apply {
            setPadding(resources.getDimension(R.dimen.item_padding).toInt())
    
            text = textConfiguration.getString("value")
        }
        additionalContainer.addView(textView, index)
    }
    
    private fun addButtonToLayout(buttonConfiguration: JSONObject, index: Int) {
        val buttonView = Button(this).apply {
            setPadding(resources.getDimension(R.dimen.item_padding).toInt())
    
            text = buttonConfiguration.getString("label")
    
            val colorHex = buttonConfiguration.getString("backgroundColor")
            setBackgroundColor(Color.parseColor(colorHex))
    
            setOnClickListener {
                val link = buttonConfiguration.getString("link")
                val intent = Intent(Intent.ACTION_VIEW, Uri.parse(link))
                startActivity(intent)
            }
        }
        additionalContainer.addView(buttonView, index)
    }
    
    
  5. Add the banner following the instructions below.

Stages of native banner preparation

Add a banner to Adfox

To add a banner:

  1. In the ad campaign settings, go to the Banners tab and click Add.

  2. Select the App Mobile Native banner type and the App Native Slider template.

  3. Set the banner parameters:

    • Priority: The number that determines the banner's display order in the campaign. The higher the numeric value, the higher the banner's priority over the other banners in the same campaign. To learn more about priorities, see Adfox help.

    • Slide N: image (where N is the slide number) is the slide image.

    • Slide N: click-through web link (where N is the slide number) is a link to the advertiser's website. For the click to work correctly, make sure link contains the protocol (http:// or https://). If the user hasn't installed the app, this link is called instead of a link to a deeplink.

    • Slide N: Deeplink (where N is the slide number) is a link that redirects the user to a specific page in the iOS or Android app.

    • Slide N: Android BundleID (where N is the slide number) is the app ID in Play Store, required for the deeplink to work on Android. Example: ru.yandex.searchplugin.

    • Width: Slider width. Enter only an integer in pixels, without specifying the dimension.

    • Height: Slider height. Enter only an integer in pixels, without specifying the dimension.

    • Additional text: If you need to add custom elements to an ad or creative, specify the JSON that you created earlier.

      Example of a filled-in Additional text

    • Slide set: In this field, you can adjust the number and type of slides. Add to it a list of variables that look like %global.InAppSlideN% (for slides that don't contain a deeplink) and %global.InAppSlideDeeplinkN% (for slides with a deeplink), where N is the slide number.

      Example of filling out fields for a slider that consists of three slides with deeplinks
      %global.InAppSlideDeeplink1%
      %global.InAppSlideDeeplink2%
      %global.InAppSlideDeeplink3%
      
    • Start date and time: Required parameters. By default, this parameter is set to the current date. If you don't change it, banners will start being served immediately after you add them (if their status is set to active).

    • Name: Enter a name for the banner. If you leave this field blank, it will be assigned a sequential number.

    • Status: Select a status for the banner:

      • active: The banner is ready to be served.
      • paused: The banner impression is paused.
      • completed: The banner won't be served.
    • Disabled on new placements: This option is enabled by default. Once you create your banner, it won't be placed automatically:

      • In new placements created within the site or section where your campaign is placed.
      • In placements that were enabled in the campaign placement settings after the banner was created. If you disable this option, the banner will be automatically added to any placements that have the campaign placement enabled.
    • Targeting profile: Select the targeting profile you created earlier. To learn more about targeting profiles, see Adfox Help.

    • Events enabled: This option is used to get direct links to events to be tracked in a third-party system. To activate the option, click next to the banner in the Placements tab. In the window that opens, you'll see links to events from 1 to 30. Copy and send them to the third-party system to be tracked there.

    • Impressions in total, day, hour:

      • Impressions total, day, hour: Maximum number of banner impressions. If a campaign is distributed evenly, set the banner display end date. Once the number of impressions reaches the maximum, the banner's status changes to completed and it's no longer served.
      • Impressions per day: Maximum number of impressions per day. Once the number of impressions from the start of the day reaches the maximum, they are paused until the next day starts.
      • Impressions per hour: Maximum number of impressions per hour. Once the number of impressions from the start of the hour reaches the maximum, they are paused until the next hour starts.
    • Clicks total, per day, per hour:

      • Clicks total: Maximum number of banner clicks. If a campaign is distributed evenly, set the banner display end date. Once the number of clicks reaches the maximum, the banner's status is changed to Completed and it's no longer served.
      • Clicks per day: Maximum number of banner clicks per day. Once the number of clicks from the start of the day reaches the maximum, impressions are paused until the next day starts.
      • Clicks per hour: Maximum number of banner clicks per hour. Once the number of clicks from the start of the hour reaches the maximum, impressions are paused until the next hour starts.
    • End time: To set the end date and time, first enable the option.

  4. To save a banner, click Add.

You can set links for measurement in banner events:

  • A slider impression tracking pixel that counts the number of impressions of the whole slider.
  • An N slide impression tracking pixel (where N is the slide number), which counts the number of impressions of the N slide.
  • The number of clicks for slide N, where N is the slide number. The overall click statistics are total clicks for all slides.

Contact support