Adding a Meta (Facebook) Share Button to your Smart Builder Page

Follow

The Meta (previously Facebook) Share button lets your page visitors quickly and easily share links to their timeline, groups, or through Meta Messenger. 

This article explains how to add a Facebook Share button to your page, using Unbounce Apps.

Installing the Facebook Share Button App

  1. Navigate to the Apps tab on the left-hand side of Smart Builder.
  2. Search and locate the Facebook Share App.
  3. Click the plus button next to Facebook Share to install the app.
  4. You may see a dialog box that appears, explaining that you can swap an element on your page with this App:
    A pop-up on top of Smart Builder explaining that this App is swappable.

To learn more about changing elements, see our documentation: Changing Elements on your Smart Builder Page.

Once you've installed the App, you can apply it to the landing page.

Adding the Facebook Share Button to Your Page

Now that you've installed the app, you can add the Share button into Smart Builder, by replacing a current element on the page with a Facebook Share button instead. 

  1. Single-click an element on the page & click the Change Element icon. A pop-up will appear.
  2. Within the drop-down menu, locate the Social Media tab. Select Facebook Share from the list.
  3. The Facebook Share button placeholder will appear on your page:
    Gif demo of a user changing an existing element with a Facebook Share Button in Smart Builder.

Embedding a Link in the Facebook Share Button 

Next, you'll need to set up the link/URL that will be nested within the share button. So, when visitors click this button, it will redirect them to Meta where they can share the enclosed link.  

  1. Single-click the button titled Set Up Share Button
  2. Click the gear icon to launch the Facebook Share Settings.
  3. In the black field beneath Share Page URL, type or paste in the page link you want visitors to share on Meta:
    The unbounce.com URL in the blank field within the Facebook Share Settings pop-up window.

Note:

Be sure to include http or https at the start of the link.

  1. Adjust the Button Size (small or large):
    • Small: 71 x 20 pixels, or
    • Large: 80 x 28 pixels.
  2. Update the Layout options.  
    • The Layout options refer to how you want the button to appear and with what information to include. For example, do you want a count highlighting how often the link is shared? Here are the different layout options:
      Gif demo of the different layout options for the Facebook Share Button.
    • To test the different layout options, select a layout option from the list, and click Apply
  3. Click Apply to complete the changes.

That's it! Be sure to Save & Publish your page. 

To test out the button, navigate to the Preview mode of Smart Builder.

The button will redirect you and your page visitors to the Meta (Facebook) sign-in page. Once signed in, you can share the link with your network: Gif demo of a user clicking the Facebook Share Button, and being redirected to Facebook's (Meta's) log-in page.


Do you agree or disagree with this statement: This article helped me find the information I needed quickly and easily.

Select an option and leave us some feedback in the comments:

Strongly DisagreeDisagreeSomewhat DisagreeUndecidedSomewhat AgreeAgreeStrongly Agree

Measuring Customer Effort Score with Nicereply