Панель инструментов редактора MDN

Панель инструментов редактора предоставляет вам возможность менять внешний вид и структуру документов во время работы. Эта статья описывает назначение кнопок в панели инструментов.  

На панели расположено три ряда. На первых двух - кнопки, а на третьем HTML контекст, который показывает вам какой элемент вы редактируете в данный момент. На скриншоте ниже, например, редактирование происходит в <p> элементе. 

Screenshot of the toolbar, with labels for the button groupsКнопки на панели инструментов разделены на девять групп. Давайте взглянем на все. Мы будем изучать кнопки в каждой группе по порядку, слева направо.

Документ

Кнопки из этой группы используются для управления на уровне всего документа.

Source
Кнопка Source позволяет переключаться между редактированием в режиме WYSIWYG и редактированием разметки HTML. Мы просим вас избегать редактирования разметки, т.к. в таком случае очень легко неправильно оформить статью или вовсе столкнуться с ошибками. Правда в настоящее время у редактора могут встречаться некоторые причуды в работе, из-за которых сделать некоторые вещи не удастся, не отредактировав разметку напрямую. Смотрите Режим разметки в редакторе MDN чтобы более подробно изучить этот режим и понять что в разметке писать можно, а чего писать не следует.
Publish
То же что и кнопка Опубликовать.

Примечание: Если вы пытаетесь сохранить вашу работу и ваши изменения отклоняются как некорректные, но вы уверены, что ваш контент подходит для MDN, вам следует связаться с командой редакторов для разрешения проблемы.

Preview
Аналог кнопки Предварительный просмотр.

Правка

Функции этих кнопок очень схожи с соответствующими из меню Правка в любом другом редакторе.

Paste / Вставить
Вставить контент из буфера обмена в поле редактора.
Paste as plain text / Вставить как обычный текст
Открывает диалоговое окно в которое вы можете вставить текст. Этот текст будет отделен от всего лишнего, так что вы не вставите случайно текст с лишними стилями или ссылками. После вставки текста, вы можете его отредактировать, если нужно, а затем, кликнув на кнопку OK, вставить на страницу.

Примечание: Обратите внимание, что во время вставки контента в редактор, если вы копировали стилизованный контент (например, скопированный с другого сайта  код  с подсветкой синтаксиса),  вы можете случайно вставить вместе с ним стили или посторонние классы. Пожалуйста, будьте внимательны и не допускайте этого. Проверяйте свои изменения в режиме разметки, если требуется, чтобы удалить лишние стили и классы (или позаботьтесь об этом заранее, воспользовавшись кнопкой "Paste as plain text").

Undo
Отменить последнее изменение.
Redo
Применить последнее отмененное изменение.

Работа с текстом

Find / Найти
Открывает диалоговое окно Find and Replace в режиме "Find", который позволяет найти в вашем документе определенную строку.
Replace / Заменить
Открывает диалоговое окно Find and Replace в режиме "Replace", с помощью которого можно найти нужную строку и заменить на новую.

Кнопки Find и Replace открывают одно и то же диалоговое окно, которое имеет несколько опций для поиска и, опционально, замены текста.

Spell Checker / Проверка правописания
Эта кнопка открывает меню с несколькими пунктами:
Enable SCAYT/Disable SCAYT
Включает или отключает Spell Check As You Type (SCAYT)
Options
Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке с опциями для настройки SCAYT.
Languages
Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке "Languages", где вы можете выбрать язык для проверки правописания.
Dictionaries
Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке "Dictionaries", где вы можете сами выбрать словарь, который SCAYT будет использовать.
About SCAYT
Если SCAYT включен, этот пункт открывает диалоговое окно SCAYT во вкладке "About", в которой написано о SCAYT.
Check Spelling
Этот пункт открывает диалоговое окно Spell Checker, в котором вы можете проверить правописание в пакетном режиме (batch mode) для всего документа. Вы можете воспользоваться вкладкой Grammar для проверки грамматических ошибок, или воспользоваться вкладкой Thesaurus для поиска синонимов для слов в документе.

