|
Homesite Tip:
Snippets Save Time And Reduce Coding Errors
by Larisa Thomason,
Senior Web Analyst,
NetMechanic, Inc.
Have you ever wasted hours trying to debug a JavaScript routine that you'd used successfully on other Web sites? Did you once find the perfect background color and font combination for a Web site, but then couldn't remember the exact combination to use on another site?
Easily recycle your code using the Snippets option in Allaire's Homesite (a popular HTML editor that's a mix of code-based and WYSIWYG editing). Snippets help you code your pages more quickly and reduce typing errors.
Custom Code At Your Fingertips
Every HTML programmer soon learns the advantages of "cut and paste," but that method requires easy access to the original document. It's much easier to save the code in your HTML editor so that you can quickly paste it wherever you need it. That's where snippets come in.
A snippet is a small bit of reusable code that you can save in HomeSite and use on any subsequent Web page. Use snippets to insert HTML code, JavaScript, DHTML, or Cascading Style Sheet (CSS) specifications. Depending on how you saved the code, you can use a snippet to insert a series of complete HTML tags, just a portion of one tag, a whole JavaScript routine, or just the variable declaration. You have complete control to save it like you need it - in a format that works.
Creating Your Own Snippets
Test your code thoroughly before you try to save it in a snippet! Copy the code to your clipboard so you don't have to re-type it in the Add Snippet window. When you're ready, follow these steps:
1. Click on the Snippets Tab in the Resources window.
2. The tree of snippets and folders appears (if there are any already defined). Right-click your mouse inside the snippets window and select Create Folder.
3. Name your new folder something descriptive. Once you get comfortable with snippets, you'll use them constantly. Folders named "JavaScript1" and "JavaScript7" won't mean much to you later. "JSRollovers" and "JSFormVerification" will be a lot more meaningful in six months.
4. To add your first snippet, right-click on the appropriate folder and choose Add Snippet. Again, be sure to give your snippet a good descriptive name! Paste the snippet information into the Start Text window. The End Text window is optional: use it if you're planning to insert information before and after a highlighted block of text.
5. Click OK when you've finished.
Inserting A Snippet
Inserting a snippet into your code is easy. All you need to do is double-click on the particular snippet you want to insert. If the snippet has beginning and end tags that you want to insert around existing code, highlight the code before you double-click on the snippet. Otherwise, just place the cursor in the appropriate spot before you insert the snippet.
It's even easier to insert frequently used snippets if you create a keyboard shortcut for the snippet. Just go to Options, Customize and select the Snippets Shortcuts tab. Then enter the combination of keys you want to use for the snippet.
Even though you can avoid many accidental coding errors using snippets, you may still have page errors that HomeSite's document validation tool can't catch. NetMechanic's HTML Toolbox will scan your page for coding techniques that can cause your site to display inaccurately across browsers, speed up your download time, and check your page for broken links.
Use them together to quickly and easily create Web pages that display without errors.
|
