mageplaza/module-facebook-plugin 1.0.1

Magento 2 Facebook Plugin Extension

Type

magento2-module

License

proprietary

Requires
Requires (dev)

None

Suggests

None

Provides

None

Conflicts

None

Replaces

None

Magento 2 Facebook Plugin Extension

Facebook Plugin by Mageplaza helps stores to integrate Facebook page into the shopping sites. This extension creates the convenience for customers to access stores’ information as well as contact stores easily. As a result, the number of followers to the Fan page increases significantly and the conversion rate rises accordingly.

1. Documentation

2. FAQ

Q: I got error: Mageplaza_Core has been already defined

A: Read solution here.

Q: I would like to locate our Fanpage on any places on the sites. Is it possible?

A: Yes. Please create Facebook Widget from Block section from the backend, then embed it on any CMS page or block.

Q: Which tabs can I add to Facebook Plugin on site?

A: The tabs can be selected to display including: Timeline, Event and Messages

Q: Can our customers like or share our Fanpage?

A: Yes, absolutely. Like button will display automatically. Share is one type of Call to Action buttons which you can turn on/ turn off from the admin backend. However, please make sure that Share button is already configured in your Fanpage.

Q: I want to add comment box on Product Page so our customers to leave questions. How can I do?

A: You should enable Facebook comment from the admin backend so that Comment Tab will display on Product Page. Customers will login their Facebook account to leave their questions or feedback easily. Note that this extension is properly compatible with Social Login extension.

Q: Can I adjust the size of Facebook Plugin to suit my store size?

A: Yes, definitely. From the backend, please set width and height for the plugin.

3. How to install Facebook Plugin extension for Magento 2

Install via composer (recommend)

Run the following command in Magento 2 root folder:

composer require mageplaza/module-facebook-plugin
php bin/magento setup:upgrade
php bin/magento setup:static-content:deploy

4. Highlight Features

Integrate Facebook information into store website

facebook login 1

Mageplaza Facebook Extension enables the admin to add tabs on Facebook Page on store website with 3 options: Timeline, Event and Messages. By embedding Facebook Feed on your website, the store owner can display all the latest updates on Timeline, Event, Messages to customers visiting their site.

Each of these 3 tabs takes a specific function: - Timeline tab for all latest news on products and history - Event tab for upcoming events - Messages tab for interacting between store’s admin and visitors.

Easily leave Facebook Comment

facebook login 2

Magento 2 Facebook Module allows the customer to leave their comment with ease, right on the website’s product page. Right here customers can post their feedback, questions about the product which they are interested in, by using their own Facebook account. This extension is really supportive to the store’s admin, which allows customers who left comments to get Facebook notifications right when the admin respond.

More amazing, any other visitors can easily see already-answered questions and feedbacks to get more information about the product. It is undeniable that a product page with feedbacks and comments of many customers is likely to be trusted by new visitors. They will feel that the site is well interacting and have tendency to spend more time finding out about the product.

Additionally, the store owner can swiftly manage comments on Facebook by Facebook apps.

Enable Call-to-action button

facebook login3

To optimize digital advertising, Facebook Extension allows adding Call-to-action button. The button’s name is based on the configuration on Facebook (according to particular campaigns). The possible buttons are Share, Call Now, Register Now, or Watch Video. Call-to-action button plays an indispensable role in motivating visitors to take further interaction, which can turn them into real customers. This will significantly contribute to the store revenue.

Customizable Interface

facebook login4

The design of Facebook Plugin can be set from the backend. The elements which are possible to customize are: width, height, header. Admin can select to enable/disable cover photo, profile photo and call-to-action button as well.

5. More Features

Comments number limitation

Admin can limit the number of comments which are displayed by Facebook Plugin.

Insert snippet code to any CMS

Embed snippet code to any CMS block and CMS page on website easily.

Mobile-friendliness

Facebook Plugin can work well on both Mobile and PC version.

Extension compatibility

Customers can access Facebook Plugin with Mageplaza Social Login Extension. This plugin is compatible with almost third-party module as well

6. Full Feature Lists

For store owners

  • Enable/disable the plugin
  • Select the section to be displayed: Timeline, Events and Messages
  • Customize width, height for the plugin
  • Add Facebook URL, copy/paste Facebook App ID
  • Show/hide the cover photo, profile photo, call-to-action button
  • Enable/disable small headers
  • Embed snippet code to CMS pages of CMS blocks
  • Enable/disable/limit Facebook comments
  • Set title and width for Comment tab

For shoppers

  • View timeline of a store’s Fanpage right on the store site
  • See the Facebook timeline of a store right on the website
  • Get updates of the store’s upcoming Facebook event while visiting the site
  • Swiftly communicate with the administrator/ other visitors via Facebook login
  • Be noticed right when getting responses from posted comments/ feedbacks

