Код и разработка

Подсветка кода для вставки

Подсвеченный код с инлайновыми стилями — для письма, Telegraph, редактора статей и всего, где нельзя подключить CSS. Двадцать языков, светлая и тёмная тема, нумерация строк таблицей, чтобы номера не попадали в копию.

Код

Язык

Тема

Кегль, px

Номера строк

Как будет выглядеть

async function fetchOrders(userId) {
  // пагинация: берём страницами по 100
  const orders = [];
  let page = 1;
  while (true) {
    const res = await fetch(`/api/orders?user=${userId}&page=${page}`);
    if (!res.ok) throw new Error(`Сервер ответил ${res.status}`);
    const chunk = await res.json();
    orders.push(...chunk.items);
    if (chunk.items.length < 100) break;
    page += 1;
  }
  return orders;
}

HTML с инлайновыми стилями

<pre style="overflow-x: auto; background: #f6f8fa; color: #24292f; border: 1px solid #d0d7de; border-radius: 8px; padding: 16px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace; font-size: 14px; line-height: 1.5; margin: 0"><code>async function fetchOrders(userId) {
  // пагинация: берём страницами по 100
  const orders = [];
  let page = 1;
  while (true) {
    const res = await fetch(`/api/orders?user=${userId}&amp;page=${page}`);
    if (!res.ok) throw new Error(`Сервер ответил ${res.status}`);
    const chunk = await res.json();
    orders.push(...chunk.items);
    if (chunk.items.length &lt; 100) break;
    page += 1;
  }
  return orders;
}</code></pre>

Markdown

```
async function fetchOrders(userId) {
  // пагинация: берём страницами по 100
  const orders = [];
  let page = 1;
  while (true) {
    const res = await fetch(`/api/orders?user=${userId}&page=${page}`);
    if (!res.ok) throw new Error(`Сервер ответил ${res.status}`);
    const chunk = await res.json();
    orders.push(...chunk.items);
    if (chunk.items.length < 100) break;
    page += 1;
  }
  return orders;
}
```

BBCode

[code]
async function fetchOrders(userId) {
  // пагинация: берём страницами по 100
  const orders = [];
  let page = 1;
  while (true) {
    const res = await fetch(`/api/orders?user=${userId}&page=${page}`);
    if (!res.ok) throw new Error(`Сервер ответил ${res.status}`);
    const chunk = await res.json();
    orders.push(...chunk.items);
    if (chunk.items.length < 100) break;
    page += 1;
  }
  return orders;
}
[/code]

Куда это вставлять

Письма и рассылки: почтовые клиенты вырезают теги style и внешние таблицы стилей — цвет выживает только инлайном, поэтому тут он проставлен каждому фрагменту.
Редакторы статей и вики: вставляйте в режиме «исходный код», иначе редактор перепишет разметку по-своему.
Markdown и BBCode отдают код без цвета — подсветку там рисует сама площадка, ей нужно только название языка.