Tutorial: What's a Widget?
You might never have heard the term "widget" in before. If so, it can be a bit of a shock when you sign up to create your first website, and suddenly realize that widgets are everywhere in the Yola Sitebuilder. If you find yourself asking any of these questions, you are in good company:
"What is a widget?"
"What does a widget do?"
"Why do I need a widget, anyway?"
Many people have both asked and attempted to answer this question - although the term might be difficult to define, widgets are very useful! They are sometimes also called components, gadgets or elements. It might help to think of widgets as discrete chunks of code that allow you to add content to your site without having to write any code yourself. In Yola, you drag and drop widgets onto your page. Some widgets you edit directly, like the Text Widget. We have also integrated with several widget galleries which allow you to easily add a wide selection of exciting content to your site.
In this lesson, we will look at some of the widget options available in the Sitebuilder. Hopefully, this will give you a better idea of what is available so that you can create websites which are even more compelling and dynamic!
We have other tutorials that can introduce you to the most important widgets which allow you to add text, images, Flickr photos, videos and slideshows (you can find more information on these links: Creating Your Homepage, Adding New Pages & Exploring Images). But why stop there? Let's dig a little deeper and find some other widgets you might want or need for your site.
In this tutorial, we will show you how to add other content using other widgets available on Yola:
- Google Gadgets
- Form Widget
- HTML Code Widget
Using a Google Gadget Widget
Here is a short list of just a few of the widgets you can get from Google Gadgets:
In the Widgets menu, click on More > Misc and drag the Google Gadgets icon onto your page. A dialog box will appear with a space to paste code, and a link that takes you directly to the widget service's website. The dialog box looks something like this:
Click on the link to Google Gadgets, and find the widget you wish to add. I am adding a Google Search box to my site:
- Find the widget you want and click "Add to your webpage"
- Configure your widget preferences.
- When you are satisfied with your widget, click "Get the Code".
- Copy the code and go back to your site.
- Paste the code into the Yola dialog box and click "OK".
- The widget will now be embedded in your page.
Using a Form Widget
Yola offers its own Yola Form, and we have also integrated with Wufoo. They have both free and paid services available.
We will now show you how to add a Yola Form widget:
- Click on Widgets > Popular > Form.
- Drag and drop the Form Widget onto your page and select the type of form you would like to use.
- Each form has a "Settings" and "Edit" tab. Within these tabs you can use the fields to change the details of your form. You can add, delete, rename and move the location of these fields.
- A CAPTCHA is automatically included in the form. CAPTCHAs are an excellent way to prevent blank and spam form submissions.
- When you are finished customizing your form, click "Save".
- Save your page and click "Publish"
- You will be able to view your form on your website.
Using the HTML Code Widget
Did you know that you can add any widget you can find on the internet to your site? In this tutorial we will add a video from Vimeo.com.
- Visit Vimeo and copy the embed code provided (here is a link with more detail on how to get that code: Adding Vimeo and other video services).
- Copy the HTML code provided.
- Back on your site, drag and drop the HTML Code Widget onto your page.
- Paste the embed code into the HTML Editor.
- When you are finished, click "Save".
- Republish your site by clicking on the "Publish" button.
Here is a list of some of the widgets you can get from the other widget services that we have integrated with:
We hope this tutorial has helped you understand a little bit more about widgets and how they can be used to add fun, exciting or useful content to your website.