# Native templates Advertising

Mini Program advertising traffic main operating guidelines:[Document address](https://ad.weixin.qq.com /pdf.html?post_id=U2FsdGVkX19ll2hBY/i9/XyTZ3U858nPUczgOnREpy0=)
Developers can use ad-custom Component Creation Native templates Advertising Components, Native Templates The ad component automatically pulls and displays ad data after it is created.

# Ad Size Settings

Native templates Ads do not allow direct setting of style properties. The default width is 100% (width: 100%), and the height is automatically calculated proportionally, so developers can set the width of the ad outer component to adjust the size of the ad. The width of the ad outer component is related to the specific template, which can be referred to the template editor documentation.

/* The width of the outer assembly can be set to 100% or a specific value */
.adContainer {
  width: 100%
}

<view class="adContainer">
  <ad-custom unit-id="xxxx" ></ad-custom>
</view>

# Advertising event monitoring

Native templates Ads are automatically pulled after they are created. Developers can use ad-custom Component onload and onerror Event listening for ads to pull success or failure, and can be accessed byoncloseEvent Monitor Ads Off.

<view class="adContainer">
  <ad-custom unit-id="xxxx"  bindload="adLoad" binderror="adError" bindclose="adClose"></ad-custom>
</view>

Page({
  adLoad() {
    console.log('Native template ads loaded successful')
  },
  adError(err) {
    console.log('Native template ad loading failed ', err)
  },
  adClose() {
    console.log('Native template advertising closed')
  },
})

# Ad Timing Refresh

Developers can create Native templates Incoming when advertising ad-intervals Parameter to achieve the timing refresh of the advertisement,ad-intervals The parameter is a number in seconds. Note: The auto-refresh interval cannot be less than 30 seconds, so that ad-intervals The parameter value must be greater than or equal to 30.

<view class="adContainer">
  <ad-custom unit-id="xxxx"  ad-intervals="30"></ad-custom>
</view>

# Monitor advertising hidden

• Matrix Lattice Ad Trigger Type Special Dxplaination: When the user clicks the Close button in the upper right corner, the ad will be displayed by controlling The style of the element display: None Make it hidden. The developer can pass ad-custom Component onhide Event listens to hide events, by changing them when necessary display The style causes the ad to be re-displayed.

<ad-custom unit-id="xxxx"  Bindi="Adhide"></ad-custom>