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.
Related
I have a single complete HTML file which describes a webpage, and I would like to use this as the homepage for a Squarespace site. I would then like to design the other pages of the site as normal with the Squarespace editor UI, and have links to these pages from the homepage.
Does anyone know if it this can be done, and we can edit the HTML of a blank page from scratch in SqSp? I am aware of Code Blocks, but I can only seem to add a code block within an existing template.
Many thanks
For templates using Squarespace 7.0 (as opposed to 7.1 which at time of writing is the version that powers the templates currently promoted on Squarespace's website), this can be accomplished only by enabling Developer Mode and then making use of either static pages or a custom .region file, or both. This is something I do frequently.
As a disclaimer, I would not recommend enabling dev. mode on a live site or a site you have heavily invested time into unless you are experienced with dev. mode or are a very experienced developer in general. That is because there are consequences to enabling developer mode.
Besides the method described above, there are two other alternatives:
Use JavaScript to rewrite the page, which of course has its own drawbacks.
Use CSS to hide everything but the main body of the page, then use a code block in the body, pasting your code in there. Depending on your HTML, that might not work properly.
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 am working on a prototype for a project that is somewhat similar to the facebook's "like" button. Basically it's an embeddable piece of code that can integrated with any website.
I am looking for a way to fake this integration for a demo. Basically I want to show a familiar web page (like http://www.cnn.com) with my code already embedded. Since I obviously can't do the actual integration right now, I need some way of faking it.
The only thing I can think about is to use http://www.httrack.com/ to download the page I want, and then change it locally. The problem with this is that it is clear that the page is hosted locally and not on www.cnn.com.
Is there a better technique for doing this?
If you use Firefox browser, you can use Greasemoneky and with JavaScripts, embedd your content inside that page. You can eaven add events, that will open some popup windows, etc. to show action of such a script.
That is easy approach, there are ton's of examples in their forum, and good documentation, how to use it.
You can write your own userscript (i.e. greasemonkey) to modify the page on the fly.
Even though I think it's a bad idea to do this (not sure if stackoverflow allows to ask such questions), but what you can do is edit the hosts file (if you're on windows) and add a line
127.0.0.1 www.cnn.com
it means that when you visit the website cnn it will display the domain name in the browser but it will use your localhost server to display the content.
Is there a simple way to save an HTML page that has an external stylesheet (1 or more) referenced but force all of the rules to be inserted into the page itself, inline? So basically I want to move all external rules onto the elements that they affect themselves.
For what it's worth, I'm using nearly every major browser (incase the solution is browser-specific), and I'm on Windows (incase it's OS-specific).
I'm assuming you've seen the online tools that are available like this one? This online tool (which I have not tested but looks like it works) gives you the option of providing a url or source code and shows warnings for cross-browser compatibilities with your styles.
I use a tool that does something like that, but it was written for Ruby and TextMate for Mac. It is released by Campaign Monitor as a way of preparing HTML emails. It brings all the rules from the stylesheet and makes them inline styles.
It might give you a good start. I'll keep looking.
TextMate Email Bundle
The piece that does the heavy lifting is the TamTam RubyGem which brings the CSS inline. However, it seems to only support one style element (not link elements). If you could work with those restrictions, you could get it to work on Windows using Ruby and a ruby script file. Not quite drag and drop I'm afraid.
i use chrome extension Save Page WE
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).