Инструменты пользователя

Инструменты сайта


playground:playground

Это старая версия документа!


# MarkDown

## Шпаргалка по синтаксису markdown (маркдаун) со всеми самыми популярными тегами

Markdown (маркдаун) — облегчённый язык разметки созданный с целью написания максимально читабельного и удобного для правки текста, но пригодного для преобразования в языки для продвинутых публикаций (HTML, Rich Text и др.). Ниже будет приведена шпаргалка по синтаксису markdown со всеми самыми популярными тегами маркдаун.

### СОДЕРЖАНИЕ

* Содержание в виде ссылок по тексту (якоря) * Якоря в Markdown (маркдаун) * Тэг читать далее (cut) в Markdown (маркдаун) * Заголовки * Списки * Горизонтальные линии * Абзацы, параграфы * Перенос строки * Курсивное и жирное выделение текста * Выделение текст или код * Отмена форматирования * Цитаты * Ссылки * Сноски * Изображения * Таблицы * Спецсимволы * Списки определений * Спойлер * Использование HTML * Рекомендуемый мной онлайн редактор Markdown * Рекомендуемый плагин для wordpress * Официальный сайт Markdown

## Содержание в виде ссылок по тексту (якоря) (работает не со всеми плагинами wordpress)

Маркдаун может генерировать содержание статьи автоматически основываясь на заголовках, при этом якоря создаются также автоматически. В месте вывода содержания укажите тег [TOC]. В результате, вы получите список как сверху (в этой статье содержание реализовано другим способом)

## Якоря в Markdown (маркдаун)

Поместите в нужном месте якорь: `<a name=«abcd»></a>`, и, там где это необходимо, ссылку на этот якорь: Текст ссылки. Пример использования таких якорей видно в содержании этой статьи.

## Тэг читать далее (cut) в Markdown (маркдаун)

Чтобы в маркдауне поставить тэг Читать далее, достаточно в строчке написать `<!--more-→`

## Заголовки

Для того чтобы написать заголовок в Markdown, необходимо использовать знак # (хэш). Если необходимо несколько уровней заголовков, h1 — h6, нужно изменить количество хэшей (#) перед текстом заголовка. ``` # H1 ## H2 ### H3 #### H4 ##### H5 ###### H6 ```

Альтернативные теги для H1 и H2 (знаки равно или минусы под заголовком + пустая строчка над загаловком): ``` Альтернативный-H1

Альтернативный-H2


```

# H1 ## H2 ### H3 #### H4 ##### H5 ###### H6

Альтернативные теги для H1 и H2 (знаки равно или минусы под заголовком + пустая строчка над загаловком):

Альтернативный-H1

Альтернативный-H2


## Списки

Markdown поддерживает два вида списков: маркированный и нумерованный. Для организации маркированного списка используются знаки *, + и -. От них зависит вид маркеров. Чтоб сделать многоуровневый список, нужно будет сделать отступы.

``` Далее важно количество пробелов слева:

1. Первый элемент нумерованного 2. Второй элемент нумерованного

  • «Подсписок» (в) - элемент списка второго уровня, ненумерованный.

1. Третий элемент верхнего уровня, номер тут не имеет значения - лишь был (заменится на 3-ий)

1. первый элемент нумерованного подсписка -нумерованный

4. Ещё один нумерованный элемент верхнего уровня.

Пропускаем одну строку от списка и пишем какой-то текст (этот), ну а ненумерованные элементы тоже можно выводить целыми тремя способами:

* Звездочкой, как выще - Минусом в начале строки + Или плюсом

можно также регулировать уровни иерархии с помощью отступов, например:

* Звездочкой, как выше - Минусом в начале строки

     +  Или плюсом
   +  Или плюсом

- Минусом в начале строки - Минусом в начале строки - Минусом в начале строки ```

Далее важно количество пробелов слева:

1. Первый элемент нумерованного 2. Второй элемент нумерованного

  • Подсписок (в) - элемент списка второго уровня, ненумерованный.

1. Третий элемент верхнего уровня, номер тут не имеет значения - лишь был (заменится на 3-ий)

1. первый элемент нумерованного подсписка -нумерованный

4. Ещё один нумерованный элемент верхнего уровня.

Пропускаем одну строку от списка и пишем какой-то текст (этот), ну а ненумерованные элементы тоже можно выводить целыми тремя способами:

* Звездочкой, как выще - Минусом в начале строки + Или плюсом

можно также регулировать уровни иерархии с помощью отступов, например:

* Звездочкой, как выше - Минусом в начале строки

     +  Или плюсом
   +  Или плюсом

- Минусом в начале строки - Минусом в начале строки - Минусом в начале строки

## Горизонтальные линии

Создать горизонтальную линию можно поместив три или больше звездочек *, минусов — или подчеркиваний _ на отдельной строке.

``` *** ```

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

``` * * * * * ————————- _ _ _ _ _ ```

Каждая из приведенных выше строк даст одинаковый результат. Вот такой: * * * * * *

## Абзацы, параграфы

В маркдаун все блочные элементы (заголовки, списки, абзацы и т.д.) — все, что визуально начинается с новой строки отбивается пустой строкой. Для вставки пустой строки необходимо два раза поставить символ переноса строки (нажать на Enter)

## Перенос строки

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

Т.к. маркдаун создавался с целью быть удобночитаемым, его нередко используют в текстовых документах и для комфорта читателя лучше не давать тексту расплываться соплёй по экрану.

Для переноса строки внутри абзаца нужно использовать два пробела ⋅⋅ в конце строки.

## Курсивное и жирное выделение текста

Для курсива необходимо поставить знаки * вокруг текста. Для жирного начертания обрамим текст двумя звездочками, а для жирного курсива — тремя. Алтернативный синтаксис — использование знака _ по тем же правилам.

