Beschreibung

WordPress WD Instagram Feed
Demo
User Guide
Support Forum

Are you looking for a free Instagram feed plugin for WordPress ? Do you want to show Instagram posts, photos and images on your WordPress website? Do you want a simple integration, responsive Instagram gallery, beautiful and custom-styled feeds?
Instagram Feed WD is the best Instagram plugin for WordPress to go with. It is a simple Instagram plugin that comes with a user-friendly management and easy setup, and lets you embed custom Instagram feeds of hashtags and users to your website in just a couple of minutes. You can embed Instagram galleries and entire timelines to your posts using a shortcode or using the plugin’s Instagram widget on your sidebar. You don’t need to install Instagram widget, or add any Instagram code. 0ur plugin comes with a free Instagram widget letting you display Instagram social feeds, photos, images as well as Instagram video feeds.

It’s fully customizable and the most feature-packed simple Instagram feed plugin for WordPress . It’s a simple WordPress plugin for Instagram designed for users who want to bring this widely popular social network to their websites and share Instagram pics with their visitors.

Instagram Feed WD allows displaying custom feeds based on public Instagram accounts and hashtags. You can create mixed feeds based on multiple accounts, multiple hashtags or any combination of both with the Pro version. This WordPress Instagram plugin uses 4 layouts – 2 layouts for smaller thumbnail display (Thumbnail and Masonry views) and 2 for larger images (Blog Style and Image Browser views). Thumbnail view displays images with their metadata (Pro): caption, number of likes and comments. Image Browser displays single image with navigation possibility, metadata (Pro): image caption, number of likes and comments. Masonry layout (Pro) displays images in beautiful Instagram masonry view combining the image and its metadata (Pro). Blog Style layout (Pro)combines large image with its data similar creating a blog style display. All the layouts can display feed username and its metadata (bio, number of posts and followers).Also the plugin supports Instagram grid view which will give a distinct style to your website. It would be a perfect fit for photography websites, and for users who want to showcase beautiful Instagram galleries ,latest images and videos in their posts and pages.

Use Conditional Filters to display filtered feeds (Pro). This feature will let you filter out images and photos from the feeds based on the conditions you specify. Setting a filter is simple.Set up a filter logic (to hide or display posts), choose condition type (username, hashtag, mention,description, Instagram media link), fill in the condition and display filtered feeds. Feeds can have multiple filters. It’s a great way to show only those Instagram posts and images that your visitors would like to scroll through.

Images can be redirected to Instagram page or opened in a lightbox. You can set sorting for the images (date, likes, comments, random) as well as define the order (ascending/descending). In case of combined feeds you can use front-end filtering by clicking on specific hashtag or username. The lightbox displays Instagram pictures as a slideshow with different transition effects (Pro). In the Pro version of the plugin its Instagram lightbox also supports media caption, comments, social share buttons and filmstrip,making it an elegant advanced tool for viewing Instagram feed.

Theme section (available with Pro version) allows to customize colors, sizes and display styles. Each layout uses its own theme which makes this section even more compelling.

The plugin is responsive and scales perfectly for mobile Instagram users.

No feed data is stored in the database. All the images, videos (Pro), captions and comments are retrieved directly from the Instagram in the front-end, which makes this WordPress Instagram gallery plugin fast and very easy to use.

IMPORTANT:

If you think you found a bug in Instagram Feed WD or wonder how to add Instagram to your website, or how to get Instagram plugin up and running, please check out Support Forum . Additional information on how to download Instagram plugin to your website you can find in our user manual If you do not find a solution in the forum, do not hesitate to click here to contact us.

Instagram Feed main features include:

• Responsive Instagram feeds
• SEO-friendly
• Unlimited Instagram feeds
• Hashtag-based Instagram feed
• Instagram account-based feed
• Instagram User meta data (image, bio, followers and posts number) display
• Thumbnail Layout Instagram feeds
• Image Browser Layout Instagram feeds
• Sorting by options
• Load More and pagination options for Instagram feeds
• Elegant lightbox with media captions
• 1 Lightbox transition effect
• Instagram icon for redirecting to Instagram account/Instagram hashtag feed
• Simple Instagram WordPress shortcode
• Instagram WD PHP shortcode support
• Instagram redirection possibility
• Instagram Feed WD Widget
• Original Instagram Image download

