I want to know whether the APIs available to Google Chrome extensions enable changes the appearance (colors, styles, etc.) of page contents without modifying the HTML?
For example, when spelling or grammar support is enabled, Chrome will underline phrases that contain problems. The browser doesn't appear to change the markup of the page to accomplish this. Does the extensions API have that kind of feature?
I'm thinking of writing a sort of writing assistant extension that would behave similarly to the spelling or grammar checkers. I'd like my extension's display to be similar to those checkers.
Related
I know the Stylus and Stylish (not recommended) browser extensions that can re-style a given website (basically by customizing CSS).
In this comment, the author states this can be done via "user stylesheets".
How is it possible to use "user stylesheets" to modify the style of www.example.com and a different style for www.example2.com?
Is it something that can be done without requiring a third-party browser extension, if so, how/where in the browser options should we add our custom CSS?
This seems to be deprecated nowadays:
https://codereview.chromium.org/66383005/
Remove the concept of user stylesheets.
-The support for this has been removed from Chromium already.
This is now just deleting dead code.
...
Our office has an email/filing system that is web based (runs on our local servers/intranet) and whilst the functionality is mostly there, it looks like an absolute pig; something that the creators of it appear to have no interest in fixing as it's looked awful for years.
Is there any way I can force the page to load with my own style applied? I use google chrome and have a decent (though not advanced) knowledge of creating web pages.
As far as I can tell, the system doesn't use CSS. I think it's all HTML?
I think you could use JavaScript and CSS to add your own style to the pages on load. Chrome has an extension called Tampermonkey that lets users create userscripts, which are scripts run automatically on pages you specify.
If you create your own style, you can use it on the page with a script like this (this is the jQuery function, I'll try to find out how to do it in plain JS):
$('head').append("<style>//your style</style>");
This should apply the style. If you set the script as a userscript in Tampermonkey, it will run automatically.
Tell me if you would like more details or if I need to be more clear! You can find Tampermonkey at this link on the Chrome store- their website is here.
I currently have a form that allows administrators to change basic CSS attributes on a website. I was thinking of creating a form for advanced admins that will display the entire CSS file inside a text area and allow them to edit it freely. Im not worried about the file being wiped as it can be easily restored. What i am worried about is that someone could add some code to the CSS file that could cause major damage to the web server. Is it possible to execute malicious code from a CSS file?
Yes, there are some XSS risks to consider. XSS doesn't attack your webserver directly with malicious code. It is an attack on other users of your system, via their own browser. Basically, it is a browser based code execution flaw, albeit limited via what JavaScript can do (quite a lot though, bar from escaping from the browser sandbox).
As you are letting them edit text presented in a CSS file, this mitigates some of the attacks that are only possible when CSS is embedded in an HTML document (such as via STYLE="" attributes and <style> tags).
However, the following risks are still present:
The JavaScript expression directive allows JavaScript to be inserted into a CSS stylesheet. Note that this only affects Internet Explorer version 8 and earlier.
The url directive can allow JavaScript: style URLs on Internet Explorer 6.
Script execution via -moz-binding is available on Firefox 2 and 3. The Google Browser Security Handbook doesn't appear to have been updated since Firefox 3. This post indicates this is now fixed so that the XML file has to be readable from your own domain. XBL doesn't seem to be possible in current versions of Firefox.
In Internet Explorer 10 and earlier HTML Components allow script execution in CSS.
Note that allowing users to alter your CSS gives them the ability to freely position text. This would enable a malicious user to mimic trusted UI elements with their CSS code and possibly being able to trick users with the newly rendered page. This very much depends on the functionality present and the intent of the rest of your site. Definitely bear this in mind.
It can if they have access to modify. The below link describes xss and css (cross site scripting). They can redirect your background as one example
http://www.acunetix.com/websitesecurity/cross-site-scripting/
If they have access to the css file they can link it to another file that contains malicious content
Potential xss vulnerability if style.css is served with the wrong content-type header.
style.css
<script>
alert(document.cookie)
</script>
attack.html
<iframe src="style.css"></iframe>
I'm looking to create an extension for personal and possibly personal friend usage as well that simply changes a few colors that are displayed on a website I visit. I use Reddit Enhancement Suite, which has options for 'Night mode' that completely changes the color appearance of Reddit.
I would like to know how to edit or inject CSS code to this website so that the colors used in the website are what I would like them to be when I view the page. Mind you, this is of course just in my browser or in another Chrome browser using my extension.
You can do exactly as you said: you can inject a CSS file or code into the page.
The easiest way is through the manifest (look at the CSS property).
You only need to complete your manifest.json in order for Chrome to know in which pages it has to insert your CSS file into.
If you want to decide programatically when to insert the CSS, you can use chrome.tabs.insertCSS(), where you can insert a CSS file or just the code as a string.
Instead of an extension, you could also do it in a user script. Then you can simply use GM_addStyle, just like with Greasemonkey scripts. It's much simpler to write and more lightweight in terms of memory usage.
There are already extensions made for this. The one I use is called Stylish, which only modifies appearance using CSS3 only, and not html. There are other extensions as well, do some google searches and you will find a few more.
I would like to know if somebody knows a method to embed custom html in foreign websites.
Maybe there's a firefox extension or something like that (like stylish for example, but for html instead of css)
Actually, that's where the Greasemonkey Add-on is for. Once you have that installed, you can create scripts which manipulate the DOM of any website you would like:
Allows you to customize the way a
webpage displays using small bits of
JavaScript.
Hundreds of scripts, for a wide
variety of popular sites, are already
available at http://userscripts.org.
You can write your own scripts, too.
Check out http://wiki.greasespot.net/
to get started.
Also nice to know is the fact that the latest version of Chrome, and also Opera (don't know since when, but longer than Chrome) supports userscripts out of the box (no need to install any add-ons).