webpad Help Manual

Using webpad

Launching webpad normally

To access webpad normally, all you need to do is 'hit' the URL of the directory where it is installed. For example, if you copied the webpad files into the /webpad/ directory on your server, then you would need to access http://www.yourserver.com/webpad/.

You will be presented with a screen asking you to log in. Enter the username and password you specified during installation/configuration and hit the 'Log In' button. webpad will load up with a new file and you can start using it.

Launching webpad in a new window

If you'd like to load webpad into a new window sized just right for it, then you can easily do so. Just point your browser to the directory that you installed webpad in, and then add launch.php to that. For example, if you installed webpad at http://www.yourserver.com/webpad/ then you would want to access http://www.yourserver.com/webpad/launch.php

webpad will load into a new window, and the current browser will be sent back to the last page that you were at. If you need to log in to webpad, then you will be asked to do so, otherwise it will load completely.

Launching webpad from a bookmarklet

A really handy way to load webpad is using a shortcut from your browser's 'Links' or 'Bookmarks' toolbar. This is called a 'bookmarklet', and you can load webpad just like this really easily.

All you need to do is copy the link below into your toolbar (you can normally just drag the link to the toolbar and it will copy). From then on, you can easily click the bookmarklet and webpad will launch. You will even get an option to load the source code of the page you're currently viewing (when you click the link), or you can just load webpad in a console.

Loading a file from a link

webpad also supports opening a file directly from a link. This is useful for web-based file management integration, where you'd like to provide a direct link to edit the contents of a file on the server that webpad is installed on.

To create a link directly to webpad, you need to put together the following pieces;

The URL to webpad
A 'type' (?t=) of either 'server' (to open a file on your server) or 'http' (to open the source of a webpage)
The full path (or URL) to the file you want to open (&f=)

For example, to open the file /usr/home/webpad/file.html from the server, assuming you installed webpad at http://www.yourserver.com/webpad/; you would create a link pointing to the following;

http://www.yourserver.com/webpad/?t=server&f=/usr/home/webpad/file.html

There are a few things you should be aware of:

You need to be logged into webpad already; otherwise it will force you to log in and will discard the request for a file.
If you request a file from the server, it must fall somewhere inside your webpad home directory or a security violation will be triggered and webpad will close
You should encode special characters in the filename to avoid problems. You can do this using something like str.escape() (in JavaScript) or urlencode($str) (in PHP).

Working With Files

Creating a new file

Click the 'New File' icon in webpad's toolbar to create a new file. If you have any templates installed (See: webpad templates for more info), then you'll get an option to open a template to work from (using the keyboard shortcut bypasses the template option).

You can pick a template from the list of available ones, or pick 'Blank File' to load an empty file and start from scratch. Click 'New' when you've made your choice and webpad will open the requested file.

On your computer

Opening files on your computer

To open any text-based file from your computer, just click the 'Open File' icon in webpad's toolbar, and then if it's not already selected, click the 'My Computer' icon in the Locations Bar on the left of the Open File window. On the left, you will see a box marked 'File:' with a 'Browse' button next to it. Click the button.

This should open a window where you can browse the files on your computer and select the one you would like to edit in webpad. Once you have located the file to open, select it and click 'Open'. Now click 'Open' in webpad's window as well.

The file will be uploaded to webpad's server and stored temporarily while you edit it (don't worry; it gets deleted when you're done).

Saving files to your computer

You can also save any file you are editing in webpad directly to your computer (including opens you opened from your server, a remote FTP server or anywhere else). To do this, just click 'Save As' in the toolbar, and then select 'My Computer' in the Locations Bar on the left of the File Save window.

Now you can enter a name for the file, and pick what type it is. Once you're done, click 'Save'. webpad will tell your browser to download the file, so you will get a window asking you if you'd like to open or save the file. Select 'Save to disk' (or similar) and click 'Ok'. Now you will need to browse to where you'd like to save the file on your computer, and then click 'Ok' again. The file will save and you can go back to editing in webpad.