Upgrade to Instagram Feed Pro to add features:

• Masonry Layout Instagram feeds
• Blog Style Layout Instagram feeds
• Image meta data (Instagram tag,image caption, comments, like) display
• Mixed and multiple feeds (several Instagram hashtags and Instagram public accounts)
• Fully Customizable Themes
• Vertical/horizontal filmstrip in lightbox
• HTML5 Video Support in Lightbox, Blog Style and Image Browser views for displaying Instagram videos
• 15 Lightbox transition effects
• Social sharing buttons (Facebook, Twitter, Google+, LinkedIn and Pinterest)
• Infinite scroll for the feed (Similar to Instagram standard)
• Instagram Comments display in Lightbox
• Instagram Hashtag/ Instagram User account filtering options
• Conditional Filters

Instagram Feed WD User Manual

Installation

Here are two ways of installing Instagram Feed WD: via WordPress backend and via FTP. Let’s discuss each case individually:

Installing via WordPress
Login to the WordPress Administrator Panel.
Go to Plugins> Add New>Upload.
Click Choose file button and select the zip folder of Instagram Feed WD plugin and press Install now button.
Click Activate button.

Installing via FTP
Login to your hosting space via an FTP software, e.g. FileZilla.
Unzip the downloaded Instagram Feed WD plugin folder without making any changes to the folder.
Upload the Instagram plugin into the following location wp-content>wp-plugins.
Login to the WordPress Administrator Panel.
Activate Instagram Feed WD by going to Plugins and pressing Activate button.

Getting Instagram Access Token

In this section you can add FAQs.

To start using Instagram Feed you will be required to first fill in Settings section. Go to Instagram Feed>Settings tab. Press Sign in with Instagram. Pressing the button Access Token and Username will be automatically generated for the current logged-in Instagram account (if user is not logged-in, a popup offering to sign in to Instagram will appear).

Reset access token and username button resets default user data in plugin. Use that button to get access token for other Instagram user.

Creating an Instagram Feed

Creating a responsive Instagram feed is simple and easy with this user-friendly Instagram importer plugin.Go to Instagram Feed WD > Feed and press Add New. Here you can choose Instagram feed layout and manage lightbox options.From the lightbox options you can enable filmstrip, slideshow, and take full control how custom feed images, image galleries,pictures,Instagram gallery, and videos of this social network are displayed within the lightbox. You can enable autoplay to play photos and Instagram group images similar to an image slider. To get an Instagram slider appearance in the lightbox you’ll need to adjust the lightbox and image display settings.Lightbox works great with Instagram touch.The feed will be automatically updated once users share Instagram new images.The feeds support new Instagram carousel feature, and display the images of the responsive carousel.

Create an Instagram feed based on one of the available layouts- Thumbnail, Masonry, Blog Style, Image Browser.

Thumbnails and Masonry Layouts

Since Thumbnails and Masonry Layout Instagram Feeds use identical set of properties we will discuss them jointly. When using Thumbnail view, which is almost the same as grid Instagram view, images get identical dimensions, whereas with Masonry view Instagram images and their properties (description, caption, hashtags) get displayed as a masonry feed. This is the option to display Instagram grids for WordPress powered websites.Feed Name. Provide a title for the Instagram feed. It will be useful to provide unique title since you will need it when inserting the Instagram feed or timeline into a page or post.
Theme. Select one of the existing themes for the Instagram feed. All theme styling parameters will be applied.
Feed Usernames and Hashtags. Provide all Instagram usernames and hashtags of the Instagram page you want to use within the Instagram feed. All all them using add button. Instagram Usernames should be provided within the following format: “webdorado”, whereas for Instagram hashtags you need to use the following format: #webdorado.
Featured Image. One of the Instagram user avatars can be used as a featured image, select the relevant Instagram user in case you have more than one image. If you use Instagram hashtag feeds, you can set hashtag image as featured image.
Feed Display Type. Select the pagination style.
Pagination. Uses standard pagination with “next” and “previous” buttons with the styles set in corresponding theme.
Load More. Loads specified number of images with Load More button. You can specify the number of image for further loads.
Infinite Scroll. Uses Instagram standard. Images are being loaded as you scroll.
Sort Images By. Choosing sorting option for the feed.
Date- based on the date when images are uploaded to Instagram
Likes- number of Instagram likes
Comments- number of Instagram comments
Random- randomizes displayed Instagram images.
Order By. Choose between ascending and descending options.
Follow on Instagram Button. Choose whether to display follow button next to Instagram usernames or not.

