April 26, 2022

What Is a Widget Embed Code?

Whether it’s on our phones or computers, we interact with widgets on a daily basis, sometimes without even noticing. That’s why in this post we dive into what a widget is, how it works and what is a widget embed code. 

What Is a Widget?

A widget is an element that allows accessing information or functionalities from third-party apps or websites.

Nowadays it’s usual to have access to a bunch of widgets on your phone. For example, we can see how the weather and calendar widgets on the iPhone are some of the most common.

iPhone widgets on homescreen

Image Source

So what the widget does is display on the home screen the info from the weather and the calendar apps without opening them.

The same happens on websites, where they’re used for multiple purposes, especially for customer support.

For example, if we go to Mailchimp’s homepage, at the bottom right corner you’ll see a chatbot. That’s a widget in action! 

Mailchimp.com homepage

In this case, it’s designed to help customers who are looking for more information about the service.

mailchimps chatbot widget on homepage

Another clear example of a widget it’s in our dashboard. There you’ll see at the bottom left corner a “Join our referral program” button. 

socialproofed main dashboad

That’s a widget provided by GrowSurf, which is our referral platform to make the sign-up process easier.

What Is a Widget Embed Code?

A widget embed code is an HTML code that makes it possible to display the widgets on a website.

For example, let’s say you want to create an Instagram feed widget using our platform. 

Once you’ve created it, you have to click on “Add to website”.

Then you’ll see the widget embed code that will display the Instagram feed on your website.

The final step is to copy the embed code and paste it into your CMS.

How to Get Embed Codes

The process for getting embed codes depends on what platform you want to get them from. Before, accessing an embed code wasn’t as easy as it is now. In fact, many social media include it within their sharing options.

We have 2 examples to show you.

1. Embed a Youtube Video

To embed a Youtube video you just need to click on “Share”.

Youtube Pepsi video

Within the sharing options, select  “Embed”. 

Youtube sharing options

Then, it’ll show you how the video will look on your website and you’ll have the chance to select if you want the video to start at a certain minute. Once you’ve decided that, you just need to copy the embed code and that’s it!

Youtube video HTML embed code

2. Embed a Tweet

Embedding tweets has become a popular practice, especially on blog posts.

Twitter now allows getting the embed code from the tweet itself.

The best part is that it has customization options where you can choose how the tweet will look on your website, including the chance to hide an original tweet by checking “Hide Conversation” if the tweet you want to embed is a reply to another tweet.

Let’s embed this tweet on this post.

Tweet by Twitter creators

First, you have to click on the three dots in the right corner of the tweet.

Then select Embed Tweet from the menu.

Tweet sharing options

It will take us to publish.twitter.com where we can customize how it will display.

Embedding tweet customization options

Let’s go with this look, so the next step is to click on “Update” and then “Copy Code”.

Tweet widget embed code

Finally, we go to our CMS, paste the code where we want to display the tweet and voilá. Here it is.

Embedding a widget on your website just takes seconds

Now you understand where widget embed codes come from and how you can use them.

It’s time to delight your customers by adding some widgets to your website and what better way to do it than by using our free review widgets.

Sign up for SocialProofed today and start enjoying all the benefits of having social proof on your website.

Join the discussion

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