How to Create Your Own Blogger Widgets for Blogger.com

Widgets are helpful tools that allow readers of your blog to access other Web sites lead them to anything you find useful or interesting, including your own blog. Blogger.com allows experienced Web users to design their own widgets and host them on their blogs.

Things You'll Need

  • Email account
  • Computer with Internet access
  • Experience with HTML coding
Show More

Instructions

  1. Design a Widget for Your Blog

    • 1

      Use HTML or JavaScript to design a widget. To create a widget you will need to use a complicated block of code that usually results in an animated image or other graphic. There are programs available to assist in designing widgets, but the process is usually difficult for inexperienced users.

    • 2

      Host the newly designed widget on your Web site or server and connect it to the Blogger.com Web site. You must include the URL 'http://www.blogger.com/add-widget' as the form action to have Blogger.com handle your widget.

    • 3

      Include the widget ID and type in the code, as these are required elements. The 'locked,' 'title' and 'page type' attributes are all optional in your widget code.

    Add the Widget to Your Blog

    • 4

      Click on the 'Submit' button or 'Add to Blogger' button that is attached to the customized widget. Users will then be taken automatically to a Blogger.com form.

    • 5

      Log in to Blogger.com and select one of your blogs. You will also see the title of the widget and have an opportunity to edit the content and template for the page element.

    • 6

      Click on 'Add Widget' to add the code to your blog and see the widget in action.

Tips & Warnings

  • Blogger.com has a comprehensive help section regarding widgets and the process of including widgets on blogs.

  • Any time you add coded elements from third-party sources, you run the risk of receiving corrupted files or viruses. Download at your own risk.

Related Searches:

Comments

  • James Smith Dec 23, 2010
    that is not complete
  • nilambar Feb 27, 2010
    can you explain more with sample code? thanks.
  • dawniemom Nov 19, 2009
    Ok, so I must be missing something but there are no actual instructions. Where'd they go?

You May Also Like

Related Ads

Featured