Skip to content

Using Messenger on Desktop (legacy)

Murhaf Sousli edited this page May 31, 2024 · 1 revision

While the Messenger share button works without issues on Mobile, it won't work out of the box on desktop like the rest of the share buttons, FB requires setting special parameters in the sharer URL.

To make Messenger button work on desktop, you will need to set the appId and the redirectUrl.

Setting the appId:

You can either add the meta tag in your index.html, for example:

<head>
  <meta property="fb:app_id" content="YOUR_FB_APP_ID" />
</head>

Or using the global config:

@NgModule({
  providers: [
    {
      provide: SHARE_BUTTONS_CONFIG,
      useValue: {
        appId: 'YOUR_FB_APP_ID',
        redirectUrl: 'MESSENGER_REDIRECT_URL'
      }
    }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
}

Setting the redirectUrl:

Can be set in the global config as shown in the previous example or via component input [redirectUrl]:

<share-buttons [redirectUrl]="messengerRedirectUrl"></share-buttons>