Автор @liga.avtorov
Итак, вы нажали заветную кнопку “Добавить пост”. Перед вами открылась новая страница. На этой странице, кроме меню, которые рассматривали в прошлой инструкции, появились поля для заполнения текстом.
Рассмотрим их подробнее:
1.Строка для вставки заголовка поста.
2.Под строкой заголовка - кнопка выбора языка и кнопка выбора режима публикации поста (в обычном визуальном редакторе, с использованием разметки markdown или языка html).
3.Поле для ввода и форматирования текста.
4.В правом нижнем углу внутри поля - три диагональные полоски. Потяните за них вниз, если нужно увеличить окно.
5.Строка для вставки тегов. Набирайте их без значка #, маленькими буквами через запятую, следите за пробелами. Обратите особое внимание на первый тег - его невозможно будет изменить, текст будет находиться по нему в первую очередь.
Основные правила использования тегов на Голосе:
6.Кнопка “Пост”. При незаполненных полях она светло голубого цвета. Когда все поля будут заполнены и это будет сделано правильно - нажимайте ее смело )
7.Справа от кнопки “Пост” есть поле, в котором вы можете выбрать способ **распределения вашего вознаграждения **за пост: 100% в Силу Голоса или 50% в СГ и 50% в GBG (Золотые)
8.Под этим полем располагается маленькое квадратное поле, позволяющее вам автоматически **проголосовать сразу **после публикации - или не голосовать за пост.
Теперь рассмотрим возможности режимов работы с текстом.
Давайте разберемся, что такое Markdown.
**Markdown **(маркдаун) — облегчённый язык разметки, с помощью которого можно писать максимально удобочитаемые и лёгкие для правки тексты, а также преобразовывать их в языки HTML, Rich Text и др.
Плюсы Markdown:
- Подготавливая текст к публикации, вы точно знаете, как он будет выглядеть на странице.
- Уменьшение времени на последующую проверку и редактирование текста.
- Повышение читабельности текста.
Минусы Markdown
- Необходимо потратить время на его изучение.
- Нужно быть очень внимательным при наборе текста. Любая ошибка (даже лишний пробел) может проявиться в виде нечитаемого набора символов.
Опыт показывает, что стоит освоить этот режим. Это увеличит возможности оформления и облегчит работу над текстом.
Именно в режиме Markdown открывается окно при нажатии на кнопку "Добавить пост":
Пользователи Голоса написали множество постов об использовании этого языка разметки. От самых подробных, с указанием символов для самой сложной верстки, до простых, представляющих собой своего рода “шпаргалки” с упоминанием самых нужных команд. Пример "шпаргалок":
Самый полный курс по работе с Markdown - от @on0tole.
И кроме того, над полем предварительного просмотра появляется ссылка на ”Руководство стилизации в Markdown”\ (на английском языке) сразу, когда вы начинаете вводить текст в режиме Markdown.
Комментарии пишутся только в режиме Markdown:
Из режима Markdown вы можете перейти в режим Редактор, кликнув над полем для ввода текста на слово Редактор.
Важно! Пока поле пустое, в режиме Редактора сохраняется возможность вернуться в режим Markdown. Но как только вы ввели текст, то редактор можно будет переключить лишь в режим Raw HTML. Стоит запомнить эту особенность!
Плюсы Редактора
- Интуитивно понятная работа над текстом
- Не нужно изучать специальные разметки
- Повышение читабельности текста
Минусы Редактора
- Неудобно пользоваться при публикации длинного текста - кнопки остаются вверху и недоступны
- Ограниченные возможности форматирования текста
Верхние кнопки редактора позволяют вам сделать текст читабельным. Это классические кнопки, которые есть в любом редакторе. Однако и по ним возникают вопросы, поэтому мы распишем их назначение:
-
B - Bold - жирное начертание шрифта
-
I- Italic - наклонное начертание шрифта
-
S- перечеркнутое начертание шрифта -
{ } - размещение текста на плашке, что позволяет визуально выделить его как отдельный фрагмент
-
Три полоски с точками - маркированный список с точкой
-
Три полоски с цифрами - нумерованный список
-
Пиктограмма кавычки ” - оформляет абзац в виде цитаты
-
Пиктограмма цепочки - позволяет вставить ссылку в появившемся окне
Перед кликом на эту кнопку необходимо в тексте выделить слова, на которые будет закреплена ссылка -
Пиктограмма разорванной цепочки - позволяет снять ссылку с текста
Для снятия ссылки, необходимо целиком выделить весь фрагмент текста под ссылкой -
Пиктограмма изображения - позволяет вставить ссылку на изображение в открывшейся строке
-
Поле выбора различного стиля текста - позволяет разметить заголовки и подзаголовки в тексте
-
Пиктограмма “стрелка назад” - отменяет последнее действие
-
Пиктограмма “стрелка вперед” - возвращает последнее отмененное действие
-
Переход в режим Raw HTML. Это нужно, например, чтобы вставить кнопки или отцентрировать картинки и заголовки.
Проблема работы в режиме Raw HTML в том, что, переключаясь обратно в режим редактора или при редактировании поста после публикации, все сделанные в нем настройки исчезают.
Плюсы Raw HTML
- Подготавливая текст к публикации, вы точно знаете, как он будет выглядеть на странице
- Уменьшение времени на последующую проверку и редактирование текста.
- Повышение читабельности текста
Минусы Raw HTML
- Необходимо потратить время на его изучение
- Нужно быть очень внимательным при наборе текста. Любая ошибка (даже лишний пробел) может проявиться в виде нечитаемого набора символов
- Нельзя редактировать пост после публикации и переключаться в другой режим
- Может глючить
Язык HTML для большинства гораздо сложнее, чем освоение разметки Маркдаун. Кроме того, при оформлении поста работает ограниченное число тегов HTML.
####Самые популярные теги для форматирования текста
<B></B>- выделение текста полужирным
<strong></strong>то же самое
<I></I>- получение курсивного текста
<em></em>- то же самое
<U></U>- подчеркивание текста
<STRIKE></STRIKE>- перечеркивание текста
<SUB></SUB>- выделение подстрочного текста (нижний индекс) для записи формул. Код H<sub>2</sub>O, результат - H2O.
<SUP></SUP>- верхний индекс (аналогично предыдущему). Код(a+b)<sup>2</sup>- результат (a+b)2.
Теги можно вкладывать друг в друга. Код:<strong>H<sub>2</sub>O</strong>- это<strong><em>формула воды.</em></strong>, результат - H2O - это формула воды.
####Абзацы
<P>- вставка одной пустой строки и размещение находящегося за ним видимого элемента html-страницы в следующей строке. Код<p>Это первый абзац.</p><p>Это второй абзац.</p>, результат:
Это первый абзац.
Это второй абзац.
</p> - закрывающий тег. Его использование не обязательно, но желательно.
####Выравнивание текста
Возможно использование тегов для выравнивания текста: center, left, right и justify. Соответственно, они выравнивают текст по центру, по левому краю, по правому краю и одновременно по двум краям сразу.
Код<center>Текст по центру</center>, результат:
Другие же способы выравнивания так же просто не сработают, как выравнивание по центру тегом<center></center>. И приходится прописывать команду подробно:
Код:<div class="pull-right">Выравнивание текста по правому краю</div>,
результат:
Выравнивание текста по правому краю
По умолчанию текст выравнивается по левому краю.
####Перенос строки и горизонтальная черта
<BR>- переход на новую строку без вставки пустой строки.
Код:1. Первая строка. <br> 2. Вторая строка., результат -
1. Первая строка.
2. Вторая строка.
У<BR>нет закрывающего тега. Для вставки нескольких пустых строк нужно записать тег<BR>несколько раз подряд.
<HR>- делит части текста разделительной полосой.
####Заголовки
<H1></H1>- заголовок первого уровня
<H2></H2>- заголовок второго уровня
<H3></H3>- заголовок третьего уровня и так далее до цифры 6.
Самый крупный заголовок<H1></H1>, самый маленький<H6></H6>. Теги заголовков имеют атрибуты: align - выравнивание текста заголовка на странице.
####Списки
<OL></OL>- упорядоченный (нумерованный) список
<UL></UL>- неупорядоченный (маркированный) список.
Каждый элемент списка выделяется тегом<LI></LI>.
Код
<ol type="1"><li>Первый элемент.</li><li>Второй элемент.</li><li>Третий элемент.</li></ol>
результат -
- Первый элемент.
- Второй элемент.
- Третий элемент.
Код
<ul type="square"><li>Первый элемент.</li><li>Второй элемент.</li><li>Третий элемент.</li></ul>
результат -
- Первый элемент.
- Второй элемент.
- Третий элемент.
Как и остальные теги HTML, списки можно вкладывать друг в друга.
####Спецсимволы
Это символы, которых либо нет на клавиатуре, либо те, которые браузер принимает за управляющий символ и преобразует в код. Полный список этих символов здесь Спецсимволы HTML.
####Вставить иллюстрацию в HTML код
Код:<img src="https://imgp.golos.io/250x150/https://s19.postimg.org/f940iiuab/image.jpg"></a>
Результат:
Выравнивание картинки аналогично выравниванию текста.
Вы также можете посмотреть видеоурок от @serejandmyself о публикации постов в этом ролике:
<iframe width="800" height="450" src="https://www.youtube.com/embed/uGF2kUcOefg" frameborder="0" allowfullscreen></iframe>\(Основы работы языка Raw HTML подготовлены по урокам: [http://www.seoded.ru/beginner/html/text.html\#2](http://www.seoded.ru/beginner/html/text.html#2)\)
Мы разобрали три способа публикации постов. Однако существуют и альтернативные редакторы, позволяющие постить в Голос, не используя его веб-интерфейс.
По материалам статьи (автор @liga.avtorov)