How to Make a Widget

By eHow Computers Editor

Rate: (10 Ratings)

Dashboard widgets are created using a mix of HTML, JavaScript and CSS and are a useful feature for Tiger users, helping them to utilize the power of Mac OS X. If you already know how to write web content using the current web-standard practices that comply with the XHTML standard, (Strict, Transitional or Frameset,) creating a new Mac widget is fun and simple.

Instructions

Difficulty: Challenging
Step1
Create a directory to hold your widget. Widgets install as "widget packages" or directories with a .wdgt extension and are found in OS X in one of two folders. Standard Tiger system widgets are stored in the "/Library/Widgets" folder and user-installed widgets are stored in the "~/Library/Widgets" folder.
Step2
Open the new widget folder. Hold down on the "Control" key while you click on the newly created "Wdgt file." In the menu, select "Show Package Contents" to open a new folder. Keep the folder open in order to easily drag files into it.
Step3
Choose your widget image. Take the images you have selected and create a PNG image file. Label the file "default.png." Once created, drag the file into the widget folder.
Step4
Define the "info.plist" file, a property list that holds important information used by Dashboard to identify the widget. Use the Property List Editor application found in: "/Developer/Applications/Utilities." Use XML code to create the CFBundleIdentifier key, a unique string for your widget and the MainHTML key, which tells the dashboard the HTML file to use in your widget. Choose "Save As" from the file and label the file as "info.plist" and then drag it into your widget folder.
Step5
Establish the main HTML file. Make an HTML file and label it as "index.html" and drag the file into your widget folder.
Step6
Open the HTML file to view the widget running and to see your changes. A widget is created using HTML, for this reason it is possible to preview your widget using Safari, or another web browser, while at the same time writing the markup in your favorite text editor.

Tips & Warnings

  • Xcode 2.0, included with Tiger, contains information and examples to help get you started. This information is available in the Apple Applications in the ADC Reference Library.
  • For sample code and sample widget install the Tiger Developer Tools and see /Developer/Examples/Dashboard.

Post a Comment

POST A COMMENT

Request a New How-To Article

Looking for more How To information? Chances are there’s an eHow member who knows how to do what you’re looking to do. Submit an article request now!

eHow Article: How to Make a Widget

eHow Computers Editor

eHow Computers Editor

Category: Computers

Articles: See my other articles

Related Ads