| Content |
| Instagram sources * |
source |
— |
A source list for getting Instagram images.
Use the following variants:
- @username - Instagram posts from username
- #hashtag - Instagram posts with hashtag
- location URL - Instagram posts by location (See tutorial)
- post URL - specific Instagram posts
It’s possible to specify several sources through the gap or separated by commas.
|
| Display only from |
filter_only |
— |
It filters the images to the ones from the specified sources. If this filter is applied, the image will display only if it's posted in each source. The filter accepts @username, #hashtag, location URL or post URL. |
| Exclude by source |
filter_except |
— |
It allows to exclude specific images by their URL, by specific hashtags, source usernames or locations. |
| Filter |
filter |
— |
It allows to specify custom filter using javascript function or its name.
Using it you can define which posts will be shown in gallery.
The function will be applied for each post. If it returns true then post will be shown,
if it returns false - post will not be displayed.
Note: filter function should be defined in global scope (window object)
For example:
<script>
function myInstaShowFilter(image) {
// returns true if filter equals Sutro
return image.filter === 'Sutro';
}
</script>
[elfsight_instagram_feed id="1"
filter="myInstaShowFilter"
]
|
| Number of posts to display |
limit |
0 |
Set the required number to restrict the count of loaded posts. Leave this option empty or "0" to show all available posts. |
| Layout |
| Feed Layout |
layout |
slider |
Choose one of the two feed layouts: slider or grid. |
| Post Template |
post_template |
tile |
Select one of post templates: tile or classic. |
| Columns |
columns |
4 |
Number of columns in the feed. |
| Rows |
rows |
2 |
Number of rows in the feed. |
| Space between images (px) |
gutter |
0 |
The space between the images in the feed in pixels. |
| Mobile optimization |
responsive |
- |
Specify the breakpoints to set the columns, rows and space between images in the feed depending on a window width. |
| Width (px, auto) |
width |
auto |
Feed width (any CSS valid value: px, %, em, etc). Set "auto" to make the feed full width and responsive. |
| Call to action buttons |
call_to_action_buttons |
- |
Set the call to action buttons. The buttons will be displayed on the popup. You can set a specific call to action for each post. Call to action buttons encourage your visitors to perform the actions you need (buy a product, register at your service or contact you). |
| Display post elements |
post_elements |
user, date, instagramLink, likesCount, commentsCount, share, text |
Choose the post elements to display them in the feed. |
| Display popup elements |
popup_elements |
user, location, followButton, instagramLink, likesCount, share, text, comments, date |
Choose the elements to display in popup. |
| Action on image click |
image_click_action |
popup |
Select the action on image click. Open the image in popup, open the image on Instagram in a new browser tab or do nothing. |
| Arrows control |
slider_arrows |
true |
Activate/Deactivate arrows in the slider. |
| Drag control |
slider_drag |
true |
Activate/Deactivate drag in the slider. |
| Slide switch speed (sec) |
slider_speed |
0.6 |
Animation speed of slide switching (sec). |
| Autoplay speed (sec) |
slider_autoplay |
0 |
Autoplay in the slider (in seconds). If this option is set to "0" autoplay is turned off. |
| Colors |
| Color scheme |
- |
default |
To get the perfect look for your feed, choose one of the 10 ready-made color schemes, and adjust it using available color options. |
| Post overlay background color |
color_post_overlay_bg |
rgba(0, 0, 0, 0.8) |
|
| Post overlay text color |
color_post_overlay_text |
rgb(255, 255, 255) |
|
| Post background color |
color_post_bg |
rgb(255, 255, 255) |
|
| Post text color |
color_post_text |
rgb(0, 0, 0) |
|
| Post links color |
color_post_links |
rgb(0, 53, 107) |
|
| Slider arrows color |
color_slider_arrows |
rgb(255, 255, 255) |
|
| Slider arrows background color |
color_slider_arrows_bg |
rgba(0, 0, 0, 0.9) |
|
| Grid load more button color |
color_grid_load_more_button |
rgb(56, 151, 240) |
|
| Popup overlay color |
color_popup_overlay |
rgba(43, 43, 43, 0.9) |
|
| Popup background color |
color_popup_bg |
rgb(255, 255, 255) |
|
| Popup text color |
color_popup_text |
rgb(0, 0, 0) |
|
| Popup links color |
color_popup_links |
rgb(0, 53, 105) |
|
| Popup follow button color |
color_popup_follow_button |
rgb(56, 151, 240) |
|
| Popup call to action button color |
color_popup_cta_button |
rgb(56, 151, 240) |
|
| More |
| Feed Title |
widget_title |
Follow us on Instagram |
Set the feed title. URLs, hashtags (with #) and Instagram usernames (with @) will be automatically displayed as clickable links. |
| Feed Language |
lang |
en |
Choose one of the available languages for the feed. |
| Cache time (sec) |
cache_time |
300 |
It defines how long the data from Instagram will be cached in your browser. Set "0" to turn the cache off. |
