tencent cloud

All product documents
Tencent Cloud Super App as a Service
Banner Ad
Last updated: 2025-04-09 18:35:49
Banner Ad
Last updated: 2025-04-09 18:35:49
To use mini program banner ads, you must first obtain ad authorization. For details, see Ad Authorization.
Developers can create banner ads using the banner ad component. Once created, the component will automatically fetch and display ad data.

Ad size settings

Banner ads themselves cannot directly have their styles set through the style attribute. The default width is 100% (width: 100%), and the height is calculated proportionally. So developers can adjust the ad size by setting the width of the outer component. The width of the outer component must not be less than 300 px. If the width is less than 300 px, the banner ad width will be forcibly adjusted to 300 px.
WXML
WXSS
<view class="adContainer">
<ad unit-id="xxxx"></ad>
</view>
/* The width of the outer component can be set to 100% or a specific value. */
.adContainer { width: 100%;}


Ad event listening

After creation, the banner ad will be automatically fetched. Developers can use the onload and onerror events of the ad component to listen for successful or failed ad fetches.
WXML
JS
<view class="adContainer">
<ad unit-id="xxxx" bindload="adLoad" binderror="adError" bindclose="adClose"></ad>
</view>
Page({
adLoad() {
console.log('Banner ad loaded successfully')
},
adError(err) {
console.log('Banner ad loading failed', err)
}
})




Was this page helpful?
You can also Contact Sales or Submit a Ticket for help.
Yes
No

Feedback

Contact Us

Contact our sales team or business advisors to help your business.

Technical Support

Open a ticket if you're looking for further assistance. Our Ticket is 7x24 available.

7x24 Phone Support
Hong Kong, China
+852 800 906 020 (Toll Free)
United States
+1 844 606 0804 (Toll Free)
United Kingdom
+44 808 196 4551 (Toll Free)
Canada
+1 888 605 7930 (Toll Free)
Australia
+61 1300 986 386 (Toll Free)
EdgeOne hotline
+852 300 80699
More local hotlines coming soon