Facebook button documentation

  • Tony
  • 8 April 2020
  • No comments
  • Docs
Get the ultimate Facebook widgets pack to help you grow your social media presence. See how Facebook button can be designed beautifully on Demo Page.

# Facebook button Package contents

Files Description
jlfacebookbutton.yaml Contains the Facebook button particle settings.
jlfacebookbutton.html.twig The Twig file to pull information, settings.

Installation Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Requirements Facebook Button requires Uikit 3 for Gantry 5 Atom to be installed and enabled in your theme layout settings.

Go to Template/Theme Settings > select the Layout to add Facebook button particle (i.e: Home) -> Layout tab -> Drag and drop the Facebook button Particle from Particles panel (left corner) to the section you want to display the particle.

Settings

Settings Description
URL The absolute URL of the page that will be liked.
Layout Settings Select the list style and add larger padding between items.
Action Type Can be either like or recommend.
Show Friends’ Face Specifies whether to display profile photos below the button. This option won’t have any effect unless the Layout Settings is set to Standard.
Button Size Set the button size.
Share Button Include share button.
Color Scheme The color scheme used by the plugin for any text outside of the button itself.
Width The width of the plugin, which is subject to the minimum and default width. This option won’t have any effect unless the Layout Settings is set to Standard.
Locales and Languages Languages on Facebook use the format ll_CC, where ll is a two-letter language code, and CC is a two-letter country code. For instance, en_US represents U.S.
CSS Classes CSS class name for the particle.

You can change the language of the Like Button by loading a localized version of the Facebook JavaScript SDK. When you load the SDK, change the value of js.src to use your locale.

Replace en_US with your locale, e.g: fr_FR for French (France). Learn more about Localization

General, Parallax and Parallax Background tab

Please take a look the documentation here for more detail about these tabs settings

Comments

Leave a Reply

You must be logged in to post a comment.