7. User Guide

Configuration

To start the configuration, from the Admin Panel, make your way to Stores > Configuration > Mageplaza Extensions > Facebook Plugin > Configuration

facebook login5

7.1 General configuration

facebook login6

  • Enable: Select Yes to enable the module
  • Facebook App ID
    • Input App ID which allows admin to manage Facebook comment on Product Page
    • This field is not allowed to leave blank

Facebook Plugin

facebook login7

  • Enable: Select Yes to embed the Facebook Page to Widget

  • Facebook URL

    • Insert URL of the Facebook Page
    • Be valid with public page
  • Tabs

    • Select tabs which is displayed on Facebook page on site
    • 3 options: Default tab is Timeline
  • Width

    • Set the width for the Facebook container
    • Default width is 500 px
    • Min. of Length is 70 px
  • Hide cover photo

    • Select Yes to hide Facebook cover photo
    • Default value is No
  • Show profile photo: Select Yes to show profile photo of friends who clicked Like button on Facebook

  • Hide the custom Call to Action: Select Yes to hide Call to Action button on Facebook (if this button is available on page). For example, Book Now, Call Now, Send Email. If select No, the button will be hidden.

  • Small header

    • Select Yes to display the header with small size
    • Call to Action button will be hidden
  • Adapt width

    • Select Yes to adjust Facebook container’s width automatically
    • Default is Yes
  • Snippet Code

    • XML File: Copy and paste the code to file format .xml where you want to display Facebook page on the frontend
    • CMS Page, CMS Static Block: Copy and paste the code to the page you want to display Facebook page outside the frontend
    • Template .phtml file: Copy and paste the code to file template .phtml where you want to display Facebook page outside the frontend

Facebook Comment

facebook login8

  • Enable: Select Yes to enable Facebook Comment function on Product Page

  • Title:

    • Set title for Comment tab
    • Default title is Facebook Comment
  • Width

    • Set the width for Comment section container
    • The min. is 320px
  • Number of posts

    • Set the number of posts to be displayed on
    • The minimum number is 1

7.2. Widget

Add Widget

Step 1: Select the Type

  • On the Admin Panel, go to Content > Elements > Widgets
  • In the upper-right corner of Widgets workplace, click on Add Widget button
  • In the Settings section

    • Choose CMS Static Block type in the Type box.
    • Choose the current theme you are applying in the Design Theme.
    • Click Continue button.

    facebook login9

Step 2: Complete the Storefront Properties section

In the Storefront Properties section, - Enter Widget Title for the internal reference. - Assign the block to all store views in the Assign to Store View field or to any store view you want to apply the block. - Set the Sort Order if many blocks are placed at the same container. The block is at the top if the inserted value is zero.

facebook login10

In the Layout Updates section, click on Layout Update to set the layout.

  • Choose the category, product, or page where shows the block in the Display on field.
  • If set to a specific page, you need to choose Page you want to the block to display and set Container that is the position of the page the block appears.

facebook login11

Step 3: Configure Widget Options to display Facebook Page

  • Facebook Widget options

facebook login12

  • Facebook Widget options = Use Config: Use configuration set in Configuration section
  • Facebook Widget options = Custom: Admin customizes configuration

facebook login13

  • Facebook URL

    • Insert URL of the Facebook Page
    • Be valid with public page
  • Tabs

    • Select tabs which is displayed on Facebook page on site
    • 3 options: Timeline, Event, Messages
    • Default tab is Timeline
  • Width

    • Set the width for the Facebook container
    • Default width is 500 px
    • Min. of Length is 70 px
  • Hide cover photo

    • Select Yes to hide Facebook cover photo
    • Default value is No
  • Show profile photo: Select Yes to show profile photo of friends who clicked “Like” button on Facebook

  • Hide the custom Call to Action: Select Yes to hide Call to Action button on Facebook ( if this button is available on page). For example, Book Now, Call Now, Send Email. If select No, the button will be hidden.

  • Small header

    • Select Yes to display the header with small size
    • Call to Action button will be hidden
  • Adapt width

    • Select Yes to adjust Facebook container’s width automatically
    • Default is Yes
  • Snippet Code

    • XML File: Copy and paste the code to file format .xml where you want to display Facebook page on the frontend
    • CMS Page, CMS Static Block: Copy and paste the code to the page you want to display Facebook page outside the frontend
    • Template .phtml file: Copy and paste the code to file template .phtml where you want to display Facebook page outside the frontend

7.3. Frontend

  • Display Facebook Page

facebook login14

  • Display Facebook Comment on Product Page

facebook login15

  • Manage comments on Facebook App

facebook login16