При просмотре исходных файлов объявлений и HTML-страниц в Google Web Designer можно переключаться между режимами просмотра кода и макета. Изменения, внесенные в режиме просмотра кода, отражаются в режиме просмотра макета, что позволяет быстро оценить результаты работы.
Как переключиться в режим просмотра кода
В правом верхнем углу окна нажмите кнопку Режим просмотра кода
.
В режиме просмотре кода недоступны панели режима просмотра макета и некоторые команды меню.
.Настройки просмотра кода
В настройках просмотра кода можно изменять параметры форматирования и редактора, включая следующие:
- Цветовая тема
- Привязка клавиш
- Перенос строк
- Размер отступа
- Автоотступ
- Автозаполнение
- Использование пробелов вместо символа табуляции
- Видимость мини-карты
Полный список параметров приведен на этой странице.
Работа с кодом
Описанные ниже функции упрощают написание и редактирование кода. Вы также можете узнать, как в режиме просмотра кода перемещаться внутри документа или между файлами.
Масштаб
Чтобы изменить размер текста кода, используйте кнопки масштабирования (- и +) в правой части нижней панели. По умолчанию Google Web Designer запоминает масштаб, установленный в режиме просмотра кода.
Сворачивание блоков кода
Используйте стрелки на отступе слева, чтобы сворачивать и разворачивать блоки кода.
Отступы
По умолчанию Google Web Designer автоматически обозначает новые строки отступом при вводе. Если у блока нет правильного отступа (например, если вы скопировали код из другого файла), можно выделить его и нажать клавишу Tab, чтобы это исправить.
Автозаполнение кода
По умолчанию Google Web Designer показывает подсказки для кода при вводе. Если вы отключили эту настройку, можно нажать Ctrl + Пробел, чтобы активировать автозаполнение.
Режим языка
Google Web Designer подбирает цвета синтаксиса и автозаполнение кода на основе расширения имени файла. Чтобы изменить режим языка по умолчанию, нажмите на текущий язык в нижнем колонтитуле и выберите новый из контекстного меню.
Библиотеки GreenSock (JavaScript)
В объявлениях для Дисплея и Видео 360 или HTML-страницах можно добавлять популярные инструменты анимации GreenSock с помощью команды меню.
Как вставить библиотеку GreenSock
- Перейдите в режим просмотра кода.
- В меню Файл выберите Включить библиотеку JavaScript > Библиотека GreenSock.
- Выберите библиотеку из списка.
Таким способом можно добавить все нужные библиотеки.
Отличие от опубликованного кода
Режим просмотра кода не всегда дает точное представление о документе, который будет опубликован. Код, который виден при создании документа, может сжиматься для экономии места, а код, который не отображается, – присутствовать в опубликованном файле.