Display Header. Displays featured Instagram image and feed title.
Number of Photos to Display. Define the number of Instagram images which will be displayed before using loading/pagination options.
Number of Photos to Load. Define the number of images which will be displayed with each Instagram Feed load/page.
Number of Columns. Set a default number of image columns.
Resort After Loading New Images(Load More and Infinite Scroll only). If this option is disabled, only newly loaded images will be sorted according to the value of Sort Images By field. If enabled, both newly loaded and already shown images will be resorted together.
Show Likes. Choose whether to display the number of Instagram likes or not.
Show Description. Check to display image descriptions.
Show Comments. Check to display image Instagram comments.
Show User info. Check to display a block with Instagram user information (username, profile image, etc.).
Display User Bio. Check to display Instagram account-related bio.
Display User Posts and Followers count. Check to display the number of Instagram posts and follower for each used Instagram account.
Disable Mobile Layout. If you disable mobile layout the images will be displayed with defined number of columns regardless of the device in use. Otherwise the feed column number will be decreased for the smaller screen devices.
Image Onclick. Select the action type when hitting the Instagram image. It can be redirected to Instagram (Instagram app for mobile Instagram users) or opened with a lightbox.

Blog Style Layout

Blog style layout is a perfect option if you want to post in Instagram and repost the content to WordPress website as a photography blog.With this Instagram HTML plugin the images get displayed with larger dimension with their captions, descriptions and Instagram hashtags below .
Feed Name. Provide a title for the Instagram feed. It will be useful to provide unique title since you will need it when inserting the feed within a page or post.
Theme. Select one of the existing themes for the feed. All theme styling parameters will be applied.
Feed Usernames and Hashtags. Provide all Instagram usernames and Instagram hashtags you want to use within the feed. All all them using add button. Usernames should be provided within the following format: “webdorado”, whereas for hashtags you need to use the following format: #webdorado.
Featured Image. One of the Instagram user avatars can be used as a featured image, select the relevant user in case you have more than one image. If you use hashtag feeds, you can set hashtag image as featured image.
Feed Display Type. Select the pagination style.
Pagination. Uses standard pagination with the styles set in corresponding theme.
Load More. Loads specified number of images with Load More button. You can specify the number of images for further loads.
Infinite Scroll. Uses Instagram standard. Images gets loaded as you scroll.
Sort Images By. Choosing sorting option for the feed.
Date- based on the date when images are uploaded to Instagram
Likes- number of Instagram likes
Comments- number of Instagram comments
Random- randomizes displayed Instagram images.
Order By. Choose between ascending and descending options.
Follow on Instagram Button. Choose whether to display follow button next to Instagram usernames or not.
Display Header. Displays featured image and feed title.
Number of Photos to Display. Define the number of images which will be displayed before using loading/pagination options.
Number of Photos to Load. Define the number of Instagram wall photos which will be displayed with each load/page.
Resort After Loading New Images (Load More and Infinite Scroll only). If this option is disabled, only newly loaded images will be sorted according to the value of Sort Images By field. If enabled, both newly loaded and already shown images will be resorted together.
Show Likes. Choose whether to display the number of Instagram likes or not.
Show Description. Check to display image descriptions.
Show Comments. Check to display Instagram image comments.
Show User info. Check to display a block with Instagram user information (username, profile image, etc.).
Display User Bio. Check to display Instagram account-related bio.
Display User Posts and Followers count. Check to display the number of Instagram posts and follower for each used Instagram account.
Image Onclick. Select the action type when hitting the image. It can be redirected to Instagram (Instagram app for website) or opened with a lightbox.

Image Browser

Image Browser displays a single large Instagram image with navigation buttons. You can display image properties below or above the image.

