Перейти из форума на сайт.

НовостиФайловые архивы
ПоискАктивные темыТоп лист
ПравилаКто в on-line?
Вход Забыли пароль? Первый раз на этом сайте? Регистрация
Компьютерный форум Ru.Board » Компьютеры » Программы » Mozilla Firefox: стили userChrome.css и скрипты js

Модерирует : gyra, Maz

 Версия для печати • ПодписатьсяДобавить в закладки
Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88

Открыть новую тему     Написать ответ в эту тему

gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору



В теме обсуждается настройка внешнего вида Firefox с использованием userChrome.css, userContent.css, а так же использование скриптов js (uc.js).

Родственные темы: Mozilla Firefox | Расширения для Firefox
 
Обсуждение на "Форуме Mozilla Россия":
Настройка внешнего вида Firefox в userChrome.css,
UCF - ваши кнопки, темы, дополнения, скрипты…
 
Темы на GitHub:
Aris-t2 CustomCSSforFx | Aris-t2 CustomJSforFx | xiaoxiaoflood/firefox-scripts | Endor8/userChrome.js | Alice0775 userChrome.js  
VitaliyV UCF - UserChromeFiles


Просьба публикуемые коды заключать в тэг [code][/code] (из выпадающего меню), а коды более 10 строк - в двойной тэг [more][code][/code][/more]
 
Как подключить скрипты JS:
метод Aris-t2 | метод xiaoxiaoflood | метод Endor8 | метод user_chrome_files (UCF)
Как подключить скрипты JSM, MJS в загрузчик скриптов от Aris-t2 , а если у вас Firefox v117+, то дополнительно...
 
Еще один способ активации, нюансы: скрипты можно поместить в пользовательслую папку, можно не прописывать активацию каждого скрипта отдельно.
 
Куда вписывать код для стиля userChrome.css и userContent.css
Также не забываем про такую строку в user.js / prefs.js (для включения userChrome.css и userContent.css):
Код:
// Turn on userChrome.css and userContent.css support
// Включить поддержку userChrome.css и userContent.css
user_pref("toolkit.legacyUserProfileCustomizations.stylesheets", true);  
либо эту настройку включить через about:config.
 
Полезные ссылки
 
Онлайн-конвертер иконок в\из Base64
Онлайн-редактор иконок SVG
Онлайн-конвертер SVG to Data URI
Мануал по определению CSS-селекторов элементов интерфейса встроенными средствами браузера

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 08:34 29-07-2023 | Исправлено: gutasiho, 09:49 30-08-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Death_INN
Цитата:
когда кликаешь по полю поиска на домашней странице, то высота поиска уменьшается на 2 пикселя

Да, я знаю. Меня не сильно это напрягает, но тем не менее есть над чем работать.

Всего записей: 1443 | Зарегистр. 12-10-2002 | Отправлено: 17:36 15-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Samotek
Цитата:
На панели задач у меня лежат несколько закладок, которым я бы хотел назначить свои иконки.

Код:
/* userChrome.css */
/* Bookmark icon (favicon) */
.bookmark-item[label="bookmark22"] image {
    width: 0pt !important;
    height: 0pt !important;
    padding: 0 0 16px 16px !important;
    background: url('bookmark22.png') !important;    /* use 16x16 pic */
}

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 18:08 21-08-2024 | Исправлено: gutasiho, 18:14 21-08-2024
Samotek

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho

Цитата:
background: url('bookmark22.png')

Спасибо! Я так понимаю, что  label="bookmark22" - это моя ссылка,  а куда положить этот 'bookmark22.png'?

Всего записей: 2537 | Зарегистр. 18-05-2005 | Отправлено: 20:05 21-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Samotek
Так первая же догадка - иконка должна лежать рядом с userChrome.css.
Цитата:
label="bookmark22" - это моя ссылка,
Не ссылка, а имя закладки, под каким она отображается. Имя закладки и иконки должны совпадать.
Если иконки сложить в свою папку, то строка будет выглядеть так
Код:
background: url("file:///С:/path path/path/path/Chrome/icons/bookmark22.png") !important;

Код:
background-image: url(.....

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 07:18 22-08-2024 | Исправлено: gutasiho, 08:23 22-08-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Samotek

Цитата:
а куда положить этот 'bookmark22.png'?

да хоть никуда, еcли сконвертить в data:image

Всего записей: 3427 | Зарегистр. 24-10-2002 | Отправлено: 08:31 22-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN
В примере выше вместо реального пути как указать относительный?

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 08:35 22-08-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Добрый день!
Почему .ccs файл не работает по пути @import "./folder_1/folder_2/123.css";
А по пути @import "./folder_1/123.css"; работает, т.е. на папку меньше.

Всего записей: 1443 | Зарегистр. 12-10-2002 | Отправлено: 09:48 22-08-2024 | Исправлено: grom17, 11:32 22-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
grom17
Я от этого далек, но вроде количество точек спереди определяет глубину вложения, попробуйте две точки, но и не всегда это работает.

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 09:53 22-08-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho,
"\profile\chrome\css\test.css" и в нем прописан путь до image.png
 
"image.png" или "./image.png" - файл находится в том же каталоге (css) где и test.css
"../image.png" - файл находится в родительском каталоге (chrome) и с него будет начинаться путь
"../../image.png" - файл находится в прародительском (дедушкином) каталоге (profile) и с него будет начинаться путь
 
Т.е. относительный путь зависит от месторасположения файла со стилями
 
grom17, должно все пахать, но я никогда не тестил файлы и папки с русскими символами или с пробелами

Всего записей: 3427 | Зарегистр. 24-10-2002 | Отправлено: 10:15 22-08-2024 | Исправлено: Death_INN, 10:30 22-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN
Ужос! А для такого случая?
"\profile\chrome\css\test.css"
"\profile\chrome\icons\image.png"

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 10:57 22-08-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho, chrome - родительский каталог для test.css
"../icons/image.png"

Всего записей: 3427 | Зарегистр. 24-10-2002 | Отправлено: 11:06 22-08-2024
grom17



Advanced Member
Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Death_INN

Цитата:
никогда не тестил файлы и папки с русскими символами или с пробелами

Я тоже не тестил, это я для наглядности. На всякий случай исправил.
 
Добавлено:
gutasiho
Цитата:
количество точек спереди определяет глубину вложения, попробуйте две точки, но и не всегда это работает.

Ранее я задал этот вопрос на https://www.reddit.com и получил тот же ответ. К сожалению это не сработало.
Не хотелось бы сваливать файлы в одну кучу. Хочу разложить всё по полочкам, ой пардон, по папочкам.

Всего записей: 1443 | Зарегистр. 12-10-2002 | Отправлено: 11:31 22-08-2024
Samotek

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho

Цитата:
Так первая же догадка - иконка должна лежать рядом с userChrome.css.

Спасибо! Все получилось. Но, так как у меня имя закладки на латинице, пришлось перекодировать userChrome.css в UTF-8 с BOM. А еще у вас в примере для меня в имени закладки используются двойные кавычки, а в имени иконки - апостроф. И так работает. А в ответе на мой второй вопрос в имени иконки вы используете двойные кавычки. Это можно и так и так?

Всего записей: 2537 | Зарегистр. 18-05-2005 | Отправлено: 11:46 22-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Death_INN
Спс, буду пробовать.
Samotek
Цитата:
 так как у меня имя закладки на латинице, пришлось перекодировать userChrome.css в UTF-8 с BOM.
У меня тоже на латинице. Все css, js должны быть в UTF-8 без BOM, это стандарт. Видимо, что-то у вас не так.
Апостроф, двойные кавычки - работает так и так, но лучше сделать все на двойных кавычках.
 
Добавлено:
Кстати, вертикальный тулбар от Aris-t2 пару недель назад обновился, иначе был несовместим с v129.

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 11:59 22-08-2024
Samotek

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho

Цитата:
Все css, js должны быть в UTF-8 без BOM, это стандарт. Видимо, что-то у вас не так.  

Было win-1251 латиница. Не так у меня с определением с вом или без! . Но все работает, значит все правильно. Спасибо еще раз!
 
Добавлено:
Samotek
Кстати .bmp то-же кушает!

Всего записей: 2537 | Зарегистр. 18-05-2005 | Отправлено: 12:31 22-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Samotek
Когда сомневаюсь в кодировке, открываю стиль в AkelPad (перетаскиваю), он в строке статуса пришет конкретно
   
bmp худший вариант, размер картинки значительно больше.

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 12:51 22-08-2024 | Исправлено: gutasiho, 13:03 22-08-2024
xrun1



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Наличие "./" в пути ни на что не влияет, можете сами проверить. Это просто визуально означает, что отсчёт будем начинать от папки, в которой находится конкретный .css. Как поступает с этим FF не интересовался - или автоматически убирает или автоматически добавляет к пути.
"../" означает переход на уровень вверх при вложенности папок, аналогичен команде "cd .." в командной строке.
grom17

Цитата:
@import "./folder_1/folder_2/123.css";

Работает, скопировал прямо отсюда. Проверьте ещё раз кодировку файла, правильная постом выше.

Всего записей: 813 | Зарегистр. 26-12-2009 | Отправлено: 17:13 22-08-2024
gutasiho

Gold Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
xrun1
Если у чела наворочено со стилями, то может влиять очередность подключения стилей, например, def.css не будет срабатывать, а 1_def.css будет срабатывать.
 
Добавлено:
Я с таким точно сталкивался, когда стили держал в userChrome.css без импорта, стиль в конце файла никак не срабатывал, перемещаю в начало файла - и срабатывает.

Всего записей: 7303 | Зарегистр. 14-09-2020 | Отправлено: 17:18 22-08-2024
xrun1



Advanced Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho
«Есть многое на свете, друг Горацио, что и не снилось нашим мудрецам». (с)
Я тут иконку на кнопку менял. Из одной папки подхватывается, из другой нет, пути абсолютно верные. Кругом чудеса и загадки!

Всего записей: 813 | Зарегистр. 26-12-2009 | Отправлено: 18:48 22-08-2024
Death_INN

Silver Member
Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
gutasiho

Цитата:
стиль в конце файла никак не срабатывал, перемещаю в начало файла - и срабатывает

можно сделать, чтобы срабатывал при любом расположении
 
xrun1

Цитата:
Из одной папки подхватывается, из другой нет

значит с именем папки косяки. Часто траблы бывают, когда вместо стандартного тире стоит длинное, как у грома, и т.п. А может неверный путь задан

Всего записей: 3427 | Зарегистр. 24-10-2002 | Отправлено: 20:01 22-08-2024 | Исправлено: Death_INN, 20:03 22-08-2024
Открыть новую тему     Написать ответ в эту тему

Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88

Компьютерный форум Ru.Board » Компьютеры » Программы » Mozilla Firefox: стили userChrome.css и скрипты js


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru