Thursday, 26 June 2008

  • How To: A Beginner's Guide to Building Web Widgets

    Marketers are expected to spend about $40 million on web widgets this year. This guide will teach you how to build and embed simple web widgets at no cost (besides an investment of time).

    It's free, easy and takes about five minutes to roll out your first creation.

    One of the best things about widgets is that you can enable sharing. Sharing widgets means more mashing of your ideas and content. More mashing means more community and more buzz around your brainchildren. For those who love to play and live in the WWW sandbox, this article is for you.

    Getting Started with Web Widgets

    The first widget we will build is embedded below. It is basically your blog or website in a condensed format, showing the links to the latest 20 articles in a custom, branded, linked and optimized format. In the first short video we show you how to build this widget, which we then embed to a Facebook profile.

    The second widget we build is a custom news feed using Google News. This widget adds value by providing visitors with targeted, niche-specific news without leaving your site. This widget can also drive traffic to your destination, because you can brand it with your own logo and link, and add it to a public gallery where others can access and embed it to their own sites. We embed this widget in a private website which runs off WordPress.

    Keep in mind that you can choose to make your widgets publicly available to anyone who wants them, or to keep them private for your own use.

    Finally, in this guide we will briefly cover other technologies you can use to build widgets, and we will resources for how to embed widgets to platforms not listed above.

    Here's one of the widgets we are going to build:

    And here's the process we cover in the vids.

    Building Widgets

    * Go to WidgetBox.com, create an account and sign in.
    * Click on "Create Widget," top-right of the screen.
    * Choose "Create from Blog/Feed."
    * Get the path to your RSS or ATOM feed, if you have one. Right-click on the RSS icon on your page, the XML icon, or the "Subscribe" link, and choose "Copy Target Location." More on finding the path to your RSS or ATOM feed here, and we also discuss this in the first video. The feed url will often end in something like: http://www.yoursite.com/rss.xml. You can grab any feed you want, from a different blog or a Google News search result, etc. When you've done this, hit Continue.
    * Change defaults/cosmetics as you see fit. Choose a logo/pic to brand the widget with.
    * Hit 'Publish Blidget' when we're happy.

    Embedding Your Widget

    * At the next screen, click on "Get Widget."
    * Choose where you want to embed it. If you want to embed to your Facebook or Blogger account, sign into that account in a seperate screen, click on the relevant icon, and you will be brought through a brief, one-screen installer.
    * If you want to embed to a regular website, select "Copy" to grab the default embed code for the website. You can get this in Flash or Javascript.
    * Embedding to a WordPress website: From the Admin Dashboard, select Design, Widgets, Add Text Widget. Click Edit. Paste the embed code you copied earlier. Save and exit. Resources for embedding to other platforms at the bottom of the page.

    Read Full News

    Resources for

    My Web Design Source

  • Choose Identity

  • Give eProps (?)

  • New! You can now edit your comments for 15 minutes after submitting.