WebProg3 offers 3 widgets for use in your web pages: pictures, (rich) texts and hotspots. This represents a small but very powerful vocabulary. There are many things you can make with these 3 objects! Also, if you analyze what is essential in alternative HTML widgets, you might discover that perhaps you do not need them at all! For example, it is perfectly possible, with a different appearance, to have lists of radio buttons for the user to make a single choice, or check boxes where the user can make multiple choices:

Very nice! But to what degree are such differences in appearance necessary or desirable? With a bit of work, it might be possible to create widgets of this appearance in WP3, but you can also achieve the same functionality much more simply:

Obviously, from the layout and images at this website, you can see that I am no artist! Perhaps, for that reason I prefer to use a simple vocabulary that produces acceptable results. But you are not me. You may well have far greater artistic ability than I have, and possibly attach much more importance to elegant appearance beyond functionality than I do. That's fine. It takes all sorts to make a world.

So assuming then that you would prefer to create widgets of different types, of what help can webProg3 provide? WP3 can start you off at least. You can begin using the tool insofar as you find it convenient, and then carry on doing further develpment manually. If you do this, then the scripts you produce will become incompatible for upload into WP3 again, but that is not necessarily important. I myself love to use WP3 to create the basics of my web pages, and then hack them to death by putting in all kinds of bells and whistles! I subsequntly use either a simple text editor, or perhaps Sublime Text which gives a bit of help by checking the validity of my coding.

So initially in this section, let's see an example of the minimal help that WP3 can provide for the more adventurous user. Have a look at this:

This is the basic webProg3 document, with no widgets yet included in it, displayed in the Sublime Text editor. You can easily obtain this script by starting up WP3 and immediately doing a Preview so that you can copy it from the HTML Editor, or by doing a Save directly to record it on the HD of your computer.

What follows here are some observations about the most important items in this basic script.

These are the basic libraries required by WP3 scripts which are 99% standalone. For this reason, they are encoded in base64, and you cannot read them.

If you wish to read them, copy (some of) the base64 encoding, and go to a website such as this one to convert them:

As you can see, webProg3 embeds quite an old version of JQuery. Old is best! If you don't agree, then you can substitute a newer version here, and not necessarily embedded in base64 as WP3 does.

For example, if you would like to put your new library in the same folder as your web page, you can say this:

<script src="jquery-3.5.1.min.js"></script>

On the other hand, if you would prefer your page to get the library from a CDN on the Internet, you can say this:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

The second library embedded in webProg3 scripts is a function for converting text to and from base64 format.

If you wish to use it, here's how:

$.base64.encode( "this is a test" ); //returns "dGhpcyBpcyBhIHRlc3Q="
$.base64.decode( "dGhpcyBpcyBhIHRlc3Q=" ); //returns "this is a test"

This function can enable hotspots to open a tailor-made popup window, rather than just displaying pages in a new tab.

Popup windows are something of a plague to users, and nowadays most browsers block them by default. For this reason, the current version of webProg3 does not automatically allow them to be configured.

However, if you insist on using popup windows, and you can work out how to do it, the function remains in all WP3 scripts.

Normally, if you right-click on a browser window, this popup will appear:

WebProg3 pages block this by default.

If you wish to re-instate the right-click default in your web page, either remove the function entirely, or simply change

"return false;" to "return true;".

Insert your own HTML coding (any number of lines) here, substituting line 37 as shown on the left.

When previewing or saving a web page, WP3 asks you what size margin (in pixels) you would like at the bottom. All it does is to create a DIV which is 1 pixel wide and 1 pixel high at the specified distance from the lower edge of the lowest widget on the page. This is to fool the browser into thinking that the page is n pixels higher than it really is.

Manually, you can adjust the top of this div to your taste.

This is where you would normally do your Javascript/Jquery coding.

Hopefully, this section has provided you with some useful tips on how you can use webProg3 as a basis for further work which is beyond the scope of WP3 itself. And don't forget that even if you intend to include such things, you may also find the inclusion of its standard widgets (pictures, rich texts and hotspots) useful as well!

So what can you give back to WP3 after extending it? You may well have the patience to experiment in order to discover what works and what doesn't. It can do no harm, unless you blame me, the author, when things do not work as you hoped! I myself have tried giving hacked scripts back to WP3, and I found it to be surprisingly resilient in a number of ways. But reflecting well on this issue, I think that a conservative policy leads to less confusion:

IF YOU HACK A SCRIPT THAT HAS BEEN PRODUCED BY WEBPROG3, CONTINUE MANUALLY.

Line 7 specifies the chosen subset of Google fonts which normally, can be used in WP3 web pages.

You do not need to include all the fonts. You can remove those that your page does not need.

Or you can add fonts with others that satisfy your taste.

Visit the Google fonts website to get their names.