Skip to main content

WdOfficialAccount

Added "Official Account Follow" Component

WdOfficialAccount

Applicable Scenarios

You can configure the Official Account Follow component within Mini Programs, enabling users to quickly follow Official Accounts.

Usage Instructions

  1. Before using the component, you need to go to WeChat Official Accounts Platform and set the Official Account to be displayed under "Settings" -> "Follow Official Accounts". Note: The set Official Account must be under the same entity or a related entity as the Mini Program.
Image 933b301e8a313fc1c40191675bf1cb28
  1. Please confirm that the selected application supports mini-program-side builds. For specific operations, refer to the Create Application Guide.

  2. Add the Official Account Follow component to the editor area. This component does not require attribute configuration. After the Mini Program is published, it will directly display the Official Account bound to the WeChat Official Accounts Platform.

Image f8569f6022094b3a7f91ea7d9925c832
  1. Publish the application to the Mini Program. After scanning the QR code to enter the Mini Program, you can see that the Official Account Follow component has been successfully rendered.
Image 24ede0c1ff0911b3e58fbdb9640769dd

Component Usage Limits

  1. This component must be used in a WeChat Mini Program to see the actual effect. After publishing, scan the Mini Program QR code to preview.
  2. The Official Account Follow component is displayed only in specific scenarios. Please note to adjust the layout accordingly.
  • When the scene value of the Mini Program hits the following values, the Official Account Follow component can be displayed. View details

    • 1011 Scan QR code

    • 1017 Go to the entry page of the Mini Program trial version

    • 1025 Scan barcode

    • 1047 Scan Mini Program code

    • 1124 Scan "One Thing One Code" to open the Mini Program

  • When the hot start scene value of the Mini Program hits the following values, and the cold start scene value is among [1011, 1017, 1025, 1047, 1124], the Official Account Follow component can be displayed.

    • 1001 Discover tab Mini Program main entry, 'Recently Used' list

    • 1038 Return from another Mini Program

    • When the hot start scene value of the Mini Program hits the following values, and the cold start scene value is among [1011, 1017, 1025, 1047, 1124], the Official Account Follow component can be displayed.

    • 1089 Pull down the main chat interface of WeChat to reveal the 'Recently Used' section

    "- 1090 Long press the menu in the upper right corner of the Mini Program to bring up the recently used history"

    • 1104 Pull down the main chat interface of WeChat to reveal the 'My Mini Programs' section

    • 1131 Floating window

    • 1187 New version Floating Window, since WeChat 8.0

  1. The component has a minimum width of 300px and a fixed height of 84px. You can nest a regular container outside the Official Account Follow component and adjust its width by modifying the container's dimensions.
Image 606b32d607321151d5878f7e80be58e5
  1. Each page can only configure one such component. If multiple Official Account Follow components are configured on a single page, only the first one will be displayed.

Properties

None

Events

Events exposed by the component. You can listen to component events to trigger external actions

Event Name
Event Code
Event Output Parameters event.detail
Applicable Scenarios
Description
WeChat Official Account loads successfullyloadobject
  • status: number

    状态码

  • errMsg: string

    错误信息

Mini Program

Trigger when the WeChat Official Account loads successfully

Failed to load WeChat Official Accounterrorobject
  • status: number

    状态码

  • errMsg: string

    错误信息

Mini Program

Failed to load WeChat Official Account trigger

The status values in the output parameters have the following meanings
ValueDescription
-2Network error
-1Data parsing error
0Load successful
1Mini Program Official Account follow feature banned
2Linked Official Account banned
3Association unlinked or no linked Official Account selected
4Official Account follow feature not enabled
5Scene value error
6Duplicate creation

Method API

None

Style API

Through the Style API, you can override the styles of internal elements in components to achieve customization. For example, in the low-code editor, you can write styles for all button components using #wd-page-root .wd-btn, and control individual component styles with :scope. For detailed instructions, please refer toStyle API

Name
Class Name
Description and Examples
root element.wd-official-accountPublic account subscription component Root element
/* :scope refers to the current component element */
/* For details, refer to the Style API documentation */
:scope.wd-official-account {
  /* Write CSS styles here */
}
Mini program root element.wd-mp-official-accountWrite style for mini program component
/* :scope refers to the current component element */
/* For details, refer to the Style API documentation */
:scope.wd-mp-official-account {
  /* Write CSS styles here */
}

Learn about Style API