Feed Name.Provide a title for the Instagram feed. It will be useful to provide unique title since you will need it when inserting the feed within a page or post.
Theme. Select one of the existing themes for the Instagram feed. All theme styling parameters will be applied.
Feed Usernames and Hashtags. Provide all Instagram usernames and Instagram hashtags you want to use within the feed. All all them using add button. Usernames should be provided within the following format: “webdorado”, whereas for hashtags you need to use the following format: #webdorado.
Featured Image. One of the Instagram user avatars can be used as a featured image, select the relevant Instagram user in case you have more than one image.If you use hashtag feeds, you can set hashtag image as featured image.
Sort Images By. Choosing sorting option for the feed.
Date- based on the date when images are uploaded to Instagram
Likes- number of Instagram likes
Comments- number of Instagram comments
Random- randomizes displayed Instagram images.
Order By. Choose between ascending and descending options.
Follow on Instagram Button. Choose whether to display follow button next to social media Instagram usernames or not.

Display Header. Displays featured image and feed title.
Number of Images To Preload. Define the number of images which will be preloaded for this view.
Number of Images To Load Each Time. Define the number of images to be loaded after the first load.
Show Likes. Choose whether to display the number of Instagram likes or not.
Show Description. Check to display image descriptions.
Show Comments. Check to display image Instagram comments.
Show User info. Check to display a block with Instagram user information (username, profile image, etc.).
Display User Bio. Check to display Instagram account-related bio.
Display User Posts and Followers count. Check to display the number of Instagram posts and follower for each used Instagram account.
Image Onclick. Select the action type when hitting the image. It can be redirected to Instagram or opened with a lightbox.

Einstellungen Lightbox

Note: Lightbox shows only already loaded Instagram images. For viewing entire feeds of Instagram on website, you need to load all beautiful Instagram pictures and photos included within the Instagram Feed.

Full width lightbox. Check to enable full width button.
Lightbox Width. Set the lightbox width. Note that it will be used for the entire display, thus when you press to view the comment image will be resized to fit this width.
Lightbox Height. Set the lightbox height.
Lightbox Effect. Select a lightbox Instagram slide transition effect. Each lightbox can use only one effect. Or choose random to display random effect for every transition.
Lightbox autoplay. Choose whether use slideshow autoplay or not. If you decide not to use, you can instead set up control buttons.
Time Interval. Define the time interval between each slide when autoplay is turned on.
Enable filmstrip in lightbox. Choose whether to enable filmstrip within the lightbox or not. Filmstrip alignment and styling can be edited in Themes section.
Filmstrip size. Define the filmstrip height/width (depending whether you have horizontal or vertical view, the stated dimension will be applied to one property only).
Show Next / Previous Buttons. Choose whether to display Next/Previous buttons for the slideshow or not.
Display info by default. Choose whether to display image/video caption,Instagram tag, and author profile by default or not.
Full width info. Enable the option to display image/video information within entire width of the lightbox otherwise it will be displayed based on the image container width.
Enable Loop. When loop is enabled the user the slideshow will continue to the first image/video when pressing Next button.
Enable Right Click Protection. When enabled user will not be able to Save images or videos using Right-click and pressing Save as button.
Enable control buttons. Enable to display Play,Full Width, Instagram Comments and other buttons within lightbox.
Enable info button. Enable to allow the user to read image metadata (caption and hashtags) when clicking on the button.
Enable fullscreen. Enable button to display Instagram images in fullscreen mode.
Enable comments. Enable a button to show or hide Instagram comments.
Enable Original Image Display Button. Shows a link to the original Instagram post opened in the new window.
Enable Download Button. Enable direct image/video download from lightbox.
Enable Share Buttons. Enable social sharing buttons (Google+, Twitter, Facebook, Pinterest).

Publishing in a Page/Post