***жирный курсив***

## Выделение текст или код

Выделить текст или часть кода можно с помощью символа гравис (обратный апостроф) <pre>&lt;code&gt;Выделитьтекстиличасть кодаможно с помощью символа гравис (обратный апостроф) </code> Для выделения блока кода используют три символа в строчке до и после блока кода:

```
$a = 5; 
$b = 3; 
$c = $a + $b;
```

## Отмена форматирования

Если вы хотите, чтобы введенные теги HTML, код, теги маркдауна отображались в точности как вы их написали, то начните каждую строку с четырех пробелов.

⋅⋅⋅⋅тут должен быть **жирный текст**, но я поставил 4 пробела в начале стрки

## Цитаты

Для обозначения цитат достаточно поставить знак > в начале строки

&gt; Это простая цитата⋅⋅  
Состоящая из двух строк
  Это простая цитата
  Состоящая из двух строк

(напомню, для переноса строчки я использую два пробела в конце строчки) Цитаты можно вкладывать друг в друга:

&gt; Это просто цитата
&gt;
&gt; &gt; А это уже вложенная цитата
  Это просто цитата
      А это уже вложенная цитата

## Ссылки

Существует два варианта оформления ссылок. Первый — обычная вставка в текст:

[Текст ссылки](адрес "Описание")

Текст ссылки

и второй вариант — оформление ссылки в виде сноски. Когда в текст вставляется конструкция вида:

[Текст ссылки][Тег1]

… Указывающая, что именно в этом место будет располагаться ссылка, а где-нибудь ниже её описание:

[Тег1][Адрес ссылки]

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

I get 10 times more traffic from [Google][1] than from
[Yahoo][2] or [MSN][3].

[1]: http://google.com/        "Google"
[2]: http://search.yahoo.com/  "Yahoo Search"
[3]: http://search.msn.com/    "MSN Search"

I get 10 times more traffic from Google than from Yahoo or MSN.

## Сноски

Сноски и примечания1 задаются так2:

Сноски и примечания[^1] задаются так[^2]:
// пустая строка обязательно
[^1]: Все сноски отображаются в конце страницы
[^2]: Просто не так ли?)

## Изображения

Изображения помещаются на страницу также, как и ссылки, с одним отличием: в начале записи используется знак !

![Alt-текст](Путь к файлу "Подпись")

Вставка реального изображения может выглядеть как-то так:

![mountains](/img/mountan.png "Пейзаж с горами")

Создадим картинку, которая является еще и ссылкой на какую-нибудь страницу в сети:

[Поисковая система Google][google]
![Логотип Google][logo]

Выше приведены обычная ссылка и обычное изображение. Вы можете поместите картинку туда, где указан текст ссылки, например:

[![Логотип Google][logo]][google]

Нужно помнить, что приведенные выше ссылки должны быть определены где-либо в документе:

[logo]: http://www.google.com/images/logo.gif
[google]: http://www.google.com/ "щелкните, чтобы посетить Google.com"

Такое совмещение создает картинку, щелчок по которой переместит вас на указанную ссылку:

Логотип Google

## Таблицы (работает не со всеми плагинами wordpress)

Создание таблиц с Markdown намного нагляднее, чем в HTML. Форматирование интуитивно понятно, добавлю только что для выравнивания текста внутри ячеек используются знаки : в строке, отделяющей заголовок от основной таблицы.

Item      | Value | Quantity
:-------- |:-----:| -------:
Computer  | 1600  | 3
Phone     | 12    | 2
Pipe      | 1     | 1

Item | Value | Quantity :——-- |:—--:| ——-: Computer | 1600 | 3 Phone | 12 | 2 Pipe | 1 | 1

## Спецсимволы

Если вы хотите отобразить любой из специальных символов Markdown вместо того, чтобы использовать его для форматирования, просто поставьте перед ним символ обратной косой черты `\`. Сама косая черта не отображается, однако следующий за ней символ (*) будет показан как есть: ``` \*literal asterisks\* ```

\*literal asterisks\*

## Списки определений

Списки определений содержат термины и их описания. Это выглядит подобно словарю. Ниже простой пример:

Moodle
:   Хорошо известная платформа для онлайнового обучения

PHP
:   Язык программирования.
    Часто используется для разработки интерактивных веб-приложений.

## Спойлер (работает не со всеми плагинами wordpress)

Скрываем большие объемы текстовой и графической информации с помощью Advanced Spoiler, который уже 2 года не обновляется и работает не везде.

[spoiler]тут текст[/spoiler]

[spoiler]тут текст[/spoiler]

## Использование HTML

Markdown не является заменой HTML и даже близко к нему. Его синтаксис очень мал и соответствует только очень небольшому подмножеству тегов HTML. Идея не в том, чтобы создать синтаксис, облегчающий вставку тегов HTML. На мой взгляд, теги HTML уже легко вставлять. Идея Markdown состоит в том, чтобы упростить чтение, написание и редактирование прозы. HTML — это формат публикации; Markdown — это формат письма. Таким образом, синтаксис форматирования Markdown решает только проблемы, которые могут быть переданы в виде простого текста.

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

Единственным ограничением является то, что *HTML-элементы блочного уровня* — например, <div>, <table>, <pre>, <p> и т. д. — *должны быть отделены от окружающего содержимого пустыми строками, а начальный и конечный теги блока не должны иметь отступы с табуляцией или пробелами*.

Markdown достаточно умен, чтобы не добавлять дополнительные (ненужные) теги <p> вокруг HTML-тегов блочного уровня.

Например, чтобы добавить HTML-таблицу в статью Markdown:

/var/www/html/dokuwiki/data/attic/playground/playground.1649111013.txt.gz · Последнее изменение: (внешнее изменение)