Is there any way to permanently alter how a webpage displays on the client-side (without server access)? - html

Firebug lets you edit individual web pages locally, with live updating so you can see the effects of your changes right away. Unfortunately, these changes are lost after the page is refreshed.
Is there any way to make these changes "sticky" in some way, such that repeated visits to the site would reload your own customized html/css that you edited? I'm thinking perhaps some sort of Firebug feature that I'm missing, or another plugin of some sort...
Just to be clear, I'm not talking about websites I have server side access to. I would simply like to be able to reposition the content of some pages I visit frequently so it fits better on my monitor setup, which I can do in Firebug but I have to do it every time the page loads (I would like to be able to avoid having to do that).

You should make use of the Greasemonkey and / or Stylish addons for Firefox.
These where originally developed to do exactly what you intend to achieve.
Also check out this article on how to get started with Stylish.

Related

How to permanently save Web page modifications

So I've made some little modifications to a particular website (background color, fonts, etc...) and I want these changes to be permanently applied for the next visits.
The issue is when I refresh the website, it goes back to its initial form.
Wether it's for Google or Safari web browser, is there a way to accomplish such task?
The thing is that each time you enter a website your browser downloads the whole DOM code of this site. The changes you make with Chrome's or Safari's dev tools applies only for the already-downloaded DOM that is displayed on your browser, but next time you will enter the same website, a new DOM will be downloaded and displayed - without your changes.
So, actually, I'm sorry but what you want is not possible.
What you can do is:
Save the modified HTML code to your PC (I don't know if it helps you).
Use an extension that allows you to run a JS code automatically on page load (there are bunch of this kind of extensions), and with that JS code you can manipulate the DOM the way you wish to. Yea I know, that solution involves maybe long code writing but this is the way you can change the new DOM every time - automatically.

Writing a Google Chrome extension for an aspx page

I'd like to know if someone can point me in the correct direction for this. I've been interested in writing a chrome extension to improve my workflow since we use a lot of webapps at my job. For example, my jobs ticketing system is pretty old and requires that we look manually for any changes or updates. It's got email notifications built in, but they are slow and unreliable.
I've never written chrome extensions before so I looked at some tutorials but none of them give me any information about doing this on an aspx page. Since I don't have direct access to the server this runs from, I thought it should be possible to do something from my end such as automatically refreshing the page using the page's refresh button instead of the browsers refresh button, or automatically opening some collapsed menus which default to being collapsed when you refresh the page.
I was hoping someone could help me figure out how to go about doing this because so far my research hasn't given me anything I can directly apply to this issue.

downloading parts of a html page on an event

I am developing an universal windows app. I need to download a webpage and extract images from it.
I got the html code and extracted the links to images and downloaded them. The thing is, the site has infinite scrolling (like facebook). When I scroll down to the bottom it loads more images. I am not able to incorporate this into my app. I am a beginner and have very little knowledge of web development or windows app development. This is my first app. I am stuck and have no idea how to proceed. I don't want to use webview as it displays ads from the site and other unnecessary contents. I only want the links to those images. Please help me go past this situation. I need a way to download the new html content that the site loads when user gets to the bottom or some other way to get the image links.
Thanks in advance.
You may or may not be a me to implement this specifically because of the reason you stated. You need to determine how the site loads this information. First I would download Fiddler and in turn enable https connect logging so you can see your encrypted traffic going through Fiddler. Btw the Web View has events you can hook to see loading URLs, etc and it can also be hidden.
So again you need to first understand how the site you want to do this on works and emulate that, assuming they don't have an api already to give you this information as mentioned I'm the comments.
When you do that, come back with code examples and you'll get better help.

Technique to enable smooth page changing and prevent the browser redrawing for each page load

I'll try explain the situation as best as possible..
I'm using ASP.NET with Bootstrap CSS. Every page uses the same master page. When I switch pages, the browser sometimes loads the new page without redrawing everything - only the HTML that has changed. Other times, it loads everything up again (so you see a white screen for a split second while the browser re-renders the HTML).
Is there a way I can configure the site to make the page transitions smoother? Has this got something to do with browser caching?
Well, although ASP.NET implements AJAX, and partial change of pages (through updatepanels for example) there's always a postback to the server with everything you do in .NET. Basically, there's always that "blank screen", but you probably don't see it in some cases, when the server answers quickly or you browser treats the HTML quicker for any reason.
The only possibility I know to avoid full postbacks is to get out of the .NET logic and do AJAX request yourself by writing client code only. But this possibly comes with other problems (like the controls you may add this way not being "known" by your server code, for example).

Faking website integration

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.