A booth is a rectangular area on a client page used to display advertising materials.
Booth type
MCDP supports the following seven types of booths: splash, pop-up, bulletin, banner, list, float, and custom booth.
Splash: A booth in a full-screen area when the app is cold boot. And the splash booth is globally unique within the app.
Pop-up: A booth in the app with controllable width and height in a floating layer area.
Bulletin: Deliver relevant information to users in the form of message broadcasting.
Banner: A booth in a rectangular area of a fixed position on the app page that supports a horizontal banner of one or more advertisement spaces.
List: Many different ads are listed in an area on the app page.
Float: A booth at a fixed position on the app page.
Custom: Custom advertisements of copy type.
Basic booth information
The booth has basic information such as booth name, booth ID, and effective (cache) time.
Booth name: Required. You can enter a maximum of 30 characters, and the name cannot be repeated with an existing name.
Booth ID: Required. The ID can contain letters, numbers, underscores (_), and hyphens (-), and cannot be the same as the existing booth ID.
Custom ID: If the booth is a dynamic booth, select this field, then enter the booth ID and page address in the Custom ID text box.
iOS page address: Enter the iOS-client page address which displays the booth. To enter the VCName of the page, you need to contact the app developer, for example,
MPHomeViewController
. Note that VCName must inherit fromDTViewController
. Otherwise, the booth will not be displayed.Android page address: Enter the Android-client page address which displays the booth. To enter the ActivityName of the page, you need to contact the app developer, for example,
com.mpaas.demo.cdp.DynamicContent1Activity
.HTML5 page address: Enter the HTML5 page address which displays the booth. To enter the full path of the page, you need to contact the app developer. You can use the
window.location
object to get the full path of the HTML5 page.
Client preset ID: When the booth is a client preset booth, select this field, and copy and enter the ID of the preset booth in the Client Preset ID text box. You can contact the app developer to obtain the ID.
Splash booth ID: Select this field when it is a splash booth. The default splash booth ID is STARTPAGE and cannot be modified. An application can have only one splash booth, that is, if there is already one splash booth in the application, you cannot create another splash booth.
Valid (cache) period: Required. Refers to the retention time of the cache after the booth advertisements are loaded once. The time should be set in consideration of the usage of download traffic and user experience. The time range that can be set ranges from 00:00:00 to 71:59:59.
Booth configuration information
Booths can be configured for booth type, booth material type, booth position, style, booth height, booth width, and the number of advertisement spaces.
Booth type: The MCDP supports seven booth types: splash, popup, bulletin, banner, list, float, and custom booth.
Booth material type: Required. Refers to the types of materials supported by the booth. Some booths can be adjusted.
Booth position: Required. Refers to the position of the booth on the page, including the top floating layer of the page, the top of the page, the bottom of the page, the head of the list, the bottom of the list, the top left of the screen, the top right of the screen, the middle left of the screen, the middle right of the screen, the bottom left of the screen, and the bottom right of the screen. Some booths can be adjusted.
NoteDifferent booth types can be configured with different positions. For details, see the following booth configuration information sheet.
Top float
Top of page
Bottom of page
List head
The booth is located at the top of the page, floating above the page layout, and does not move down the original layout. It is a fixed position relative to the screen, the width of the booth is the same as the width of the page.
The booth is located at the top of the page and moves down the original layout. It is a fixed position relative to the page, the width of the booth is the same as the width of the page.
The booth is located at the bottom of the page and moves up the original page layout. It is a fixed position relative to the page, the width of the booth is the same as the width of the page.
Located at the top of the list (above the first advertisement space), and moves down the original list layout to the bottom. It is a fixed position relative to the list, the width of booth is the same as the list width.
List bottom
Upper left of screen
Middle left of screen
Bottom left of screen
Located at the bottom of the list (below the last advertisement space), and moves up the original list layout to the top. It is a fixed position relative to the list, the width of the booth is the same as the width of the list.
Only for float booth. Located at the top left of the screen, floating above the page layout, does not affect the original page layout, and is a fixed position relative to the screen.
Only for float booth. It is located in the center of the left side of the screen, floating above the page layout, does not affect the original page layout, and is a fixed position relative to the screen.
Only for float booth. Located at the bottom left of the screen, floating above the page layout, does not affect the original page layout, and is a fixed position relative to the screen.
Upper right of screen
Middle right of screen
Bottom right of screen
Located at the top right of the screen, floating above the page layout, does not affect the original page layout, and is a fixed position relative to the screen.
Only for float booth. Located at the middle right of the screen, floating above the page layout, does not affect the original page layout, and is a fixed position relative to the screen.
Only for float booth. Located at the bottom right of the screen, floating above the page layout, does not affect the original page layout, and is a fixed position relative to the screen.
Style: Required. That is, the appearance and style of the booth, including background color, foreground color, text color, and control color. Some booths can be adjusted.
Background color: The background color of the booth, the value is #F8F8F8 by default.
Foreground color: The foreground color of the booth. The foreground color of the booth is the background color that appears when the booth is clicked and the value is #E7E7E5 by default. When the booth is clicked, if there is a redirection address for the materials in the booth, the foreground color is rendered. Otherwise, the background color is rendered. For the configuration of the redirection address, see Creating an activity > Adding advertising.
Text color: The color of the text in the booth, the value is #FF0000 by default.
Control color: The color of the control (small horn) in the booth, the value is #1A1311 by default.
Booth height: Required. The height of the booth on the application page in px. Some booths can be adjusted.
Booth width: Required. The width of the booth on the application page in px. Some booths can be adjusted.
Advertising spaces: Required. Booths of banner and list type support multiple frames, and the number of advertisement spaces is the number of frames in the booth. Some booths can be adjusted.
Display duration of each message: This configuration is associated with the number of advertisement spaces. The carousel time of single information is not configurable when the number of advertisement spaces is 1. And when the number of advertisement spaces is not 1, the carousel time of single information can be configured as an integer from 1 to 10.
Splash
Pop-up
Bulletin
Banner
List
Float
Custom
Booth Type
√
√
√
√
√
√
√
Booth material type
√
√
x
√
√
√
x
Booth position
Default
Default position
Top float
Top float
Top float
Upper left of screen
x
Top of page
Top of page
Top of page
Upper right of screen
Bottom of page
Bottom of page
Bottom of page
Middle left of screen
List head
(Only available for Native page)
List head
(Only available for Native page)
List head
(Only available for Native page)
Middle right of screen
List bottom
(Only available for Native page)
List bottom
(Only available for Native page)
List bottom
(Only available for Native page)
Bottom left of screen
-
-
-
Bottom right of screen
Style
x
x
√
x
x
x
√
Booth height
x
√
√
√
√
√
x
Booth width
x
√
x
x
x
√
x
Advertising spaces
1
1
1
1-10
1-10
1
1
Display duration of each message
x
x
x
1-10s
1-10s
x
x
Note: “√” means this element is supported and must be configured; “x” means this element is not supported; "-" means no content.
Supported booth materials
The types of booth materials supported by MCDP are listed in the following table:
Text: Plain text is displayed.
Static image: Static images in PNG, JPG, and JPEG formats are displayed.
GIF: GIFs are displayed.
Lottie animation: Lottie animations are displayed.
HTML5 page: Online HTML5 pages are displayed.
The types of booth materials supported vary by booth type, as detailed in the following table.
Splash | Pop-up | Bulletin | Banner | List | Float | ||
Static image | √ | √ | x | √ | √ | √ | |
GIF | √ | √ | x | √ | √ | √ | |
Lottie animation | √ | √ | x | √ | √ | √ | |
HTML5 page | x | √ | x | √ | √ | x | |
Text | x | x | √ | x | x | x | |
Note "√" means supported; "x" means not supported. |
Booth configuration modes
MCDP provides two booth configuration modes: dynamic configuration and client preset. You can choose one as needed.
Dynamic configuration
In the case of dynamic booth configuration, after you added the MCDP SDK to the client project, directly configure booth properties on the console, including the booth name, booth ID, booth page, booth type, booth material type, booth position, booth width, booth height, and the amount of advertisement spaces.
The booth types supported by a dynamic booth include pop-ups, bulletins, banners, lists, float, and custom booth. For the booth positions supported by various types of booths, see the Booth position column in booth configuration information sheet. In dynamic configuration, only the content of the booth is configured, not the position. Dynamic booths do not support the belly-band booth position.
Take note of the following items when you use the dynamic booth:
For a custom booth, you need to preset the booth on the client first. This type of booth is special and applies to partially scenarios where custom copywriting is required. Take the search box as an example, on the console, you can define the content of the copy in the search box, but you cannot set the position, width, and height of the search box, and these properties need to be configured through the client.
In Android client, the top floating layer or the top of the page must contain the
ViewGroup
control with tagh5_titlebar
, or the layout must contain theAUTitleBar
control from theantui-build
component; the head/bottom of the list must contain theListView
control.In iOS client, the head/bottom of the list must contain the
UITableView
control.
Client preset
In the case of booths preset on the client, you need to add the MCDP SDK to the client project and preset some of the booth properties in the client project by coding, including the ID, page, position, width, and height of the booth. Then you need to create the booth on the console and enter the booth ID preset in the client project to complete the booth creation. You can also set the booth width and booth height on the console, but the two can only be set when they are not configured in the client project.
The types of booths supported by booths preset on the client include pop-ups, bulletins, banners, lists, float, and custom booth. The client configuration mode is available to support booth positions that are not supported by dynamic booths (for example, belly-band position).
NoteFor ease of adjustment, we recommend that you preset only the ID, page, and position of the booth in the client project and configure only the booth height on the console.
For details about the procedures of presetting a booth on different pages, refer to the following articles:
Android page: Configure preset booth in Android app.
iOS page: Configure preset booth in Android app.
HTML5 page: Configure preset booth in HTML5 page.