A- A A+
Brackets

В материале рассматриваются способы установки и удаления расширений в редакторе Brackets. Обзоры плагинов ColorHints, QuickFormTool, Brackets Css Color Preview, Code Folding.

Шаг 13. Установка (удаление) расширений

В первом уроке по редактору на шаге 3, вы познакомились с процессом установки расширений при выборе темы.

Напомним, что для установки плагинов (тем) необходимо открыть Менеджер расширений.

1-й способ. В меню перейти в Файл => Менеджер расширений.

2-й способ. Кликнуть на пиктограмму в правом верхнем углу редактора.

Brackets

В первой вкладке Доступные подгружается список всех плагинов. Если вам известно название расширения, в форму поиска введите его имя.

Brackets

В строке с названием плагина нажмите кнопку "Установить".

Также имеется возможность установить из URL или перетащить архив со скачанным расширением.

Brackets

В третьей вкладке менеджера расширений находятся плагины и темы, которые уже установлены в редакторе. Здесь расширения можно легко удалить.

Brackets

Шаг 14. Повторный выбор цвета

Плагин ColorHints обеспечивает быстрый выбор цвета, который ранее уже использовался на сайте.

В строке поиска менеджера расширений вставляем ColorHints и устанавливаем плагин.

Brackets

Плагин работает только с файлами CSS, SCSS, LESS.

В стилях пишем любое свойство, которому назначается цвет, например "color". В значении ставим решетку (#), т.е. знак с которого начинается код цвета. После чего автоматически всплывает окно, в котором отображены все цвета, которые использовались ранее на сайте (проекте).

Brackets

Таким образом, если нужно указать цвет, который ранее применялся на сайте, его легко можно будет найти.

Шаг 15. Быстрая вставка контента

Плагин QuickFormTool создает панель, которая позволяет быстро вставлять формы, изображения, ссылки, аудио и видео контент и другое.

В строке поиска менеджера расширений вставляем QuickFormTool и устанавливаем плагин.

Brackets

В главном окне редактора вверху и справа появилась кнопка.

Brackets

При нажатии на указанную кнопку раскрывается панель со следующими пиктограммами:

Brackets

При поочередном нажатии, соответственно будет вставлен следующий код:

Brackets

Далее кнопки для вставки изображений, ссылкок, аудио (видео) контента, флэша, создание новых файлов HTML, CSS, JS.

Brackets

Шаг 16. Иконки цвета

Плагин Brackets Css Color Preview создает иконки, соответствующие коду цвета, указанному в строке файла стилей.

В строке поиска менеджера расширений вставляем Brackets Css Color Preview и устанавливаем плагин.

Brackets

Теперь слева от нумерации строк содержатся пиктограммы, цвет которых записан в коде строки.

Brackets

Шаг 17. Скрываем код

Плагин Code Folding сворачивает фрагменты кода, что позволяет временно убрать с экрана неиспользуемый контент, обеспечивая комфортную работу с остальным кодом.

В строке поиска менеджера расширений вставляем Code Folding и видим сообщение о том, что этот плагин работает только с предыдущими версиями редактора.

Brackets

Выход из этого положения был найден следующий:

1. Скачайте архив.

2. Разархивируйте скачанное в папку default по адресу - C:\Program Files\Brackets\www\extensions\default.

Закрываем и открываем редактор и теперь справа от нумерации строк появились перевернутые треугольники.

Brackets

При нажатии на треугольник, он меняет направление и одновременно скрываются строки, в данном случае - тега "head".

Brackets

Повторный клик раскрывает свернутые строки.

Перемещаемся в меню Вид => Настройки Code Folding, где у плагина ряд параметров:

  • Enable code folding - Если убрать галочку плагин отключится.
  • Минимальный размер сворачиваний - Минимальное количество строк при которые будет срабатывать сворачивание.
  • Максимальное число вложенных сворачиваний - Ограничение числа вложенных сворачиваний.
  • Сохранять состояние - Если отметить, свернутые строки не изменят своего состояния при следующем открытии файла.
  • Скрывать кнопки для фолдинга - Значки (треугольники) будут отображаться только при наведении курсора.

Также в меню Вид имеются различные команды с использованием сочетаний клавиш.

Brackets

В следующем уроке продолжим обзоры плагинов.

 

Добавить комментарий

Защитный код Обновить

Если заметили ошибку, выделите фрагмент текста и нажмите Ctrl+Enter

МОЙ TELEGRAM-КАНАЛ

ПОДПИСАТЬСЯ!


Перенос на хостинг

Перенос на хостинг

Бесплатный видео-курс по переносу готового сайта на одну из лучших хостинг-площадок РУнета.

Смотреть (бесплатно)

Бессмертный сайт

Бессмертный сайт

2 урока, 16 минут, и Ваш сайт - БЕССМЕРТНЫЙ!

Узнать подробности!