I have been writing HTML, by hand – as that was the only way you could write when it first came out, ever since it was invented. Before that I had been using the DEC format program and IBM GML for some time, so the concept of a markup language was familiar.
As my previous web site was hosted on Demon’s homepage service, it was written in vanilla HTML. Since I read HTML manuals and used it to experiment, there were features I missed – many of which have been around since the early days of the web – which are not directly available in the excellent WordPress visual editor.
Please note that some of these are now available in the Gutenberg Editor within WordPress.
Tooltips (<span> with <title>)
By using a construct like
<span title="Eating, and thinking !">Easter Quiz and Baked Potato Meal £1.50</span></p>
you can make a “tooltip” like “Eating, and thinking !” pop up when someone hovers the mouse over the “Easter Quiz…” text. This was used in several places on the old site, and may be retrofitted, but see http://oxford-phab.paladyn.org/wp/blog/2005/12/31/programme-2005/ for an example (18-Mar-2005)
Internal Anchor tags for footnotes in a page
Use something like
Sonnet<sup><a href="#sonnet">1</a></sup> to a Nonagenarian
for the source, and
<li><a id="sonnet"></a>Technically ...</li>
for the target.
Image Maps
- Publish the post or page with the picture which has the image which should have the map.
- Download the image from the page to some temporary place.
- Fire up GIMP and select Filters/Web/ImageMap
- If needed refer to https://docs.gimp.org/en/plug-in-imagemap.html for more detailed instructions
- Save the generated Image Map file
- Go back to WordPress and edit your page in text mode.
- Find the image you downloaded and update its “img” tag with the “usemap=#map” tag, but if you have multiple images on the page change to something like usemap=”#map-g-ggf”
- Copy and paste the generated “map” section below the “img” section you updated, but change the name to match the previous page
- Update the WordPress post or page and test.
There is an example on the George Edward Lines – Pictures post.
Special Characters
There is a good reference to special characters, which can be inserted in HTML mode at https://dev.w3.org/html5/html-author/charref