# Code Snippets

Code snippets allow for quick insertion of reusable code and tags using keystroke combinations. Any keystroke that is not currently used by the system can be used for your snippet.

# Using Code Snippets

Code snippets are found in the Tools Inspector:

The Code Snippets section
The Code Snippets section

Snippets can be inserted into the Source Editor using 4 different methods:

  1. Use the Keyboard Shortcut associated with the Code Snippet
  2. Click the Insert button
  3. Double-click the snippet
  4. Drag the snippet to the Source Editor

# Editing Code Snippets

Clicking the + pop down and choosing New Snippet… or clicking the Edit Snippet… button will bring up the Code Snippet Editor.

Code Snippet Editor
Code Snippet Editor
  • Name: The description that will appear in the Code Snippets table.

  • Insertion: Whether the selected text should be preserved by placing the snippet's pre- and post-insert code snippet before and after the text, or if the selected text should be replaced by the pre-insert Code Snippet.

  • Pre-insert Code Snippet: The code that should be placed before a selection, or the code to replace the entire selection if the insertion option is set to do so.

  • Post-insert Code Snippet: The code that should be placed after a selection (only if insertion radio button is not set to replace the selection).

  • Shortcut Key: The keystroke combination that will insert this snippet into the document. Command-keys are not required, so even regular letters can be used. For example, the "enter" key (on the numeric keypad) is by default set to generate a <br>. Pressing delete will clear the shortcut key.


    If it is used by the system or Whisk already, it will probably beep (and the shortcut field will not be updated). Simply choose another combination.

# Magic Variables

These strings can go in the snippet code, and will be automatically replaced when inserting into the Snippet:

  • ${title} : The filename, without extension, of the Document. If it has not been saved, then "Untitled" will be used.

  • ${charset} : The current text encoding name. The use case is use this in a meta charset tag, which is what the Default Page snippet does.

  • ${caret} and ${/caret} : These are only used if the replace selection option for insertion is chosen. They mark the new selection range.

# Grouping Code Snippets

Groups of one level can be created for organizational purposes. To create a group, press the + pop down button and choose New Group.

Double-clicking a group will allow you to rename it (whereas double-clicking a snippet will insert it into the document). Simply drag and drop snippets or groups to rearrange them.