How to make gadgets:
PART ONE: Getting the editor
To make a Google gadget, first you must have the Google gadget editor. “Oh noes!” You may say, but this is not too hard to solve. I can simply give you the link: here. Once you have added that to your iGoogle page, then we can go onto the next step (yes, this requires a Google account, hence the “Google Gadgets”)
PART TWO: Starting your gadget
Hokay, so now that we have the gadget editor, it is time to get started:
Ministep one:
check that you have the “hello.xml” opened, as it is the easiest thing to start off with
Ministep two:
delete the text after the ‘Content type=”…’ stuff, you do not need it.
Ministep three:
start adding the code for your gadget (see here for my YouTube tutorials, for good coding techniques, see the text below)!
PART THREE: Coding techniques
When coding a gadget, you need to keep a few things in mind. First, always use good coding conventions, which are a certain set of steps/methods that make code much more readable. The first rule of good coding conventions is: WHITE SPACE IS YOUR FRIEND!!! The computer just ignores white space, so use VERY liberally. The next, and probably most important rule is to use obvious variable names, i.g: $Date. That is obviously a variable that contains the date of something. And number three is: be spare on the comments, they clutter up the page. If you are forced to use too many comments, then you are not properly using good coding conventions.
PART FOUR: The gadget construction
Most gadgets use JavaScript, HTML, CSS, or a combination of all three. They are required to use XML, as they are XML gadgets. XML is called Extensible Markup Language and is used when there is a need for a language that is readable and writable by humans, and easily readable by computers. HTML is HyperText Markup Language and is used for the main body of your gadget’s look and feel. CSS is called Cascading Style Sheets and is used for fine-tuning the look of your gadget. It allows you to create custom classes for your buttons and other such inputs. It is used mostly to style pages using HTML or XHTML. JavaScript is a variant of Java that is used to enable programmable objects that get run within other programs, or in a Google Gadget, your browser. While JavaScript is a variant of Java, do not expect to be an instant expert at it if you know Java well, they are almost completely unrelated.
PART FIVE: Some simple code
Here is some help getting started. If you are immediately confused, take a breath, and stay calm. I find that the most affective technique for staying calm while looking at a new programming language is to take a deep breath and resolve myself to learn this language. Let me give you some starting tips:
1. Do not EVER skimp on white space, I know I have already said this, but NEVER EVER skimp on white space.
2. Always use good variable names, yes this is a reoccurring statement.
3. Tutorials are OK! I would never have gotten as far as I have without tutorials! Speaking of, I can give you one right now (you cannot tell, due to formatting problems, but there is excessive white space in there)!
Read more »
Filed under: JavaScript | Tagged: extensive, Google Gadgets, JavaScript, tutorial | Leave a Comment »