To import the created Instagram responsive feeds to a page or post you should use the shortcode. Open the page/post from the back end. Press on the Add Instagram Feed button within the editor. Then select the Instagram feed and press Insert button. You can also embed Instagram feeds to your posts or pages with an easier option. An alternative will be copying the shortcode from Instagram Feed WD> Feeds toolbar and pasting it within post/page. For non tech Instagram feed users this is a go-to option.CONDITIONAL FILTERS Conditional filters are used in cases if you want to insert filtered feeds of certain user(s) or hashtag(s). Conditional filters can be used for both displaying or skipping certain images. Filters are also applicable to mixed feeds. This is a a good way to display Instagram stream content that your users are most interested in to scroll through.
Enable Conditional Filters. Enabling the option you will be able to add condition to the feed.Source of filtering. When creating a feed you provide username(s) and/or hashtag(s). All provided usernames and/or hashtags will be used as initial source. Filters will be applied to feed generated on this selection.Filter Logic. Filter logic allows displaying one of the options:
And – Displays Instagram posts which correspond to all filters. Or – Displays Instagram posts which correspond to at least one of the filters.Nor – Hides Instagram posts which correspond to at least one of the filters. Add Condition. Write your condition, select condition type and click on Add New Condition. You can add as many conditions as you want repeating the process. You can add different condition types mixed together as well. Condition might be username (use @ before the username), hashtag (use # before the keyword), text or link (provide full URL) depending on condition type. Let’s discuss each condition type separately:
Username. Useful when you have a feed based on hashtags. It will allow displaying feeds of only certain accounts using that hashtag. Let’s consider you have #panda and #animal hashtags, you can set @natgeo and @instapandacool to display images from these two accounts. Hashtag. Useful when you have a feed based on usernames. It will allow displaying feeds using only certain hashtag, e.g. if you have @bmw and @instacars as users and want to display only posts containing #bmw hashtag. Mention. This can be used both in cases of hashtag and usernames, e.g. displaying posts where @moby is mentioned. Description. This can be used both with hashtags and usernames. This can be a single keyword or word combination which should be used within the Instagram post description. Instagram Media Link. This is the shareable link of the Instagram post. The entire URL should be used for serving as a filter.Result. Here you will see all of the added filters which will be applied to your feed.This feature is widely used on Instagram for eCommerce websites, as it serves like an Instagram feed with analytics.

Publishing as a Widget

Go to Appearance > Widgets toolbar.

Find Instagram Feed WD widget and assign it to a custom widget position on your site’s sidebar. Fill in the details below:

Title. Provide a title for your Instagram Feed.
Feed. Select the Instagram social feed which will be displayed as a widget.
Number of Columns. Set the number of Instagram image columns (for thumbnail and masonry view).
Number of images to display. Set a constant number of Instagram images which will be displayed with widget.
Show Likes and Comments. Check the box to display Instagram likes and comments below view thumbnails.You can display Instagram widgets to as many widget areas as your theme supports.

Publishing by PHP function

It is also possible to insert the created Instagram feeds into the theme by calling it with PHP function. This feature is commonly used for adding the code to header.php for displaying Instagram feeds within header or footer position of the website. You can find the function located in Instagram Feed>Feeds section under PHP function column.

Styling with Themes

By default Instagram Feed WD comes with two default themes- Instagram and Elegant. You can use one of them or create your own theme. Newly created theme will be based on Default theme.

General. Here you can add an Instagram theme title, change feed container and feed wrapper colors and styles.
Feed Header. Edit styling of feed header(Instagram feed title and Instagram feed thumbnail)
User data. Edit colors and styles of elements in Instagram users/hashtags section: Instagram usernames, profile images, bio text, number of posts and followers, follow button.
Pagination. Change Load More button and Next/Previous button colors and styles. This does not apply to Instagram-like infinite load.
Thumbnails. Edit standard Instagram thumbnail styles, Instagram image wrapper styles, image metadata styles, Instagram comments and likes styles.
Masonry. Edit masonry view thumbnail styles, Instagram image wrapper styles, image metadata styles, Instagram comments and likes styles.
Blog Style. Change blog view thumbnail and wrapper styles, Instagram image caption colors, comments and likes styles.
Image Browser. Change Image Browser image and wrapper styles, Instagram image caption colors, comments and likes styles.

Advanced customizing options

Instagram Feed WD comes with detailed themes section, but if you want to make specific style changes you can also use
Custom CSS field located in Instagram Feed> Settings.
Custom Javascript can be found within the same location of Instagram WD.

A Custom Javascript event is available for scripts to run after all Instagram feed images are loaded.
Suppose you have feed with thumbnails view and besides displaying your feed you want to open up captions for some photos. You can achieve this by assigning our custom wdi_feed_loaded event to feed container and set callback function for that event.
Here is quick example how to open up captions for images with 0,1,2,3 indexes.
jQuery(‚#wdi_feed_0‘).on(‚wdi_feed_loaded‘,function(){
jQuery(‚.wdi_photo_title‘).eq(0).trigger(‚click‘);
jQuery(‚.wdi_photo_title‘).eq(1).trigger(‚click‘);
jQuery(‚.wdi_photo_title‘).eq(2).trigger(‚click‘);
jQuery(‚.wdi_photo_title‘).eq(3).trigger(‚click‘);
});