Instagram & Webnode

We have already written a guide on how to link Facebook with website in the article How do I easily link my Facebook to my website in Webnode? In this tutorial, we will focus on how to link Instagram with your website in Webnode. The Instagram Feed widget from Elfsight is a credible service that will surely charm you with its multiple benefits such as design templates or the ability to filter displayed content.

Nowadays, social media are an integral part of online business, and therefore an increasing number of entrepreneurs and users share the content of “socials” on their websites. It is social networks that serve to build a community and your own brand (so-called branding), which help improve communication and increase trust between your company and the customer. The fact remains that more and more people leave their impression of the product/service through Facebook reviews, posts or comments, etc.

Wpromotions.eu has prepared this turorial for those of you asking: How to quickly and easily share Instagram content on my website?

Instagram Feed widget - Elfsight

Instagram Feed widget – free VS premium

The Instagram Feed widget that we describe in this tutorial is for free. The external service Elfsight offers in its free version (LITE) the possibility to create 1 widget for free.

If you need another widget, it is necessary to purchase one of the Premium tariffs offered by this service.

The price starts at 10 USD / month.

Pricing - Elfsight

Instagram Feed widget – templates

The external service Elfsight allows you to choose a template for the Instagram Feed widget, thereby speeding up the whole process. You can currently choose from 7 templates: 

 

      • Instagram Feed – Profile Widget
      • Instagram Feed – Grid
      • Instagram Feed – Small Widget
      • Instagram Feed – Hashtag Showcase
      • Instagram Feed – Post Slider
      • Instagram Feed – Dark Profile Widget
      • Instagram Feed – Dark Small Widget
Instagram Feed widget templates

How to link Instagram with website in Webnode?

1. Go to Elfsight official website https://elfsight.com/, open Widgets and choose Instagram Feed.

Elfsight - Widgets - Instagram Feed widget

2. Choose one of the 7 available templates (you can see a preview on the right side) and click the Continue with this template button.

*For the purposes of this guide, we have selected the “Profile Widget” template

Instagram Feed widget - select a template

3.Under Sources section, select the correct type of your account – My Business Account for your business account or My Personal Account for your personal account. If you want to share content from public Instagram accounts or content from so-called hashtags, click on Public Accounts & Hashtags.

*In our case, we will use a personal Instagram account, so we will select My Personal Account.

Instagram Feed widget - source type setup

4. Customize the widget that will display the content of your Instagram on the web, according to your own taste. By selecting a section Layout, you can change the layout of the posts/whole widget, such as the size of the space between posts or the caption/title of the whole widget.

Instagram Feed widget - gap between the posts setup
Instagram Feed widget - gap and title - preview
Instagram Feed widget - title setup

Under the Post section, you can set the display of individual posts.

Instagram Feed widget - individual posts setup

After the user clicks on the widget, Elfsight offers you a choice of three options. You can find them under the PostPost Click Action.

 

  • None – nothing happens when the user clicks on the widget
  • Open in Popup – the widget opens directly on the page and the user can view it
  • Open on Instagram – the widget opens directly in Instagram
Instagram Feed widget - Post Click Action setup

You can easily change the language of the entire widget (see the image below) under the Settings section – Language.

Instagram Feed widget - language setup

5. If you are done with the editing, click on Add to website for free.

The service will ask you to log in. You can use your existing Google or Facebook account or log in with your email.

Instagram Feed widget - add to website for free
Instagram Feed widget - login to Elfsight

6. Click the Publish button in the upper right corner and copy the necessary HTML code using Copy Code.

Intagram Feed widget - copy HTML code

7. Log in to Webnode editor and enter the HTML code according to the premium plan you have purchased in Webnode:

1. I have purchased LIMITED, MINI, STANDARD, PROFI or BUSINESS premium plan in Webnode

If you have purchased Premium plan Limited and above from Webnode, you can insert the code of your widget (Instagram Feed widget) anywhere on your website.

Click the “+” button and select the “HTML” option.

add content - HTML

add content – HTML

 

 

 

2. I have a FREE version in Webnode

Sorry, but in the Free version, Webnode tool does not allow adding HTML codes. It is necessary to purchase one of the packages – Limited, Mini, Standard, Profi or Business.

upragde your plan

upragde your plan

8. Done – after inserting the code, publish the changes with the Publish button in the top bar. You will see the Instagram Feed widget in the published version of your website.

Publish

Instagram Feed widget – preview

A preview of the widget in the editor (left) and in the published version of the website (right).

Preview of the widget in the editor of the website
Instagram Feed widget - preview

A few words at the end

Nowadays, in the era of digital world, linking Instagram with website in Webnode can be a big advantage for entrepreneurs and users.

The Instagram Feed widget from Elfsight offers an efficient and simple solution for sharing content from a personal or business Instagram account, as well as from public Instagram accounts or sharing hashtag content

The free version of the widget will be enough for many users, but for those who need more, there are also a premium tarrifs with extended options.

The process of linking social media to the web in Webnode with our turorial is quick and easy. Don’t hesitate and try it now.

TIP: You haven`t created your own website in Webnode yet? Get a discount of up to 17% on a new website. Click this link to get the discount!

Instagram Feed widget – FAQ

How do I remove a specific post/posts from the widget?

If your Instagram Feed widget shows a specific post/posts from your Instagram that you would like to hide, you can do so under the SourcesFilters section. By clicking on Add Filter under “HIDE POSTS CONTAINING THESE WORDS OR HASHTAGS”, you are able to add a word, phrases or hashtags that the widget will exclude/not display. All posts that contain that word or hashtag will be hidden.

Instagram Feed widget - filters

How do I add a widget that displays a hashtag?

Under the Sources section, select Source Type as Public Accounts & Hashtags and enter the hashtag you want to display.

Instagram Feed widget - hashtag widget

Do I need technical knowledge to add an Elfsight widget to my website?

No, you don’t need technical knowledge at all. Read this tutorial and you’ll definitely be able to do it! Fingers crossed!

Do I have to enter a payment card number?

No – the Elfsight service does not require a payment card to be filled in when using the Free (LITE) version.

More awesome tutorials

No Results Found

The page you requested could not be found. Try refining your search, or use the navigation above to locate the post.

Did this guide help you? Send it to your friends 🙂

Viliam
Follow me