Hello,

How can I modify contents of a web page (like text) and have it stay that way locally, even after refreshing and reloading the page from a hyperlink? I know you can use Javascript to modify information in a web page, but that is only temporary.

I want to do this because I plan on showing something to my brother, but I want to remove and modify parts of a web page (for personal reasons).

Also, could there be a way to take the HTML code of the pages I wish to change, modify what I want with Adobe Dreamweaver and have a "fake" website with Google Chrome showing the URL of my choosing?

Alternatively, are there other, better ways of showing web pages with modified content to my brother? The pages should only look different and have different information to us, and it could be limited to the web browser, the router, ect.

The title says that this is very urgent, as I have to show him in 2 days. If you could help me out, I'd be EXTREMELY grateful, and you'd be saving my life.

Thank you very much.

Recommended Answers

All 11 Replies

How can I modify contents of a web page (like text) and have it stay that way locally,

You can try to use HTML5's local storage feature, but if someone clears it, your changes will be gone. There's no guaranteed way to do what you want.

Alternatively, are there other, better ways of showing web pages with modified content to my brother? The pages should only look different and have different information to us, and it could be limited to the web browser, the router, ect.

Use your own webserver (local or hosted) and change the HOSTS file.

How can I modify contents of a web page (like text) and have it stay that way locally, even after refreshing and reloading the page from a hyperlink?

For demo purposes, it dynamic content isn't needed, just create .html files using static data. You can use any text editor to create three files. Of course, an editor like Dreamweaver would be easier to use.

website with Google Chrome showing the URL of my choosing?

As pritaeas mentions, you simply modify the local HOSTS file on your computer so that the hostnames you choose resolve to the IP address of your computer.

If you plan on showing dynamic data, you will need to decide on a server side scripting language, I.e, PHP, asp.net, etc., web server software, and somewhere to store data, likely to be some database app (MySQL, MSSQL), but you can use flat files as well such as an XML file.

For demo'ing, you should keep it as simple as possible...HTML files with static data. You only need a browser and HOSTS file modification.

You can try to use HTML5's local storage feature, but if someone clears it, your changes will be gone. There's no guaranteed way to do what you want.

So, that means refreshing the page would just revert the changes I made back? If so, I'm afraid I can't use this method, because I plan on, for example, load a modified page, go back to the previous page, load a different modified page and so on, which is why I don't want the changes I make to be temporary, or at least for as long as I show the modified pages to my brother.

For demo purposes, it dynamic content isn't needed, just create .html files using static data. You can use any text editor to create three files. Of course, an editor like Dreamweaver would be easier to use.

I only plan on showing him edited text and an image (that don't disappear after a refresh). And wouldn't .html files loaded with a web browser, such as Google Chrome, look obviously fake? I want my brother to think I'm showing him an unedited web site online.

For demo'ing, you should keep it as simple as possible...HTML files with static data. You only need a browser and HOSTS file modification.

Since I will be showing him static pages (I think? Sorry, I'm only experienced with Dreamweaver and I don't have a lot of knowledge in the web domain), I guess this is the best method, right? If so, could I load a page's source, get its HTML code, modify contents of the page, save it and change the HOSTS file so that it looks like I'm on the website itself, without it looking fake?

Thank you both for replying. :)

