Widget for Social Page Feeds Shortcode

Below, you’ll find a detailed guide on how to add the Widget for Social Page Feeds Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Widget for Social Page Feeds Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the Widget for Social Page Feeds Plugin and the shortcodes it provides:

Plugin Icon
Widget for Social Page Feeds

"Widget for Social Page Feeds is a WordPress plugin that simplifies integration of your social media pages. It creates easy-to-use widgets for displaying Facebook page likes and feeds on your website."

★★★★☆ (380) Active Installs: 80000+ Tested with: 6.2.3 PHP Version: false
Included Shortcodes:
  • [fb_widget]

Widget for Social Page Feeds [fb_widget] Shortcode

The Facebook Page Like Widget shortcode allows you to embed a Facebook page on your WordPress website. Shortcode Name: add_shortcode(‘fb_widget’, ‘fb_plugin_shortcode’) This shortcode takes various parameters, such as the Facebook URL, app ID, widget dimensions, and display settings. It then generates the necessary HTML to display the Facebook page, complete with a like button. The shortcode also enqueues a JavaScript file that handles the widget’s functionality.

Shortcode: [fb_widget]

Parameters

Here is a list of all possible fb_widget shortcode parameters and attributes:

  • title – Sets the title displayed above the widget.
  • app_id – The unique identifier for your Facebook application.
  • fb_url – The URL of the Facebook page you want to display.
  • width – Adjusts the width of the widget in pixels.
  • height – Adjusts the height of the widget in pixels.
  • data_small_header – If set to true, it displays a smaller header.
  • select_lng – Sets the language for the Facebook plugin.
  • data_adapt_container_width – If true, the plugin adapts to its container’s width.
  • data_hide_cover – If true, it hides the cover photo in the header.
  • data_show_facepile – If true, it displays profile photos when friends like this.
  • custom_css – Allows you to apply custom CSS styles to the widget.
  • data_tabs – Defines which sections of the page to show (e.g., timeline, events).
  • data_lazy – If true, it enables lazy-loading of the plugin.

Examples and Usage

Basic example – A simple usage of the shortcode to display a Facebook page like widget on your website.

[fb_widget /]

Advanced examples

Displaying a Facebook page like widget with a custom title, width, and height. This example also shows how to hide the page cover photo and display the facepile of the people who have liked your page.

[fb_widget title="Follow us on Facebook" width="500" height="600" data_hide_cover="true" data_show_facepile="true" /]

Using the shortcode to display a Facebook page like widget with custom app ID and Facebook URL. This example also shows how to adapt the container width, display the timeline tab, and enable lazy loading.

[fb_widget app_id="1234567890" fb_url="http://facebook.com/YourPageName" data_adapt_container_width="true" data_tabs="timeline" data_lazy="true" /]

Using the shortcode to display a Facebook page like widget with custom CSS. This example also shows how to change the language of the widget.

[fb_widget custom_css="background-color: #f5f5f5; border-radius: 5px;" select_lng="fr_FR" /]

PHP Function Code

In case you have difficulties debugging what causing issues with [fb_widget] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode('fb_widget', 'fb_plugin_shortcode');

Shortcode PHP function:

function fb_plugin_shortcode($atts, $content = null) {

	$atts = shortcode_atts(array('title' => 'Like Us On Facebook', 'app_id' => '503595753002055', 'fb_url' => 'http://facebook.com/WordPress', 'width' => '400', 'height' => '500', 'data_small_header' => 'false', 'select_lng' => 'en_US', 'data_small_header' => 'false', 'data_adapt_container_width' => 'true', 'data_hide_cover' => 'false', 'data_show_facepile' => 'true', 'custom_css' => '', 'data_tabs' => 'timeline', 'data_lazy'=> 'false'), $atts, 'fb_widget');
	
	wp_register_script('milapfbwidgetscriptsc', FB_WIDGET_PLUGIN_URL . 'fb_sc.js', array('jquery'));
	wp_enqueue_script('milapfbwidgetscriptsc');
	
	$local_variables = array('app_id' => esc_html($atts['app_id']), 'select_lng' => esc_html($atts['select_lng']));
	
	wp_localize_script('milapfbwidgetscriptsc', 'milapfbwidgetvarssc', $local_variables);
	
	$feeds = '<div class="fb_loader" style="text-align: center !important;"><img src="' . plugins_url() . '/facebook-pagelike-widget/loader.gif" /></div><div id="fb-root"></div><div style="display:inherit;" class="fb-page" data-href="' . esc_html($atts['fb_url']) . '" data-width="' . esc_html($atts['width']) . '" data-height="' . esc_html($atts['height']) . '" data-small-header="' . esc_html($atts['data_small_header']) . '" data-adapt-container-width="' . esc_html($atts['data_adapt_container_width']) . '" data-hide-cover="' . esc_html($atts['data_hide_cover']) . '" data-show-facepile="' . esc_html($atts['data_show_facepile']) . '" style="' . esc_html($atts['custom_css']) . '" data-tabs="'. esc_html($atts['data_tabs']) .'" data-lazy="'.esc_html($atts['data_lazy']).'"></div>';

	return $feeds;
}

Code file location:

facebook-pagelike-widget/facebook-pagelike-widget/short_code.php

Conclusion

Now that you’ve learned how to embed the Widget for Social Page Feeds Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *