Get a designer to edit your website, without giving him access to your web folde

[Bruce]

Brian asked this question in this thread;
http://www.nettalkcentral.com/index.php?option=com_smf&Itemid=36&topic=1963.msg7389#new

================
I have a chap who is pretty good at style sheets. Infinitely better than I am. I thought that the Browser would automatically download the style sheets onto his local machine with Nettalk 5 Web server and use the local ones. Did I misunderstand this process?

In effect I was hoping that he could modify the local css sheets and he could see his changes, but it appears that the Nettalk webserver always goes back to the server for the css when a page is refreshed. Is there something I can do that would enable him to experiment with the CSS without giving him full access to my Server directories?
================

The answer there explains some of Brian's misconceptions, but the actual solution is general enough for me to move the answer here.

Ok, so what we want is for the designer to be able to edit the CSS for the site, but those changes only apply to his machine. When he's done he can submit the changes back to you for inclusion on the site proper. The designer has no access to the sites' actual web folder.

There are a couple of browser extensions that _almost_ do this, but which fall down at a crucial step. Most notably the extensions work on a "per page" rather than "per site" basis, and the local style sheet is not re-applied between page refreshes.

The next best solution is to install a small web server on the designer's computer. This server needs to do nothing except serve the style file he's editing, so it doesn't even need a web folder. I've made a new example LocalSite (66), which is a good place to start. This example is;

a) bound to IP address 127.0.0.1, so it won't expose the computer to any security issues.

b) is on port 9871, so it won't interfere with any other web server already on the machine.

c) Is "installed" in your web examples folder with it's own "web" folder, but doesn't need a web folder to be shipped to the designer. It will create its own "web" folder the first time you run it, and the designer should place his custom style in the created \web\styles folder.

d) Then in your application, you go to the WebServer Procedure, NetTalk Extension, Styles, Files tab.
You add the following file to the files list (at the bottom of the list if you've already got files there.)
'http://127.0.0.1:9871/styles/custom.css'
note the direction of the slashes.
the name, "custom.css" is any name you want - the designer will create a file of the _same name_ in his \web\styles folder. Notice the URL is using the local machine, and the port is set the same as the LocalStatic server, 9871

I have added this line to the example BasicWithMenu (2).

Other thoughts;

Once your designer has finished it's probably a good idea to remove this line. It won't do any harm (and thus your site can remain live during the design process), but in the long run it may cause somone some concern if they examine your source and see your site trying to fetch a file from a local server.

This whole technique is an excellent way to allow multiple people to edit the css for a site, at the same time, and yet only see the results of their own changes. This opens the door to things like design competitions, teaching situations, and so on.

The LocalSite example app could be extended a bit if you wanted to make this more formal. Some ideas are;
a) hide the usual web-log stuff

b) Load the css file into a text box, so the user can edit it there, in the app itself.

c) add a web client object on a procedure to upload the css file to your server. You could add code to the server to copy the file from the uploads folder to the styles folder as it arrives - in that way your designer can make changes, but only to that file in a real-time way.

(*) The new example, and mod to example 2 are included in build 5.21 and later.