Below, you’ll find a detailed guide on how to add the Wp Instagram Feed Awplife 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 Wp Instagram Feed Awplife Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the Wp Instagram Feed Awplife Plugin and the shortcodes it provides:
"Social Media Feed – Social Feed Gallery With API is a WordPress plugin that seamlessly integrates your Instagram feed into your website. Enhance your site's engagement with this visually stunning plugin."
- [IFG]
Wp Instagram Feed Awplife [IFG] Shortcode
The wp-instagram-feed-awplife plugin shortcode enables users to display Instagram feeds on their WordPress site. It fetches Instagram media data using an access token and creates a gallery based on user-defined attributes.
Shortcode: [IFG]
Parameters
Here is a list of all possible IFG shortcode parameters and attributes:
instagram_acces_token– The access token for Instagram API.insta_image_limit– The maximum number of images to fetch, capped at 50.insta_layout– The layout style for the Instagram feed, default is grid.insta_grid_row_l– The number of rows in the grid layout.insta_grid_columns_l– The number of columns in the grid layout.insta_icon_image– The icon image to be used in the feed.insta_image_spacing– The spacing between images, maximum is 20.insta_caption_image– The caption to display under the image.insta_link_redirection– The link to redirect to when an image is clicked.insta_lightbox– If set, a lightbox will show when an image is clicked.insta_lightbox_color– The color of the lightbox background.
Examples and Usage
Basic example – Display Instagram feed using a specific access token
[IFG instagram_acces_token="YOUR_ACCESS_TOKEN" /]Advanced examples
Display Instagram feed with a specific access token and limit the number of images shown to 10
[IFG instagram_acces_token="YOUR_ACCESS_TOKEN" insta_image_limit="10" /]Display Instagram feed in grid layout with a specific access token, limit the number of images to 10, and set the spacing between images to 5
[IFG instagram_acces_token="YOUR_ACCESS_TOKEN" insta_image_limit="10" insta_layout="insta_layout_grid" insta_image_spacing="5" /]Display Instagram feed with a specific access token, limit the number of images to 10, set the image spacing to 5, and enable the lightbox feature with a specific color
[IFG instagram_acces_token="YOUR_ACCESS_TOKEN" insta_image_limit="10" insta_image_spacing="5" insta_lightbox="true" insta_lightbox_color="#ff0000" /]Display Instagram feed with a specific access token, limit the number of images to 10, set the image spacing to 5, enable the lightbox feature with a specific color, and redirect the image link to a specific URL
[IFG instagram_acces_token="YOUR_ACCESS_TOKEN" insta_image_limit="10" insta_image_spacing="5" insta_lightbox="true" insta_lightbox_color="#ff0000" insta_link_redirection="YOUR_URL" /]PHP Function Code
In case you have difficulties debugging what causing issues with [IFG] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('IFG', 'wp_instagram_feed_shortcode');Shortcode PHP function:
function wp_instagram_feed_shortcode($atts) {
ob_start();
//js
wp_enqueue_script('jquery');
// awp custom bootstrap css
wp_enqueue_style('ifgp-bootstrap-css', IFGP_PLUGIN_URL . 'css/ifgp-bootstrap-frontend.css' );
wp_enqueue_style('ifgp-alw-style-css', IFGP_PLUGIN_URL . 'css/alw-style.css' );
wp_enqueue_style('ifgp-shortcode-css', IFGP_PLUGIN_URL . 'css/ifgp-shortcode.css' );
wp_enqueue_style('ifgp-main-css', IFGP_PLUGIN_URL . 'css/main.css' );
//Access Token
if(isset($atts['instagram_acces_token'])) $instagram_acces_token = $atts['instagram_acces_token']; else $instagram_acces_token = "";
if(isset($atts['insta_image_limit'])) $insta_image_limit = $atts['insta_image_limit']; else $insta_image_limit = "";
if($insta_image_limit > 50) $insta_image_limit = 50;
$instagram_data_decode = wp_remote_get("https://graph.instagram.com/me/media?fields=id,media_type,permalink,thumbnail_url,timestamp,media_url,caption,username,children{media_url}&access_token=$instagram_acces_token&limit=$insta_image_limit");
$instagram_response = $instagram_data_decode['response']['code'];
$instagram_data = json_decode($instagram_data_decode['body'], true);
//Gallery
if(isset($atts['insta_layout'])) $insta_layout = $atts['insta_layout']; else $insta_layout = "insta_layout_grid";
if(isset($atts['insta_grid_row_l'])) $insta_grid_row_l = $atts['insta_grid_row_l']; else $insta_grid_row_l = "";
if(isset($atts['insta_grid_columns_l'])) $insta_grid_columns_l = $atts['insta_grid_columns_l']; else $insta_grid_columns_l = "";
if(isset($atts['insta_icon_image'])) $insta_icon_image = $atts['insta_icon_image']; else $insta_icon_image = "";
if(isset($atts['insta_image_spacing'])) $insta_image_spacing = $atts['insta_image_spacing']; else $insta_image_spacing = "";
if($insta_image_spacing > 20) $insta_image_spacing = 20;
if(isset($atts['insta_caption_image'])) $insta_caption_image = $atts['insta_caption_image']; else $insta_caption_image = "";
if(isset($atts['insta_link_redirection'])) $insta_link_redirection = $atts['insta_link_redirection']; else $insta_link_redirection = "";
if(isset($atts['insta_lightbox'])) $insta_lightbox = $atts['insta_lightbox']; else $insta_lightbox = "";
if(isset($atts['insta_lightbox_color'])) $insta_lightbox_color = $atts['insta_lightbox_color']; else $insta_lightbox_color = "";
if($insta_layout == 'insta_layout_grid') {
require('layout/instagram-grid-layout-shortcode.php');
}
//Include code file
return ob_get_clean();
}
Code file location:
wp-instagram-feed-awplife/wp-instagram-feed-awplife/shortcode.phpConclusion
Now that you’ve learned how to embed the Wp Instagram Feed Awplife 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.
Leave a Reply