If you’ve ever seen an Instagram or Twitter feed on a website, a “sponsored post” section on a news website, or a comment section powered by Disqus, you’ve come in contact with a website widget.
So, what is a website widget? A web widget is simply a web app, or a website that is embedded on another website. Commonly, web widgets are used to extend the functionality of a website, or to show useful information taken from other websites.
Web widgets were especially common on blogs in the 2000’s
Because web widgets used to be very common in sidebars on blogs in the 2000’s, many people probably think of small rectangular web apps, like clocks, calendars, virtual pets and joke generators when they think of website widgets. Here are some “classic” examples of web widgets:
It’s pretty uncommon to see web widgets used like this nowadays, because web design has evolved to become less cluttered and more clean, compared to in the 2000’s. That’s probably why fewer people are searching for the term “web widgets” during the last 10 years.
But, that doesn’t mean that web widgets aren’t useful, or that you shouldn’t use them. For instance, I make use of a social share widget on this page, as do many other blogs.
How do you install a web widget?
To use a web widget, you usually don’t need any coding knowledge. Many widgets can be installed on websites simply by placing a piece of code on the web page. If you use a content management system, like WordPress, installing a web widget is even easier as you don’t have to modify the code yourself.
To start using a web widget using WordPress, usually all you need to do is install one of the over 900 widget plugins that are available for WordPress, configure some settings and choose where you want the widget to be shown.
What’s the difference between a web widget and a plugin?
There’s some confusion as to what a web widget is, for instance, plugins sometimes get called widgets, and vice-versa (many plugins listed as widgets on the WordPress plugin marketplace are actually not widgets according to Wikipedia’s definition). For instance, most contact form, image gallery, and website backup plugins aren’t widgets.
For something to be considered a web widget according to Wikipedia, the content of the widget needs to exist inside of an iframe, which is an HTML-element that is used for embedding third-party websites.
Unlike web widgets, plugins don’t always embed third-party websites or web apps on the host website. This means that you usually have more control over the content and design of a plugin.
The content of web widgets, on the other hand, usually can’t be altered by the host website, due to web standards like the same-origin policy, which restrict websites from altering content on other websites. Because of these same standards, web widgets usually can’t interact with the host website.
For instance, you might use a twitter widget to embed your latest tweets on your website, but you might not have much control over how the tweets look, and you won’t have any idea how the widget is built, because you can’t access the source code.
Common examples of web widgets
Social share button widget
Social share buttons are web widgets that allow the visitor to share an article or a web page quickly on social media, without having to copy and paste the link to the page. Examples of social share button widgets include Elfsight’s social share widget, Social media share buttons for WordPress and Sharethis social share buttons
Social media feed widget
Social media feed widgets allow you to display your latest social media posts on your website. The widget gets the latest posts, and other information from your social media account and updates the feed to the widget in real time. Examples of social feed widgets include Lightwidget’s Instagram feed widget, Elfsight’s Facebook feed widget and Smash Balloon’s Custom Twitter Feed widget for WordPress.
Calendar widget
Calendar widgets can be used to show events, or to let people book an appointment directly in your calendar. Examples of calendar widgets include Google Calendar, which can be embedded on a website, Feedwind’s calendar widget and Elfsight’s calendar widget.
Review widget
Review widgets can be used to pull in reviews from Google, Facebook, Yelp, etc. Examples include Elfsight’s AirBnB review widget and RichPlugins’ Google reviews widget for WordPress.
News widget
News widgets embedded on a website can show the latest headlines from different news websites. Examples include the Euronews JUST IN web widget and the World News web widget.
Weather widget
Weather widgets allow you to show weather data on your website. You can usually select the location and whether temperatures should be displayed in Celsius or Fahrenheit. Examples include WordPress’ Weather Atlas widget, WeatherWidget.io and Booked’s weather widget.
Customer support widget
Customer support widgets includes chat widgets, or full solutions that include everything customers might need for support, such as help center articles and contact forms to request support. Examples include: Zendesk, Elfsight’s Whatsapp chat widget and RapidDev’s Facebook Messenger chat widget for WordPress.
Comment widget
Comment widgets allow visitors to post comments on your website by using their social media accounts. Disqus is probably the most common comment web widget.
Advertising widget
Advertising widgets allow you to place ads on your website and earn a commission when someone clicks on the ad. Some alternatives include Google’s AdSense and Revcontent.
Should you use web widgets?
The key is to limit the number of widgets you use, and only use them when it’s needed. Website widgets can increase the load time of your website and add unnecessary clutter, making your website look too busy or dated. Because you’re embedding content from other websites, there are also security concerns with web widgets, so you should only use widgets you trust.