Вид

Эта группа позволяет настроить вид отображения интерфейса редактора. 

Maximize
Эта кнопка разворачивает интерфейс редактора (то есть панель инструментов и поле редактирования) во всё окно браузера, предоставляя вам как можно больше места для работы.
Show blocks
Эта кнопка отображает контуры вокруг блочных элементов в вашем документе. Это может быть удобным для проверки структуры документа без необходимости заглядывать в разметку.

Строковые стили

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

Bold
Переключает жирный стиль текста, создавая при этом в разметке элемент <strong>.
Italic
Переключает курсив. Создает <em> элемент.
Underline
Переключает нижнее подчеркивание. Создает <u> элемент.
Strike through
Переключает перечеркивание. Создает <s> элемент.
Subscript
Переключает нижний индекс. Создает <sub> элемент.
Superscript
Переключает верхний индекс. Создает <sup> элемент. Заметьте, что такой строковый стиль не используется на MDN, так что вам вряд ли когда-нибудь пригодится эта кнопка.
Remove format
Удаляет текущий строковый стиль в выделенном тексте.
Code
Переключает стиль для кода. Создает <code> элемент. Это используется для представления в тексте имен переменных, функций, объектов, файлов и т.п.

Работа со ссылками

Данная группа предоставляет инструменты для работы со ссылками.

Link
Создает новую ссылку. При нажатии вызывается окно создания ссылки, работа с которым подробна описана в Ссылки с помощью панели инструментов.
Unlink
Удаляет ссылку в месте, где расположен курсор.
Anchor
Создает якорь в месте, где расположен курсор. Заметьте, что вам не нужно создавать якорь для заголовков, редактор автоматически создает id для каждого заголовка, заменяя пробелы в названии на нижние подчеркивания. Например, заголовок этой секции имеет id, значение которого Работа_со_ссылками.
Create a redirect
Встраивает переадресацию на другую страницу. Смотрите Создание переадресаций для подробной информации.

Специальные стили

Кнопка Styles - это выпадающее меню, предлагающее на выбор специальные стили форматирования текста.

Блочные стили

None
Удаляет стиль с выбранного блока.
Note box
Создает блок с примечание, как показано ниже. Вы должны всегда начинать примечание со слова "Примечание:" жирными буквами.

Примечание: Это поле с примечанием.

Warning box
Создает блок с предупреждением, как показано ниже. Блок должен всегда начинаться со слова "Внимание:" жирными буквами.

Внимание: Это поле с предупреждением.

Two columns
Делает выделенный текст или блок двухколоночным на браузерах, которые это поддерживают.
Three columns
Делает выделенный текст или блок трехколоночным на браузерах, которые это поддерживают.
Syntax box
Создает поле для синтаксиса, как показано ниже. Это создает <pre>. Вы можете также использовать кнопку "PRE".
Это поле для синтаксиса
Hidden when reading
Создает блок, который видно только в режиме редактирования. Это не то же, что и HTML-комментарий, который виден только в режиме разметки.

Строковые стили

SEO summary
Этот специальный стиль используется чтобы выделить предложение или два, которые будут использованы как краткое описание для поисковой оптимизации. Он также используется макросами для автоматического создания посадочных страниц. Если вы не воспользуетесь этим стилем, MDN автоматически использует первый абзац вашей статьи. Но иногда это не самый лучший вариант и лучше воспользоваться предложенным стилем.

Блоки

Эта группа включает опции для прочих стилей блоков. Некоторые из них относятся к стандартному HTML, а другие - уникальны, т.к. относятся к Kuma.

