Панель Snippets
Любите ли вы перекусывать бутербродами? Лично у меня работа с панелью Snippets ассоциируется с такими маленькими бутербродиками. Если у вас голод на идеи, можете быстренько его утолить, используя готовые кусочки кода из панели Snippets. Или вы хотите сделать запасы впрок? Тогда запишите понравившиеся, удачные или просто часто используемые кусочки кода в коллекцию Snippets.
Вообще-то термин "Snippets", который ввела в обиход компания Macromedia, дословно переводится как "фрагменты, лоскутки, отрывки". И в это есть доля истины. Панель Snippets используется для хранения лоскутков HTML-кода — коротких, но, как правило, связных фрагментов Web- страницы. Их можно быстро применять для быстрой штопки страницы и закрытия прорех. Но, в отличие от настоящих лоскутков, кусочки HTML- кода можно переделывать на свой лад и, таким образом, добиваться целостности.
Откройте панель Snippets с помощью команды меню Window | Snippets или нажав комбинацию клавиш <Shift>+<F9>. В нижней части панели сгруппированы различные фрагменты HTML-кода. Дважды щелкните на любой группе, к примеру, Headers, чтобы развернуть ее и посмотреть фрагменты, входящие в ее состав. Затем щелкните один раз (не дважды!) на любом фрагменте, чтобы посмотреть, как он выглядит. Его внешний вид представлен в верхней части панели (рис. 4.27). Кстати, не забудьте, что вы можете его свободно изменить при использовании. А в нижней части, рядом с именем, можно прочитать разъясняющий комментарий.
Внешний вид многих фрагментов, да и их комментарии, может не умещаться в скромных размерах панели Snippets. Не стесняйтесь в таких случаях свободно раздвигать панель до нужных размеров.
|
Рис. 4.27. Панель Snippets — собрание маленьких, но полезных фрагментов HTML-кода |
Чтобы использовать понравившийся фрагмент в своей странице, вернитесь к ее исходному коду и поместите курсор там, где собираетесь вставить фрагмент. Это можно делать как в текстовом, так и в визуальном режиме. Затем дважды щелкните на фрагменте на панели Snippets — он автоматически появится в странице, или перетащите его мышью с панели на страницу.
А теперь добавим свой собственный фрагмент в коллекцию. Выделите нужные строчки в исходном коде своей страницы. Это лучше делать именно в текстовом режиме, по моему мнению, чтобы фрагмент получился цельным, с парным количеством тегов и без лишних символов. На панели Snippets выделите папку, в которую будет помещен будущий фрагмент. Новую папку можно создать, щелкнув на значке с изображением папки в нижней части панели. После этого выполните одно из действий.
□ На панели Snippets щелкните по второй кнопке в нижней части, с изображением листа и плюса.
□ В текстовом режиме можно щелкнуть на выделенном коде мышью и в контекстном меню выбрать Create New Snippet.
После этого появляется диалоговое окно Snippet для определения параметров будущего фрагмента (рис. 4.28). В текстовом поле Name укажите имя, если вы не хотите, чтобы он был безымянным. В поле Description введите краткий комментарий, поясняющий суть фрагмента. Это та информация, которая будет представлена на панели Snippets рядом с его именем. Не пренебрегайте комментариями. Потом не только посторонним людям, но и вам самим будет трудно понять, чего вы хотели добиться этим кусочком кода.
|
Рис. 4.28. Диалоговое окно Snippet для определения свойств нового фрагмента кода |
Очень важный параметр — тип фрагмента Snippet Туре, который переключается с помощью связанных опций Wrap Selection и Insert Block. Если указать первый вариант, то наш фрагмент может состоять из двух частей. Первая часть задается с помощью области Insert Before, а вторая — с помощью Insert After. И тогда в будущем кто-нибудь сможет применить наш фрагмент к выделенному участку кода в своей странице. Первая часть фрагмента будет вставать перед выделением, а вторая — после выделения. Короче говоря, он будет действовать как парный тег нашего собственного формата.
Если выбрать тип Insert Block, фрагмент будет использоваться как единый блок, строительный кубик. На мой взгляд, лучше так и делать.
Последний параметр, Preview Туре, задает режим просмотра фрагмента на панели Snippets. Если выбрать тип Design, то фрагмент будет изображен в виде картинки. Этот вариант рекомендуется для различного рода оформительских и визуальных элементов. А вот если фрагмент основан на невидимом для посетителя Web-страницы коде, вроде скриптов или тегов мета, то рекомендуемый выбор — тип Code. Тогда на панели Snippets будет просто демонстрироваться сам текст фрагмента.
Нажмите кнопку ОК, чтобы закончить процесс определения фрагмента. Позднее вы можете переопределить его свойства, щелкнув на нем правой кнопкой мыши и выбрав в контекстном меню пункт Edit. Это можно сделать и с любым другим фрагментом на панели Snippets. Дополнительные команды контекстного меню таковы:
□ New Snippet — создать новый фрагмент;
□ New Folder — создать новую папку;
□ Edit — редактировать свойства фрагмента (при этом можно изменять его код);
□ Insert — использовать фрагмент в текущей открытой странице;
□ Rename — переименовать фрагмент;
Delete — удалить фрагмент из коллекции.