Как я могу добавить значок в букмарклет в Firefox?

Вы можете попробовать этот трюк:

1. Найдите нормальную ссылку (без JavaScript) для сайта с правильным значком.

2. Добавьте эту ссылку на панель инструментов закладок как обычную закладку.

3. Наконец, измените свойства только что добавленной закладки и измените местоположение так, чтобы оно было фактическим желаемым букмарклетом JavaScript, который вы хотите (вы хотите местоположение из букмарклета, у которого нет значка).

Теперь вы превратили закладку из шага 2 в букмарклет с нужным значком и JavaScript.

Расширение Favicon Picker 2 позволит вам сделать это.

Как использовать: просто щелкните правой кнопкой мыши любую закладку и выберите "Свойства"
затем нажмите "Обзор...", чтобы выбрать значок, или вставьте URL-адрес к значку.

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

Для Firefox 4+ используйте Bookmark Favicon Changer. Старые надстройки Favicon Picker не обновляются.

Работает по состоянию на июль 2020 г.:

Я нашел единственный разумный способ получить значок для javascript: закладка импортируется с помощью Import bookmarks from HTML вариант в следующем формате (полученный путем экспорта в HTML):

<!DOCTYPE NETSCAPE-Bookmark-file-1>
<!-- This is an automatically generated file.
     It will be read and overwritten.
     DO NOT EDIT! -->
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<TITLE>Bookmarks</TITLE>
<H1>Bookmarks Menu</H1>

<DL><p>
    <DL><p>
        <DT><A 
        HREF="javascript: (function() { if (window[%22_gainNode%22]) { window[%22_gainNode%22].gain.value = parseFloat(prompt('Set the audio gain')); return; } var v = document.querySelector('video'); var audioCtx = new AudioContext(); var source = audioCtx.createMediaElementSource(v); var gainNode = audioCtx.createGain(); gainNode.gain.value = parseFloat(prompt('Set the audio gain')); source.connect(gainNode); gainNode.connect(audioCtx.destination); window[%22_gainNode%22] = gainNode; } )();" 
        ICON="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAB3UlEQVQ4jb2SS2gTURSGD7oWEQQzBUHUjY/ccrMRtRvxBheiG3dCQV3M+EDrg5koLZ0b0rRWkYIFa9GWENBFRelS0EyDCIbOjG1ScjvqnKBUS0VxozsXx0WZFpPUogsPnM2B7+OH8wP8z/GDGvNna9knz16UT6fS87qUG1eFiGitV8XjbhUnPYXkKaT+oRzppk1GKt0BAAAf4m0b3u8WO7BVtNVY8mgYT57A1uTloP1Cj6dqKgKjvSRvLAos+QiQiWPIxE9kguq3PDpG9XCp8pbOd/XSmWsZMiw5DchEqRmMTJDvzjQIim6Fsndy1H3rLumm/QmQiYVmcJg41AB7CqlQmqab9x9SZnCUDEt+BWRiasUEr1VjgskK9Q3lyR4YJt2S8xDGDxorCcoPxhsErypvqMPup3OdWTJMOQMAAO92Htjlbdt3u7RlD7lb99LU9v3fkImB4NSVvDeLn+slF7v7Fr9gyvGlf09oPONonByNU0Hj96L7yyBY56vQcqvhXCToHRwh3bRJN+XVJYHTwnORYCLGU00LpfCwr8L846fFL7opf5zt7Nm8LIjx55HAaeHpP7VTSrkmdX14/W9HR+P+coLE2Kodr59iLHHS0fh3R+MfC5sSR/5a8K/zC9LelkXBQu43AAAAAElFTkSuQmCC">
        Bookmark name
        </A>
    </DL><p>
</DL>

• Обратите внимание, что кавычки javascript необходимо заменить одинарными кавычками или%22.
• Значок должен быть изображением PNG с кодировкой base64.
• Игнорируйте строку "НЕ РЕДАКТИРОВАТЬ"
• Редактирование адреса / javascript после импорта избавит от значка
• При редактировании имени / папки с закладками после импорта значок сохранится.
• Закладка, скорее всего, не будет отображаться ни в одной папке после импорта, вам придется искать ее либо по имени, либо по части href.
• Сохраните файл как HTML и импортируйте его Ctrl+Shift+B>Import and Backup>Import bookmarks from HTML
• При импорте файла никакие существующие закладки не будут перезаписаны, однако рекомендуется резервное копирование (на всякий случай).

Если вы импортируете данный пример, вы получите управление усилением громкости видео на любой вкладке с помощью AudioContext. Он имеет значок динамика и название закладки.

Самый простой способ - взломать закладку. Просто добавьте в закладки страницу, у которой есть значок, который вы хотите использовать. Возможно, вам придется нажать на закладку, чтобы загрузить значок со страницы, на которую он ссылается. Получив значок, перейдите к закладке, щелкните правой кнопкой мыши и выберите свойства. Затем вы можете изменить "местоположение" на код javascript для букмарклета, который вы хотите связать со значком. Совет: Чтобы отличить букмарклет от закладки, я меняю "имя" на вкладке свойств на то, что предшествует M:, например, если бы букмарклет предназначался для создания сокращенного URL-адреса с помощью goo.gl, я бы назвал это "M:Goo.gl"

Вы можете сделать это с userChrome.css:

1. Идти к about:support

2. В разделе "Основы применения", "Папка профиля", нажмите "Открыть папку"

3. Если не существует, создайте папку chrome, затем файл userChome.css

Я использую этот стиль:

:root {
  --amber: #FFC000;
  --chartreuse: #B2D733;
  --magenta: #BF1449;
  --teal: #158466;
  --vermilion: #FF4000;
}
#PlacesToolbarItems image {
  padding-top: 16px;
}
#PlacesToolbarItems toolbarbutton:nth-child(5n+1) image {
  background: var(--teal);
}
#PlacesToolbarItems toolbarbutton:nth-child(5n+2) image {
  background: var(--chartreuse);
}
#PlacesToolbarItems toolbarbutton:nth-child(5n+3) image {
  background: var(--amber);
}
#PlacesToolbarItems toolbarbutton:nth-child(5n+4) image {
  background: var(--vermilion);
}
#PlacesToolbarItems toolbarbutton:nth-child(5n+5) image {
  background: var(--magenta);
}

Если вы хотите использовать изображения, которые вы можете, просто поместите их в ту же папку, а затем ссылку, как это:

background: url("something.png");

http://github.com/cup/bay/blob/33aed8d/firefox/userchrome.css

1. Экспорт закладок в формате HTML.

2. Редактировать HTML, добавить ICON="data:image/png;base64,..." в ваш букмарклет, т.е.

   <DT><A HREF="javascript:(function(){ ... })();" ICON="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAgMAAABinRfyAAAABGdBTUEAALGPC/xhBQAAAAxQTFRFAQMAXV9chIaDx8nGZHRYHgAAADhJREFUCNdjYAAD8QkMDFz//zcw8P//f4CBNTTUgYHbZvMB3AS7TfEBBq5VqxpAxAQGztCwALBBALHhF442ZwQdAAAAAElFTkSuQmCC"></A>
   

3. Импорт закладок из отредактированного HTML.

Работает в Firefox на данный момент.