Улучшение среднего опыта

uluchshenie srednego opyta?v=1656646216

от Седрик Амайя

Одно расширение браузера за раз.

5ykRlwzkzFJzHOky-2arac3AWBNCySxbrPAD
Фотография Barn Images на Unsplash

Я люблю Medium. Как потребителя он предоставил мне бесчисленное количество статей, которые помогли мне улучшить себя как лично, так и профессионально. И как продюсеру, это обеспечило меня платформой, на которой я могу выразить себя максимально искренне через письменное слово.

Однако, начиная с использования Medium, я заметил некоторые вещи в платформе издательства, которых мне недостает или которые можно усовершенствовать. И как веб-разработчик и мастер, я люблю самостоятельно выдумывать решения для этих проблем. Вот несколько расширений, которые я создал, чтобы улучшить работу с Medium.

Средние букмарклеты?

Первый случай, когда я пытался улучшить опыт работы с Medium, был с моим веб-расширением Firefox, Medium Bookmarklets (которые, как я узнал после того, как назвал продукт, на самом деле не букмарклеты).

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

Как это работает

Поскольку я знал, что элементы HTML в статьях Medium содержат уникальный id атрибут, я разработал решение, которое добавило маркер/подсветитель к выбранному элементу. Это соответствовало бы абзацу, заголовку или цитате в статье, где пользователь хотел сохранить свое место, что, в свою очередь, сохранило этот элемент id.

Переход непосредственно к этому месту в статье производится с помощью идентификатора фрагмента сохраненного id. Например, если этот абзац имел id с «3b75», тогда, чтобы открыть эту статью с этим конкретным абзацем в верхней части страницы, URL будет выглядеть примерно так https://blog.cedricamaya.me/improving-medium-experience-7df7e233c678#3b75 . Обратите внимание на идентификатор фрагмента (#3b75) в конце.

Эта же функция обычно используется авторами/редакторами для включения содержания в свои статьи на Medium. Вот замечательное объяснение и указания с более подробным описанием.

Помня об этой функции, я разработал надстройку Firefox, которая создала боковую панель карт, которые можно нажать, которые представляли сохраненные пользователем букмарклеты, как я их назвал. Обработчик события щелчка на каждой карте будет перемещать текущую страницу в букмарклет URL. Итак, если вы разместили a букмарклет на полпути длинной статьи, необходимость прокручивать в ту главу, где вы последнее остановились, была полностью устранена.

zBx9xbR2vlqxbauf-L4tmKI7yLpTkrqgf5d-
Рекламное изображение, демонстрирующее боковую панель средних букмарклетов и выделение закладки в статье.

У Medium Bookmarklets есть больше функций, таких как необходимость добавить в белый список публикации, которые вы хотите сохранить букмарклеты от (по соображениям безопасности), а также оповещения, когда a букмарклет он добавлен или удален. Кроме того, это достаточно простое расширение, которое имеет целью улучшить ваши возможности создания закладок.

Проверить Средние букмарклеты из приложений Mozilla.

Подпись ✍️

Если Medium Bookmarklets разработан с учетом потребителей Medium, то Signature был разработан для тех, кто создает содержимое на Medium.

Цель Signature проста: предоставить авторам и редакторам возможность мгновенно добавлять подпись своего блога/выходить из него одним нажатием кнопки, устраняя необходимость каждый раз копировать и вставлять или повторно вводить его.

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

Я подумал: «Люди каждый раз, когда пишут новую публикацию в блоге, набирают эту подпись или копируют и вставляют ее из предыдущей статьи?» Несмотря на это, повторный ввод или копирование и вставка требует времени, и, желая упростить процесс, я разработал другое расширение для браузера (на этот раз для Chrome и Firefox), чтобы решить эту проблему.

Как это работает

После установки подписи пользователи просто заполняют подпись своего блога в редакторе, который можно найти на странице опций расширения. Этот редактор, экземпляр Quill, является редактором форматированного текста, то есть любое форматирование текста (т.е. жирный шрифт, курсив, цитаты, заголовок, код и т.д.) можно легко перенести и применить к черновику публикации блога Medium, также использующей возможность форматированного текста.

После определения подписи на странице настроек пользователи смогут нажать кнопку «подпись» (с пиктограммой перо), расположенную во встроенной подсказке, как показано ниже. После нажатия этой кнопки подпись, определенная на странице настроек, будет вставлена ​​в черновик.

h8kqbC09qw8J2Bu96z0DXb5rcC8wwEniR1sK
Кнопка «Подпись» справа.

Но достаточно говорить о том, как это работает – давайте посмотрим на действие!

R48SQUC-Qy8E5kJOQFanlP2zVzDYhvN8diZ5
Подпись добавлена ​​на странице настроек, а затем кнопку «подпись», которая используется для добавления подписи в среднем черновике.

Проверить Подпись из дополнений Mozilla и веб-магазина Chrome.

Вынос

Как и все остальные продукты, Medium имеет свои недостатки. Однако, творчески используя свое воображение и отношение к «сделай сам», вы можете значительно улучшить эти проблемы с помощью небольшого программирования.

Теперь поощряю ты чтобы улучшить опыт Medium по-своему и поделиться результатом с помощью #MediumExperience. Если вы не можете придумать собственную идею или только начинаете программировать, вводите новую функцию или исправляйте ошибку в Medium Bookmarklets или Signature — оба они имеют открытый код и их можно найти на GitHub.

cedricium/medium-bookmarklets
? medium-bookmarklets – простой способ сохранить свое место в статьях Medium и вернуться к ним позже.github.com cedricium/подпись
✍️ Подпись – средние подписи, упрощенные.github.com

Спасибо за чтение, и я с нетерпением жду, как вы решите улучшить опыт Medium!

~ седрик амайя
? обладатель, который любит создавать вещи с помощью кода
GitHub | LinkedIn | Twitter

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *