Как загрузить таблицу стилей и скрипт локально для сайтов, которые я часто использую и хочу настроить для личного использования?

Question

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

Например. Я могу открыть инструменты для разработчиков на любом веб-сайте и настроить все, что мне нравится. Есть ли способ сохранить эти изменения, чтобы каждый раз, когда вы посещаете веб-сайт, он применяет изменения, внесенные в инструменты dev. Или, возможно, загрузите определенные таблицы стилей на веб-сайты, которые я предварительно предустановил на своей локальной машине.

Куда бы я даже начал?

Я использую Windows-7-64bit, и мой предпочтительный браузер - хром. (упоминается в случае, если уже есть решения для этих программ, но не обязательно)

Спасибо за любой ввод!

Answer 1

У меня есть два Chrome Плагины:

Стильный для CSS: https://chrome.google.com/webstore/detail/stylish-custom-themes-for/fjnbnpbmkenffdnngjfgmeleoegfcffe?hl=en

И CJS для Javascript: https://chrome.google.com/webstore/detail/custom-javascript-for-web/poakhlngfciodnhlhhgnaaelnpjljija?hl=en

Answer 2

Поскольку он будет локальным и только для вашего просмотра, простой плагин для браузера должен сделать трюк. Там есть плагин/дополнение для Firefox и Chrome под названием «Стильный».

От их website: «Пользовательские стили позволяют изменить внешний вид веб-сайтов».

• Firefox version
• Chrome version

Answer 3

Я бы рекомендовал создать собственное хромовое расширение. https://developer.chrome.com/extensions

Расширения предоставляют множество возможностей, но то, на что вы хотите сосредоточиться, это параметр content_scripts в manifest.json.

"content_scripts": [ 
    { 
     "matches": [ 
     "<all_urls>" 
     ], 
     "js": [ 
     "path/to/my/script.js" 
     ], 
     "css": [ 
     "path/to/my/style.css" 
     ] 
    }, 
    { 
     "matches": ["http://www.google.com/*"], 
     "js": [ 
     "path/to/other/script.js" 
     ], 
     "css": [ 
     "path/to/different/style.css" 
     ] 
    } 
    ], 

Здесь вы можете указать разные URL-адреса для применения сценариев и css. Json, который я предоставил, будет применять определенные js/css для каждой страницы и некоторые js/css на любой странице, которая соответствует предоставленному регулярному выражению.

Подробнее: https://developer.chrome.com/extensions/content_scripts

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