# Grid Advertising

Mini Program advertising traffic main operating guidelines:Document address
Developers can use ad Component Creation Grid Advertising component, Grid The ad component automatically pulls and displays ad data after it is created.

# Ad Size Settings

Grid 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. Plaid ads have a minimum size limit, with 5 shapes of 331px and 8 shapes of 294px.

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

<view class="adContainer">
  <ad unit-id="xxxx"  ad-type="grid" ad-theme="white" grid-count="5"></ad>
</view>

# Advertising event monitoring

Grid Ads are automatically pulled after they are created. Developers can use ad Component onload and onerror Event Monitor Ad Pull Success or Failure, Can Be Pulled Through onclose Event listening ads are turned off.

<view class="adContainer">
  <ad unit-id="xxxx"  ad-type="grid" ad-theme="white" grid-count="5" bindload="adLoad" binderror="adError" bindclose="adClose"></ad>
</view>

Page({
  adLoad() {
    console.log('Grid Ad Loaded Successfully ')
  },
  adError(err) {
    console.log('Grid The advertisement failed, err)
  },
  adClose() {
    console.log('Grid Advertisingclosed')
  }
})

# Ad Theme Style Settings

The Mini Program video advertising component provides black and white theme styles that developers can pass in when creating video ads.ad - themeParameter to implement the theme style selection,ad - themeParameter is of character string type, optionalwhite, black

<view class="adContainer">
  <ad unit-id="xxxx"  ad-type="grid" ad-theme="white"></ad>
</view>

<view class="adContainer">
  <ad unit-id="xxxx"  ad-type="grid" ad-theme="black"></ad>
</view>

# Advertising grid number setting

The Mini Program video advertising component provides black and white theme styles that developers can pass in when creating video ads.grid-countParameter to implement the theme style selection,grid-countParameter is of numeric type, parameter values are optional5, 8

<view class="adContainer">
  <ad unit-id="xxxx"  ad-type="grid" grid-count="5"></ad>
</view>

<view class="adContainer">
  <ad unit-id="xxxx"  ad-type="grid" grid-count="8"></ad>
</view>