Snippets in Dreamweaver are an excellent way of reusing a certain piece of code that you find yourself using constantly, over and over again, without having to manually retype it or copy and paste it. I find myself using it in my own line of work quite often, when developing exercises for courses.
I use Dreamweaver to develop our courseware, and every exercise in our class documents are usually made up of nested divs, each of which pertain to specific details about the exercise, such as the exercise’s title, length, and instructions. I used to type these nested divs out manually and oftentimes unwittingly created errors, which required me to dig into the code and hunt the bug down. Here’s where snippets came to my rescue! I’m going to make a snippet that’s just a blank exercise.
Creating a Snippet
Write your code in the Code View, highlight it, right click it, then select “Create New Snippet”.
Fill out the corresponding info for your snippet. There are two different Snippet types: Wrap selection and Insert block.
Wrap selection provides Insert before and Insert after fields for the opening and closing snippet pieces. In the example below, it is used to wrap the selected text in a “FilePath” span:
Insert block simply inserts the snippet into the code wherever the cursor is:
Once you’ve created your snippet, it will appear in the Filespanel, in the Snippets tab. If you right click in the Snippets section, you can even create a new folder just for your own snippets, for better organization.
Now, every time you click on your snippet here, Dreamweaver will automatically insert it wherever your cursor is.
You can even create keyboard shortcuts for snippets (and essentially any function in Dreamweaver), so you can insert it at just the push of whatever button you want! Look out for my next blog entry to find out how.
To hear about the latest Adobe news, blogs, and training, subscribe to our newsletter. Click here to subscribe.
Webucator Delivers Instructor-led and Self-paced Training