Blockquote
Вставляет блок для цитаты. Пожалуйста, не используйте это. Блоки с цитатами не являются частью нашего стайлгайда, и эта кнопка будет удалена в ближайшем будущем.
Preformatted Text
Вставляет <pre> блок, или превращает в него текущий. Все примеры кода должны быть оформлены в такой блок.
Headings
Кнопки заголовков позволяют вам вставить нужный заголовок. Нажмите на одну из этих кнопок для создания нового заголовка соответственной глубины. По умолчанию заголовки с H2 по H4 включаются в оглавление, но вы можете изменить это, как описано в разделе Информация о странице.
Syntax highlighter
Подсветка синтаксиса позволяет вам выбрать язык, синтаксис которого будет подсвечиваться в <pre> блоке. Если такой блок не был выбран изначально, он будет создан. Выберите язык используемый в блоке, и блок будет подсвечен соответствующим образом.
Insert Code Sample Template
Эта кнопка используется системой живых примеров (the live sample system), чтобы помочь вам быстро вставить новый живой пример (live sample). Смотрите Пользование системой живых примеров чтобы узнать подробнее.
Insert Code Sample iFrame
Вставляет в документ подходящий макрос для отображения нужного живого примера. Смотрите Пользование системой живых примеров для деталей использования и информации о других функциях живых примеров.

Списки и поток текста

Эта группа предоставляет инструменты для создания списков и изменения поведения текста в блоках.

Insert/remove numbered list
Создает или удаляет нумерованный список. Когда вы работаете над списком, при каждом нажатии Enter будет создаваться новый элемент списка. Клавиша Tab может быть использована для увеличения вложенности, а Shift + Tab, соответсвенно, для уменьшения. При нажатии на Enter в пустом элементе список будет закончен. Нажатие ПКМ на списке открывает контекстное меню с опцией Numbered list properties, в которой можно выбрать стиль маркера.
Insert/remove bulleted list
Создает или удаляет маркированный список. Когда вы работаете над списком, при каждом нажатии Enter будет создаваться новый элемент списка. Клавиша Tab используется для увеличения вложенности, а Shift + Tab для уменьшения. При нажатии на Enter в пустом элементе список будет закончен. Нажатие ПКМ на списке открывает контекстное меню с опцией Bulleted list properties, в которой можно выбрать стиль нумерации (числа, буквы, римские цифры и пр., а также с какой цифры начинать).
Definition List
Создает новый список с определениями (definition list). Этот список состоит из серии терминов и определений (именно такой список вы сейчас читаете).
Definition Term
Создает новый блок с термином в списке. Если в данный момент вы не редактируете список, он будет создан. Нажатие на Enter автоматически переключается на редактирование нового определения.
Definition Value
Создает новый блок с определением в списке. Нажатие на Enter создает новый термин. Нажав дважды, вы покинете список.
Decrease indent
Уменьшает вложенность. Того же эффекта можно добиться нажав Shift + Tab в списке.
Increase indent
Увеличивает вложенность. То же самое, что и нажатие Tab в списке.
Text direction left-to-right
Переключает текущее направление текста на слева направо. Используется при работе с другими языками. Например, при работе с английским текстом в арабском.
Text direction right-to-left
Переключает текущее направление текста на справа налево. Используется при работе с другими языками. Например, при работе с арабским текстом в английском.

Медиа

Данная группа предоставляет инструменты для работы с медиафайлами.

Image
Вставляет новое изображение в статью. Смотрите Изображения для подробностей.
Table
Вставляет таблицу в статью. Смотрите Таблицы для подробной информации о таблицах в статьях.
Embed YouTube Video
Открывает диалоговое окно, в котором вы можете ввести URL для видео YouTube. С этой информацией создается вызов макроса EmbedYouTube. Это безопасный способ встроить видеоконтент.
Insert MathML based on (La)TeX
Открывает диалоговое окно, в которое вы можете вставить свой код TeX или LaTeX. Этот код будет конвертирован в MathML вставлен в документ в <math> блоке.

 

Метки документа и участники

Метки: 
Внесли вклад в эту страницу: aleksandrpnshkn
Обновлялась последний раз: aleksandrpnshkn,