I only plan on showing him edited text and an image (that don't disappear after a refresh). And wouldn't .html files loaded with a web browser, such as Google Chrome, look obviously fake? I want my brother to think I'm showing him an unedited web site online.

I dont understand why you would think it would look fake. HTML is HTML regardless if its loaded from a local HTML file or one served by a web server. Obviously the URL isnt going to look real if you simply open the HTML file using a browser. So, you take care of this by installing a web server locally on the computer and then modify the HOSTS file so that the host name resolves locally. This takes care of the URL concern.

Since I will be showing him static pages (I think? Sorry, I'm only experienced with Dreamweaver and I don't have a lot of knowledge in the web domain), I guess this is the best method, right? If so, could I load a page's source, get its HTML code, modify contents of the page, save it and change the HOSTS file so that it looks like I'm on the website itself, without it looking fake?

I dont use Dreamweaver, but as far as I know, its just an IDE (editor). You can create your HTML files using Dreamweaver or any other editor. I dont know if Dreamweaver has its own built-in web server, but if it does, then yes, you just modify the hosts file to point back to your local machine and it would work. Otherwise, if you are running Windows, just enable IIS (control panel-->programs and features).

I dont understand why you would think it would look fake. HTML is HTML regardless if its loaded from a local HTML file or one served by a web server. Obviously the URL isnt going to look real if you simply open the HTML file using a browser. So, you take care of this by installing a web server locally on the computer and then modify the HOSTS file so that the host name resolves locally. This takes care of the URL concern.

I see, so I could just modify the HOSTS file so that when I type a URL in the navigation bar on my web browser (for example, www.google.com), it loads an .html file that it's pointed to? And if you don't mind, could you please tell me how to make it so that when I type in "google.com", for example, in the navigation bar, it loads C:\Users\Name of User\Desktop\My Name\example.html? I could search up a tutorial on Google, however, I don't know what to ask.

I dont use Dreamweaver, but as far as I know, its just an IDE (editor). You can create your HTML files using Dreamweaver or any other editor. I dont know if Dreamweaver has its own built-in web server, but if it does, then yes, you just modify the hosts file to point back to your local machine and it would work. Otherwise, if you are running Windows, just enable IIS (control panel-->programs and features).

Apparently, you can create a local testing server in Dreamweaver (http://www.adobe.com/devnet/dreamweaver/articles/setup_testing_server.html), which is the same thing as a web server, right? Also, IIS was already activated in my system.

Thank you so much for the help you're giving me. :)

so I could just modify the HOSTS file so that when I type a URL in the navigation bar on my web browser (for example, www.google.com),

yes most definately.

for example, in the navigation bar, it loads C:\Users\Name of User\Desktop\My Name\example.html? I could search up a tutorial on Google, however, I don't know what to ask.

So for this to happen, you must have a web server installed on the local computer. The reason is because the web server will respond to the browser unlike the simply trying to open the file directly with the browser.

which is the same thing as a web server, right? Also, IIS was already activated in my system.

yes, seems to be. Im not familiar with Dreamweaver, but for example Visual Studio has the same capability. However, the "testing" web server in Visual Studio runs on a different port other than port 80.

Also, IIS was already activated in my system.

Ok, so you cant have two web servers listening on port 80. I suspect that IIS, unless you configured it otherwise, is listening on port 80 and the Dreamweaver test web server would be listening on another port.

You need to give yourself some time to get acquainted with web server applications. The basic install and config on most platforms are easy to setup but they vary in admin styles, so a little reading up, possibly wathing a tutorial or two may be needed.

So for this to happen, you must have a web server installed on the local computer. The reason is because the web server will respond to the browser unlike the simply trying to open the file directly with the browser.

Ok, will do. However, I have a problem. On Google Chrome, when I right-click on a page, select "View page source" and paste all the HTML code in Dreamweaver, everything is just like the page, except that none of the images appear and show an "image unavailable" icon. What can I do to get a page's HTML code AND its images?

AND its images?

Check the links, they are probably relative. Make sure they point to the real images, or download those too.

Check the links, they are probably relative. Make sure they point to the real images, or download those too.

Are you talking about the image links in the HTML codes? If that's so, I guess I'll have to download each one of them, as there are about 50 images in a single page.

If the image elements have a relative path, you could simply add a base element in the head section so you dont have to edit the code to include the fully qualified host name and you dont have to download them.

<head>

     <base href="http://www.domain.com/">

</head>

If the image elements have a relative path, you could simply add a base element in the head section so you dont have to edit the code to include the fully qualified host name and you dont have to download them.

Ok, I will try this. By the way, I tried right-clicking on the page and selecting "Save as", which downloaded the page's .html file. However, this one has almost all of the images except for a few, namely the top banner.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.