Преобразование средних сообщений в уценку для вашего блога
Как быстро экспортировать статьи Medium в свой блог
Если вы, как и я, начали вести блог на Medium, но также хотите создать свой собственный веб-сайт для отображения своих статей, вам понадобится способ переноса статей с Medium на язык Markdown. Markdown - это легкий язык, предназначенный для преобразования в HTML для Интернета, и есть несколько инструментов, которые позволяют перейти от существующих статей Medium к Markdown для блога.
(Если у вас еще нет блога, следуйте этому руководству, чтобы создать собственный веб-сайт за пять минут, используя страницы Jekyll и GitHub.)
Инструменты от среднего до Markdown
Существует как расширение Chrome, так и инструмент командной строки для переноса ваших сообщений на Medium в Markdown. К сожалению, я обнаружил, что расширение Chrome ненадежно, и если оно действительно работает, оно вызывает ряд ошибок форматирования, которые необходимо исправить.
Если вы можете заставить расширение Chrome работать и вам неудобно работать в командной строке, то это, вероятно, лучший выбор для вас. Однако я обнаружил, что инструмент командной строки лучше подходит для моего использования, потому что он работает каждый раз и требует меньшего количества повторных настроек текста после запуска.
Использование Medium-to-Markdown в командной строке
Пакет средней до уценки написан на Javascript, что означает, что вам потребуется node для запуска и npm для установки пакета. Если вы работаете в Windows, используйте эту страницу для установки обоих (это займет около 3 минут). Затем установите пакет с помощью npm install medium-to-markdown. Фактический сценарий, который вам нужно будет запустить, доступен здесь и также показан ниже.
Для запуска сохраните сценарий как medium-to-markdown.js, измените "<medium post url"> на адрес опубликованного сообщения и введите node medium-to-markdown.js в командной строке (убедившись, что сценарий находится в вашем каталоге.
Это выведет весь пост как Markdown в вашу консоль. Чтобы перенаправить вывод в файл, вы можете ввести node medium-to-markdown.js >> file.md. Если вы используете GitHub Pages + Jekyll для своего блога, вам нужно сохранить файл md в каталоге _posts/ репозитория как date-title.md. Например, мой последний почтовый файл - _posts/2018-09-16-Five-Minutes-to-Your-Own-Website.md. После преобразования статьи в файл Markdown с правильным именем ее можно опубликовать, отправив репозиторий на GitHub.
Лично мне этот процесс переименования файла вручную показался утомительным, поэтому я написал сценарий Python, который принимает URL-адрес опубликованного сообщения Medium вместе с датой, вызывает сценарий преобразования medium-to-markdown.js с URL-адресом и сохраняет полученную уценку в правильном файле. имя. Сценарий можно найти здесь, а использование командной строки - ниже:
В целом, запуск сценария занимает 15 секунд, а обновление веб-сайта - около 5 минут! Зайдите в свой блог, чтобы увидеть визуализированную статью.
Решения общих проблем
И расширение Chrome, и инструмент командной строки создают незначительные проблемы в Markdown, которые вам необходимо исправить. Я все редактирую в Онлайн-редакторе прозы, и мне нравится открывать редактор и исходную статью на Medium рядом. (Я также часто использую инструменты разработки Chrome - щелчок правой кнопкой мыши и inspect - в моем блоге, чтобы настроить CSS и сразу увидите изменения.)
Ниже приведены некоторые из замеченных мною проблем и способы их устранения. Я предполагаю, что вы работаете с GitHub Pages и Jekyll для своего блога (следуйте этому руководству, чтобы начать работу), хотя эти советы могут работать с другими фреймворками. Эти решения не являются исчерпывающими, поэтому, если у вас возникнут другие проблемы, дайте мне знать в комментариях или в Twitter.
Подписи к изображениям
Как вы можете видеть выше, при преобразовании по умолчанию в Markdown подписи к изображениям отображаются с выравниванием по левому краю под изображением. Чтобы центрировать подписи, добавьте следующее в ваш styles.scss файл (в корневой каталог репозитория):
// Captions for images
img + em {
font-style: italic;
font-weight: 600;
margin-bottom: 20px;
margin-top: 8px;
display: block;
text-align: center;
font-size: 14px;
color: black;
}
Затем в самой Markdown измените текст заголовка с отображаемого по умолчанию сверху вниз. Убедитесь, что заголовок находится в отдельной строке:
Подпись теперь будет по центру под изображением.
Если вам не нравится этот стиль, измените CSS, указанный выше.
Изображения бок о бок
Для рендеринга изображений бок о бок в разметке вы можете использовать таблицу из двух столбцов.
Я обнаружил, что вам нужно включить заголовки, иначе таблица отображается неправильно. Есть пара других вариантов, но таблица работает хорошо.
Вот пустой код таблицы, поэтому просто замените image_link и header:
Header Left | Header Right :--------:|:-------:  | 
Блоки кода
Если вы много пишете о программировании, то хотите, чтобы ваш код выглядел великолепно! К счастью, в отличие от Medium, вы можете использовать подсветку синтаксиса, чтобы блоки кода появлялись в вашем блоге. Jekyll изначально поддерживает выделение румян, у которого есть множество стилей на выбор (просмотреть их здесь).
В Markdown для статьи окружайте блоки кода обратными кавычками и укажите язык для выделения:
```python
from sklearn.ensemble import RandomForestClassifier
# Create the model with 100 trees
model = RandomForestClassifier(n_estimators=100,
bootstrap = True,
max_features = 'sqrt')
# Fit on training data
model.fit(train, train_labels)
```
Подсветка синтаксиса по умолчанию выглядит так:
При использовании настраиваемой темы выделение выглядит следующим образом:
Чтобы установить собственную тему кода, обратитесь к этой статье или, если вам нравится мой вид, вы можете скопировать и вставить мою таблицу стилей кода code-highlighting.scss (ссылка) в свой _sass/ каталог. Затем измените строку в style.scss, которая читает @import “highlights” на @import “code-highlighting" (это должно быть ближе к низу), чтобы вместо этого импортировать новый стиль.
GitHub Gists
Еще одна распространенная часть моих сообщений на Medium - это GitHub gists. Чтобы правильно отобразить их в ваших сообщениях, начните с перехода к исходной статье среднего уровня, щелкните правой кнопкой мыши на Gist и выберите inspect frame.
Откроется страница с непонятным кодом. Однако все, что вам нужно сделать, это скопировать то, что находится между тегами <script>, как показано ниже:
Просто скопируйте и вставьте эту строку в Markdown, как показано ниже, и она будет правильно отображена в вашем блоге.
Конечно, как и любой другой элемент на вашем веб-сайте, вы можете стилизовать блок с помощью CSS, как вам нравится!
Выдержки из сообщений
По умолчанию Jekyll будет показывать только первый абзац вашего сообщения на главной странице вашего блога с кнопкой «Подробнее» для доступа к остальным. Если у вас есть изображение вверху вашего сообщения, это все, что будет отображаться.
Чтобы расширить отрывок, добавьте в _config.yaml следующую строку:
# Specifies end of excerpt excerpt_separator: <!--more-->
Затем поместите <!--more--> tag в уценку поста там, где вы хотите, чтобы отрывок заканчивался.
Дополнительные соображения
Есть еще множество вариантов, которые я еще не изучал. Если вы хотите сделать что-то в своем блоге, есть шанс, что это можно сделать. Например, вы можете добавлять комментарии ко всем своим сообщениям, создав учетную запись Disqus и добавив ее в свой _config.yaml файл (руководство здесь). Если у вас много сообщений и вы хотите ограничить их количество на одной странице, вы также можете указать это, используя pagination в файле конфигурации (инструкции).
Создание веб-сайта - это увлекательно, потому что вы можете сделать его так, как хотите! Хотя большинству людей это может показаться не удивительным, я все же ценю, когда я делаю незначительное обновление своего сайта и могу видеть изменения в Интернете так, как я задумал. Вы не можете себе представить, как я был воодушевлен, когда наконец-то на моей странице «О нас» запустился живой редактор кода! В конце концов, да, создание веб-сайта - это возможность показать себя миру, но это также и гордость за то, что вы создали.
Выводы
Перейти от существующей статьи Medium к Markdown можно быстро с помощью инструмента командной строки. Есть несколько незначительных ошибок, которые необходимо исправить после преобразования в Markdown, но это также дает вам возможность настроить публикацию именно так, как вы хотите.
Если вы все еще не знаете, что делать, загляните в мой репозиторий веб-сайта, чтобы узнать, сможете ли вы найти там решение, или свяжитесь со мной. Более того, если вы найдете что-то интересное, что вы можете сделать с блогом Jekyll, я буду рад услышать об этом. А теперь иди и начни писать.
Как всегда, приветствую комментарии и конструктивную критику. Со мной можно связаться в Twitter @koehrsen_will или через мой сайт willk.online
