news image
2025-08-02 02:03:29
До речі, є така проблема у браузерів, що вони не дозволяють керувати іконками для закладок. Підтягують автоматично з сайтів, або ставлять свою іконку за замовченням.

Якщо додавати в закладки сайти, це виглядає нормально. Бо у всіх різні favicons. Але якщо додавати js-букмарклети, то виглядають вони всі однаково. І це не зручно.

Як я для себе вирішив проблему?

1. Safari
В сафарі є класна функція - відключити іконки і залишити тільки текст. Зроблено для економії місця на панелі закладок. Клікніть правой клавішей на панельці і знайдете цей пункт. Відключаєте іконки, а в назву букмарклету додаєте emoji на початок. Emoji тут дуже гарно підходять, бо це звичайний UTF-8 текст. Всім своїм основним закладкам можна додати різні emoji.

В мене використовується:
📈 Devaka Tools

2. Chrome (і майже всі інші браузери)
В хромі немає такої функції - відключити іконки. Тому задача вирішується трохи складніше. Потрібно експортнути закладки, відредагувати файл, і новий файл імпортнути.

В файлах закладок використовується звичайний HTML документ, де закладки це посилання <A>, і в них є атрибути. Іконки зберігаються в атрибуті ICON в форматі base64.

- Знаходите потрібну іконку. Наприклад, https://devakatalk.com/favicon.ico
- В залежності від формату файлу іконки, шукаєте конвертер в base64. Ось цей гарний:
https://base64.guru/converter/encode/image/ico
- Вставляєте свій URL, або завантажуєте з компа іконку, обираєте формат Data URI і за секунду конвертуєте.
- Копіюєте результат і вставляєте в атрибут ICON в файл закладок.
- Імпортуєте нові закладки назад в браузер.
- Насолоджуєтесь нормальними закладками!

На фото як виглядає букмарклет у мене в хромі.
Читати в Telegram