Expression Web V4 SP2 has a much-improved way of working with snippets,
those small bits of code you can save and re-use.
Rather than using Ctrl-Enter to open the snippets dialog, as you have
been able to do since V2, SP2 now uses a 'snippets panel'. You can still
open this with Ctrl-Enter but you can also have it floating or dock it
wherever you want. I have mine docked alongside the main 'Toolbox' panel for
This shows the default groups which contain numerous
useful snippets but
it's easy to add you own or download
and add others from this site and
If you expand the groups you'll see sub-groups too.
If you used any of your own 'custom snippets' in V4, they'll be imported
into the new snippets panel in a 'Legacy' group. (Although any you
downloaded and added will not).
Each snippet comes with a description telling you what it does, for
example the "CSS Replace text with image" snippet.
As well as the name and description you see
some or all of the snippet
that is inserted.
You always need to work in Code view (or the code part of Split view) when
If you click the 'Options' tab you'll see what else is possible.
If you want to add a new folder for your snippets, go right
to the end of the list and click on the last entry (probably
'Web Slice') and then click 'New folder'.
the Filter box, which allows you to filter out specific snippets
Adding new snippets or new groups of snippets is very easy. Hit the 'Add
new snippet' option and you get the 'New/Modify Code Snippet Dialog.
The 'Insert/replace' option is selected by default.
The snippet above will insert an HTML5 <header>...</header> block,
with the insertion point in the middle.
Notice the 'Wrap' option to the right on 'Insert/replace'. This is a
much simpler way of wrapping text than the previous V2/3/4 snippets.
The snippet above wraps the code you select (in Code view of course)
with an HTML5 Microdata 'locality' item property.
And of course you can edit a snippet too.
Just select an existing snippet and hit the Edit button.
Now that we've seen the snippet panel and how you can manage snippets,
lets look at one of the more complex groups,
the JQuery UI Snippets.