Banner

How To Add Widgets To Your Website

joomla-website-widgets-guide-thumbnailChoose from many widgets from around the web to integrate directly into your website. Or make your own!


pagebreakline

 

Learn how to add widgets to your website with this easy to follow guide.

pagebreakline

Google Analytics - Our choice for website statistics

There are so many widgets available now, that can do all kinds of things from displaying the weather, to checking stocks, displaying email or even for playing games. Whether you're just looking to spruce up your website with some gimmicky widgets or if you want to stay completely professional and display only usable and related widgets for your visitors, widgets are a great way of quickly adding useful features to your site, without needing to know how to build them. Your website visitors will be more engaged with your pages and more inclined to come back again and again for more. Another great thing about widgets is that they are free and very easy to add to your pages, simply just copy a small amount of code from your chosen widget and paste it directly into your web page - no programming required.

For this guide we will be demonstrating how to add a widget to a page using Joomla, which is our recommended and certainly one of the best content management solutions available. If you dont yet have Joomla, then click here for more info on how you can get up and running quickly and easily with a free website full of features like this, all ready to go.

widgetboxscreen

pagebreakline

Choosing the right widgets for your website

There are many sources of widgets online, however one of the most popular websites for widgets is widgetbox. Once you have chosen your widget (or created your own using the Widgetbox service), simply copy the widget code provided and log in to your Joomla website admin panel, i.e www.mywebsitedomainname.com/administrator

addressbaradmin

websiteloginscreen

Next click on the "Extensions" menu and select "Module Manager".

joomla-module-manager-menu

Within the new module manager page, choose "New" from the buttons on the top right to create a new module. On the new module page choose "Custom HTML" and click "Next" which will open the new module options page.

Firstly we need to give this new widget module a name, which you need to enter into the "Title" field, it's up to you whether you wish to show the module/widget title on the front end of your website or not using the "Show Title" selection. Make sure the module is set to "Enabled" in order for it to be published and active on your website. Next up we need to choose the position where the module will be displayed. Whether it is down the left or right sidebar, or somewhere else is completely down to your own specific preference and can be set with the "Position" selection. 

Lastly we now need to paste in the HTML code that we got from the widgets properties on Widgetbox (or similar widget provider website). Once done, it's just a case of clicking the "Apply" button at the top to make the widget live on the website for all to see.

pagebreakline

 Alternative way of creating a widget module

Our favorite free Widget extension for Joomla is Widgetbox for Joomla which is designed just for Widgetbox widgets and makes the job of adding widgets to your website very easy. Once you have downloaded the Widgetbox for Joomla extension simply log in to your Joomla website admin panel, i.e www.yourdomainname.com/administrator and click on the "Extensions" menu and choose "Install / Uninstall" and browse to the recently downloaded Widgetbox for Joomla extension. Click upload to finish installing it. For more detailed step by step instructions on installing Joomla extensions, see our quick guide to installing Joomla extensions.

Next you need to do some minor configuration to the module which can be done by selecting the module from the "Module Manager" screen (Extensions/Module Manager/Widgetbox for Joomla). You should first give the module a title so as to make the module more informative for yourself or your users (if you select 'Show Title' your visitors will be able to see the title of the module, which is handy i.e. 'Stock Prices' or 'Local Weather' etc. If you don't wish your visitors to see the title of the module then set 'Show Title' to 'No'.

For 'Enabled' you should set it to "Yes" when you are ready to make it live or test it (if you wish to test it first then set 'Enabled' to 'Yes' and also set 'Access Level' to 'Special').

Position is where you can position the module to any module position on your web pages. If you wish to position the widget module within your actual page content then you will need a Joomla extension that will allow you to do this such as Modules Anywhere as the default install of Joomla does not allow you to position modules directly into content.

widgetboxdetailsscreen

The most important setting for this module is under the Module Parameters section and is 'ID Widget' which is the widget code which is unique to each and every widget on Widgetbox. You simply just need to insert the Widgetbox code number into this field eg: "38hfgh5c-f770-4aa5-888b-3f45b442fbb2" and not "InsertWidget_38hfgh5c-f770-4aa5-888b-3f45b442fbb2".

widgetboxparametersscreen

Once done simply click either 'Apply' which will save the settings but keep the module parameters page open or click 'Save' which will close the page and return you to the Module Manager screen.

widgetboxsavesettings

To add additional Widgets from Widgetbox to your website you now only need to 'Copy' the Widgetbox module from the 'Module Manager' screen which will initially create a clone of the widget you just copied. You can then simply open this new module up and insert a different Widgetbox number into the Widget ID field and you will have a nice new widget to run alongside your original. All other settings for this new widget can be customized to your liking.

For this guide we simply showed you how to get started with adding Widgets to your website. For more help on configuring Widgetbox for Joomla, for additional help or support of the Widgetbox for Joomla extension or to make a donation to the author please visit Ramses Tech

Conclusion

Well that's it. You will now have widgets running on your website. 

pagebreakline

Get a widgets ready website for free right now

We have already added several popular widgets right into our Website Starter Kit along with many other features including slide shows, interactive maps, social networking and much more to enable you to have a complete professional website, for free. If you are looking to make your own professional looking website then why not start the easiest way possible and download our free website starter kit.

pagebreakline

websitestarterkitboxWebsite Starter Kit - Free Website

This single download will allow you to have a full featured professional looking website up and running in minutes. If you are looking for a new professional website thats easy to update and maintain. Get started now - Free

Free website downloadFree Web Site

pagebreakline