On the server webpad is on

Opening files from the server webpad is on

webpad is perfect for making changes to your website without having to download and upload files all over the place. It accesses the files directly on your server, so you can see your changes immediately once you save the file. To open a file on the webpad server, just click the 'Open File' icon in the toolbar, and then select 'My Server' in the Locations Bar.

Now you will see a window where you can browse the contents of your server, starting at your home directory (you can't go outside of that directory and its sub-directories for security reasons). Browse to different directories by clicking once on a directory name. If you don't have permission to access a file or directory, then you won't be able to click on it.

Once you find the file you would like to edit, you can either double-click it, or click it once, then click the 'Open' button to open it in webpad.

Saving files to the server webpad is on

Any file that you have open can be saved directly to your server. All you need to do is click 'Save As' in the toolbar then click 'My Server' in the Locations Bar'. Now you can navigate the directory where you'd like to save the file.

Once you're in the right directory, you can either enter a name for the file, or select an existing file to overwrite. If you are going to overwrite a file, you'll need to confirm that that's really what you want to do. After entering a name (or selecting a file), just click the 'Save' button and the file will be saved and you'll be returned to webpad.

Extra server file-management tools

webpad has a few extra tools to help you manage the files on your server. These tools are available from the File window, either when you Open or Save a file to the webpad server.

Home
Takes you back to your home directory.
New Directory
Click this once, then enter the name of a new directory to create it within the current directory.
Delete Selected File
Select a file, and then click this icon to delete that file permanently. You will be asked to confirm just to make sure.
Rename Selected File
To rename a file, just select it, and then click this icon. You will be prompted for a new name for the file.

Via FTP

Opening files from an FTP server

If you have configured access to a remote FTP server (or multiple servers) you will be able to open and save files to and from the server just like anywhere else. Click 'Open File' in the toolbar and then select 'FTP Server' in the Locations Bar. If you have more than one server configured, you'll need to pick which one you'd like to open a file from, otherwise the only one configured will be assumed.

Once you are logged into your FTP server, you can browse around just like accessing files on the webpad server (albeit a little slower normally). Once you find the file you're looking for, double-click it, or click it, then click 'Open' to open it in webpad.

Saving files to an FTP server

Saving a file to FTP works just like saving to the webpad server. Click 'Save As', select 'FTP Server' in the Locations Bar, then navigate to where you'd like to save the file. Enter a name and click 'Save' and you're done! As with the webpad server, you'll need to confirm it if you want to save over a file that's already there.

Extra FTP server tools

Change Active Server
Clicking this will take you back to the list of available FTP servers so you can choose which one to work with. This option will disappear if you only have one server configured.
FTP Home Directory
This will take you back to the home directory of the active FTP account.

Using plugins

Opening a file from a plugin

Plugins give webpad the ability to access other locations to load files from. webpad Personal and Enterprise come pre-loaded with plugins to handle the following blogging platforms:

You will need to configure your details for each of these platforms during installation/configuration, so please have a look at the Installation Instructions for more details on this.

Once you have your blogs configured, you can access the directly through webpad, as if they were any other file. Just click 'Open File' and then click 'Plugins' in the Location Bar. Now you will see a list of available plugins to select from. Click on one of the plugins and you will go to a listing for that plugin. For some blogging platforms, you will get a list of available blogs, for others you will go straight to the entries. If you only have one blog available, you will also go straight to the entries.

Once you locate the file/entry you'd like to edit, select it by either double-clicking, or click it once, then click the 'Open' button. It should now open directly in webpad where you can edit it.

NOTE: Blog entries open in webpad with the title on the first line. Whatever is entered on the first line will be used as the title of the entry when it is published on your blog!

Saving a file to a plugin

As with other file-types, just click 'Save As' and then select 'Plugins' in the Locations Bar. Navigate to the plugin you'd like to save this file using, and then enter a name and click 'Save'

NOTE: When saving a blog entry (except for blosxom), the first line of the file is used as a title automatically, and you don't need to specify a file name. With blosxom, you will need to enter a file name just like saving to your server.

Extra plugin tools

Some plugins will load additional tools into the plugin toolbar while you are accessing them. All of the blogging plugins will give you the option to delete entries. Just select an entry and then click the 'Delete Selected Entry' button to delete it permanently.

Loading the source of a webpage

webpad can load the source code of a webpage so you can check it out, or save a copy for yourself. All you need to do is click 'Open File' in the toolbar, and then select 'Webpage' from the Locations Bar. Enter the URL of the page you'd like to open, and then click 'Open' to load it directly into webpad.

NOTE: You can't save a file directly to a URL - that wouldn't make any sense!

webpad Tools

Uploading files to the server

If you have configured webpad to allow file uploads, then you can upload any file to your server using the 'Upload File' button in the toolbar. Just click it to open the 'Upload File' window. With the window open, click the 'Browse' button to locate the file you'd like to upload from your computer. Once you've found it, click 'Open', then click 'Upload' in webpad's upload window.

The file will upload to a temporary location on your server, and then webpad will prompt you for a location to save it too permanently. Browse to a location on your server; enter a filename and click 'Save'.

Emailing a file

You can send a copy of any open file via email if you have configured webpad to allow emailing. With a file open, just click the 'Send File As Email' button in the toolbar. This will open the 'Send File As Email' window, where you should enter an email address to send the file to (you can enter more than one, just separate them with a comma - ','). Enter a subject for the email, and then click 'Send'. The email will appear to come from the name and email address displayed in the window (which was configured as part of installation/configuration). If your document contains "<html>" then it will automatically be sent as an HTML-formatted email message, otherwise it will be sent as plain text.

Printing a file

If you'd like to print a file you are editing in webpad, you should use webpad's 'Print File' button. When you click the button, a new window will open, with your file formatted for printing. The print operation will be triggered automatically, so you'll just need to confirm that you'd like to print and it will begin.

Go to line

Often, you will need to jump directly to a specific line in a file (especially if you're debugging some code). To do this, just click the 'Go To Line' button in the toolbar. You will be asked which line you'd like to go to. Enter a number, and then click 'Ok' and you will jump straight to the start of that line.

Find & Find Next

Using the 'Find' button, you can locate any text in your file. Click the button, and then enter the text you're looking for and click 'Ok'. You will jump to the next occurrence of that string, and it will be highlighted to show you where it is. If you'd like to keep finding more occurrences, just keep clicking the 'Find Next' button next to it in the toolbar.

Find & Replace

You can replace all occurrences of a string with another one using the 'Find & Replace' window. Click the 'Find & Replace' button in the toolbar, and then enter the text you're looking for in the 'Find:' box. Enter what you'd like to replace it with in the 'Replace:' box. If you only want to match the same upper/lower case text, then check the 'Match Case?' box. Now click 'Replace All' to replace all occurrences of the string with the replacement.

HTML tools

webpad comes with a collection of useful HTML tools for editing and creating HTML files. Here's a brief outline of what's available:

Bold (ctrl/opt-shift-b)
Select some text and click this to wrap it in tags, or click it without a selection to insert the tags into your file.
Italics (ctrl/opt-shift-i)
Select some text and click this to wrap it in tags, or click it without a selection to insert the tags into your file.
Insert Link (ctrl/opt-shift-a)
Click this button and then enter the details to insert an <a href> tag into your file.
Insert Image
Click this button and then enter the details to insert an <img> tag into your file.
Increase Indent
Select some text and click this to wrap it in tags that will add a left margin, or click it without a selection to insert the tags into your file.
Blockquote
Select some text and click this to wrap it in <blockquote> tags, or click it without a selection to insert the tags into your file.
Left Align (ctrl/opt-shift-l)
Select some text and click this to wrap it a tag, or click it without a selection to insert the tags into your file.
Center Align (ctrl/opt-shift-e)
Select some text and click this to wrap it a tag, or click it without a selection to insert the tags into your file.
Right Align (ctrl/opt-shift-r)
Select some text and click this to wrap it a tag, or click it without a selection to insert the tags into your file.
Justify (ctrl/opt-shift-j)
Select some text and click this to wrap it a tag, or click it without a selection to insert the tags into your file.
Insert Color (Hex code)
Click this and then pick a color from the palette. The hex code for that color will be inserted into your file.
Insert Table
Enter the number of rows and columns, plus some other details, to insert the skeleton of an empty table into your file.
Insert List
Pick which type of list you'd like (bullets, numbers, different styles), then enter each of the items. When you're done, click 'Insert' to insert the HTML required to create the list into your file.

Previewing a file as HTML

If you're editing an HTML file, you can use the 'Preview As HTML' button to load the contents of your file into a new window, and render it as a webpage. This is a good way to get a quick preview and see how it looks. Keep in mind that unless you are using absolute addresses to things like CSS and JavaScript files and images, then most of them will appear broken.

Extras

Keyboard shortcuts

webpad supports a number of keyboard shortcuts to make your life easier. In addition to the HTML Tools (See: HTML Tools for details), the following shortcuts are also available:

ctrl/opt-shift-q
Insert a Tab into your file
ctrl/opt-shift-n
Create a new file (ignores template settings and just creates a new file straight away)
ctrl/opt-shift-o
Open a file
ctrl/opt-shift-s
Save the current file to its current location
ctrl/opt-shift-g
Go to a line in this file
ctrl/opt-shift-f
Find text in this file
ctrl/opt-shift-h
Find & replace text in this file
ctrl/opt-shift-p
Preview the current file as HTML (See: Previewing a file as HTML for more information)

NOTE: All shortcuts are available on Windows machines (using the Control key) and on Macintosh (using the Option key).

webpad templates

You can install any number of templates in webpad so that you can easily create a new instance of that file from the 'New File' window. To create a webpad template, just create a normal text-based file, and then save it to the /templates/ directory inside webpad's install directory with the .wpt extension.

When they are loaded, the filenames of all *.wpt files in the /templates/ directory are 'prettied up'. Underscores (_) are converted to spaces and the .wpt is stripped from the end. For example, This_is_a_webpad_template.wpt will become "This is a webpad template" in the template selection box.

webpad comes packaged with a number of sample templates for HTML and XHTML-compliant documents.

webpad plugins

Please see the separate Plugins Documentation for information about webpad's plugin system.

More Information

About webpad

webpad was written to provide a simple interface for accessing files on a server. From that origin, it grew to become a single spot to accessing all sorts of files which are online, in a number of formats and locations. webpad is written using a combination of PHP, JavaScript and Cascading Style sheets, with the interface being completely HTML (no plugins required!)

A few interesting facts about webpad:

webpad development started in about 2000.
webpad has been downloaded well over 4,000 times from the Dented Reality website.
webpad is made up of around 150 files!
Apart from some beta testing and a few suggestions here and there, webpad is entirely developed by Beau Lebens

You can always get the latest version, and read this documentation online at http://www.dentedreality.com.au/webpad/

About the developer

webpad is developed by me, Beau Lebens. I'm a web developer who's been creating things online since about 1996. Originally based in Perth, Western Australia, I'm now in the US working hard as always. I made webpad originally because I wanted a simple way to edit files quickly on my website, without having to download, edit and then upload them. In those days it only worked in Internet Explorer, and even there, only sometimes.

Since version 1, I've added stacks of extra tools and features to make webpad more useful and powerful, plus I've improved the security and stability of it, and made it work in browsers other than IE to boot. I maintain webpad because I find it useful: it's been the main tool in managing all the websites I have for over 3 years now. If you like it as well, or find it useful, I'd love to hear about it, so drop me a line and tell me how you're using it.