‘Retiring’ teblog from Typepad to WordPress

Every post older than this one is taken from teblog – my blog that ran on Typepad from 2005 to 2015. The explanation for the move is in the topmost ‘Goodbye’ post.

While the transfer was reasonably straightforward (it was only 530 posts), WordPress didn’t like certain characters. In fact, it wouldn’t even allow me to edit any posts with those characters in. (They showed up in the public posts as black diamonds with question marks in.) The characters I’ve found thus far are the pound sign, the ellipsis (three dots), angled brackets, forward slashes and angled double quotes. If you need to do this, use these abbreviations – pound, hellip, lt, gt, frasl and quot respectively. Precede each one with an ampersand (&) and finish with a semi-colon (;).

[Later: It’s not happy with accents either. I found it most reliable to use codes like #232 and #233 for grave and accute accents on an e. You still have to start and end with an ampersand and a semi-colon.   Here’s a decent collection of character codes. Mouse over each character to see all the possible codes for it. I found the last one on each list worked fine in WordPress. ] Here’s my set of dodgy characters (there were 286 in the blog altogether:

Dodgy chars

[ Just discovered that WordPress has trouble with the em dash as well. I used #8195 with the ampersand and semi-colon as before. ]

Since Typepad exports a text file, it’s a relatively simple (although tedious) task to go through searching and replacing the offending characters. Which is what I’m doing right now.

Once the offending posts and comments are deleted from WordPress, it should be a simple matter to re-import the cleaned up Typepad file. WordPress ignores duplicates of what it already has. Tip: Empty the ‘Trash’ of your faulty posts and comments before you start otherwise WordPress will skip them.

[ Later: Darn it – I didn’t change cross-links to other posts – they still go to Typepad. I should be able to fix them inside the WordPress posts. I pointed TextPad’s ‘search in files’ at the exported file to list them. I copied and pasted the results list to a text file for a permanent record.]

[ Later still: It was a bit tedious – yet only 57 posts and comments had cross-links in them. You have to find the linked-to post to get its  URL then paste this in to replace the cross-link. If you have loads, you might prefer not to do a manual conversion and use an automated service like TP2WP. This currently costs $49. It’s probably worth mentioning that its security certificate expired on 7 Dec 2015 and you may be denied access to the service. It does, however, come highly recommended, so I assume it does all this donkey work for you. I’ve asked one of the co-authors about both things. Will report back here. ]

Make your website multiplatform in less than a day

Common sense (and Google) suggests our web pages should be accessible on all devices, from smartphones upwards. As the proprietor of a desktop-centric website, I decided to look for the quickest way to become ‘multi-platform’.

After many false starts – I won’t bore you with them – I found the quickest was to adapt a free template of a site that already worked. You need to feel comfortable about tweaking HTML (it’s only text editing) but you don’t have to be an expert by any means.

I also found it best to plan for mobile rather than start with a desktop system. This led me to a single-page main site with a menu bar that jumped (mainly) to internal parts of the same page. (Okay, I added my YouTube channel to the menu as well, but this really wasn’t difficult.)

The free one-page template I chose, called Urbanic, came from template.mo Download at http://www.templatemo.com/download/templatemo_395_urbanic

I could have just used a text editor to twiddle around with the code but I actually used Microsoft’s free Expression Web 4. Download at https://www.microsoft.com/en-us/download/details.aspx?id=36179 This lets you look at and tweak any of the files in your downloaded template folder.

Open the index.html file and (I would recommend) save it as something personal to you. I called mine newtebbo.com. This will save you heartache later on when you try it out on your live site. Instead of overwriting your existing root page – index.html – you can test it to death under its pseudonym. Only when you’re completely happy do you need to rename it to index.html. (I would strongly recommend that you first rename your existing index page to oldindex or similar. That way you can always revert if need be.)

Apart from three early lines at the top of the <head> section (title, keywords and description) your changes will all be in the <body> section of the web page. The source code is laid out neatly in divisions which start and end with <div> and </div>. These are followed and preceded by a note of the section you’re in. Just chop out any entire sections that aren’t relevant to your design.

Replace your chosen template’s text with your own. Add images you want to use to the images folder and edit the references. (You will need to add all the template’s folder contents to your existing folder contents. If a template folder doesn’t exist in your existing site, simply copy the template one across. I suggest doing it this way so it’s easy to revert to your old site if you need to.)

You’re probably best off changing only things you’re confident of. Leave the CSS and other folders well alone  – unless you take deep exception to some of the colour schemes or section layouts. (My recommendation would be to stick with your template’s design for a while, it might grow on you.)

If you want to see what I did to the Urbanic template (assuming you downloaded it) – just right click and View Page Source of www.tebbo.com/index.html

[You probably don’t need this but I use Firefox’s right click/inspect element useful when fiddling around with the more techie aspects – you roll your mouse over the left panel and it highlights the part of the page you’re on and gives you all sorts of information about the CSS elements that support the section you’ve chosen.]

Best to just ‘have a go’ and keep it simple to start.

Good luck. It took me less than a day.

Another giant: cocoate.com

A final thank you (not really belated, I found them after the previous post) to cocoate.com

A flaw in my HTML mark-up was causing some screen elements to misalign on a few devices. Nothing really serious, it was just that the third column on the people page dropped on some of the less popular browsers.

cocoate's explanation of the 960-grid mechanisms was wonderfully clear.

Thank you folks. Or should I say "Merci bien mes amis"?

Thanks to the giants upon whose shoulders I stood

Once upon a time (1966 was the first time), I'd learn a programming language and then apply this knowledge to whatever problems were chucked my way. As I've got older, I decide what I want, then go online for help in doing it. Okay, it doesn't make me a professional coder but I learn plenty along the way and end up with a website that I'm in charge of and can change at the drop of a hat.

Without Google and the World Wide Web, Lord knows what I'd have done. But, thanks to them and all the places they led me to, I have a site which, while falling short of elegant, does what I want. More importantly, I hope it gives its visitors an enjoyable and useful experience.

This post isn't about the website, although you may need to know that it's epocselet.com in order to understand some of the comments below. This post is about recognition of all those people and places I discovered on my journey. Without their help, I would still be trying to learn JavaScript or PHP from scratch.

Here they are, in order of the number of hits I recorded in my Firefox History file. First the top ten (the first three were on tap continuously):


??? Microsoft ExpressionWeb4 was an invaluable website development environment.

??? W3C's Markup Validation Service. As the name suggests, it checks the validity of web pages.

??? Firefox Web Developer tools – especially Web console and Debugger.

230 stackoverflow A marvellous forum which covered pretty much everything, including PHP, JavaScript, HTML5 canvas and colour drop-down menus.

131 w3schools.com An online reference manual which I referred to for JavaScript, HTML5 Canvas, HTML colours, JS programming tips/demos and string parsing.

101 JQuery Radar Plus Mehdi Tazi adapted Ryan Allred's Radar Chart. I adapted Mehdi's. Figuring out how it worked was like solving a giant puzzle.

 55 The PHP Manual and source of everything.

 51 Radar Chart JQuery Plugin Ryan Allred's original code.

 29 Plusnet's 'friendly' area. I used it for CGI and PHP hosting stuff.

 28 SitePoint is a great source of web-building help. I used it for Canvas, HTML5. PHP, JavaScript, Radio button array and 960 grid stuff.


Now for the rest of the top 20. They may be lower in hit count but they were no less valuable – a single hit would often point me in the right direction:

19 Mario Lurig's PHP code checker came in handy when the PHP would stall.

 7 Maths Is Fun took me back to schooldays to remind me about radians, sines and cosine. I could remember 'sohcahtoa' but couldn't remember what practical use to put it to.

 6 tuts+ explained the 960 grid system, but also explained other things, including HTML Forms.

 5 The jquery learning center does what it says on the tin. I used it as a reference for scopes, arrays and operators.

 5 960 grid system. I found the 960 24 grid system perfect for laying out the web pages (and, often, changing them quickly.)

 4 A simple guide to HTML came in handy for checking how to include JavaScript in HTML.

 4 Six Revisions is a website hints and tips site. I used it to read about the 960-grid-system and HTML5's canvas (on which the charts appear).

 4 Chris Pietschmann kindly explained how to colour dropdown items in an HTML form.

 3 Chris Wiegman showed how to dig out the correct IP address for a visitor. (If you're with a hosting organisation, you're still fairly anonymous though.)

 2 Home & Learn helped me a lot with understanding how to work with the HTML5 canvas.


Other honourable mentions should go to:

Google Analytics – which keeps an eye on visitor behaviour.

The many people who looked and commented as we went through. I guess some would prefer not to be named, but you'll know if you were one of them. A big thank you to you. I learnt something new from every single discussion.

Finally, my partners in crime Dr. Bill Nichols and Martin Banks.

It's been a blast. It made me remember why I loved programming. But also taught me that I could never make a living at it these days.

Thank you all for five very interesting months.

Apologies to all the marketing people I’ve insulted

Yes, it's true. I've been known to say rude things about marketing people. Analogue marketing people and, frankly, I can do a good job of justifying these comments.

But, as I discovered recently, there's a new breed of digital marketer about and, if they play their cards right, they can be a force to be reckoned with.

My transition started last year when I talked to IBM's CMO for EMEA (top marketing bod in Europe etc., to translate loosely). I came away with the idea that marketing is moving from an art to a science.

Earlier this year, I found myself doing some training with Marketo, a marketing automation company, among other things This, as with all my clients, involved a lot of pre-course research. I became more and more interested in the subject, way beyond the call of duty, in fact.

When I got back, I carried on digging and this led to two articles for CIO UK. The first is What is marketing automation? and the second is IT's role in marketing automation.

For the marketers who've grasped these new opportunities, I take my hat of to you. For the rest? Well, I'll still proceed with caution.


A quickie on Python

Python logoCall me mad, but I've been learning the Python programming language.I needed a quick way to modernise masses of old HTML documents.

In the end, I decided it was quicker to use TextPad's powerful facilities to do that job, rather than learn a new language to do it. However, by then I had seen that Python would be a great way to write a pilot of a new program.

Thinking that I should get the newest and shiniest version, I installed 3.4 and, with the help of the online Python Tutorial and Michael Dawson's Python Programming book, started to crank out some useful little programs.

All very well, but then I realised that I could shortcut a lot of tedious work by using some cloud-based information but discovered from programmers and the cloud host's technical info' that they still prefer Python version 2. Grrrr.

Moral: do a bit more digging before taking the plunge. Version 3 may be the future, but version 2 is definitely the present as far as integration is concerned.

I'm now mugging up on the differences between 3 and 2. Oh well.

From the personal computer to the web: a searchable archive

Phew! That was hard work. I've tarted up the HTML of 263 of my columns and features written in the pre-web days (1979 to 1995). They should all be readable in any browser on any device.

The archive is searchable, so if you're into nostalgia or research, you can  check out my take on just about anything personal computer (including Mac) related from those years. It's a mix of opinion, reviews and feature articles written for a mix of consumer and business publications.

I must have been doing something right because my writing was put up for eight awards, I was a finalist for all eight and won the Times/Hewlett Packard Technology Columnist of the Year three years running. (I was then banned from re-entry.)

Apologies for any remaining typos. The articles were scanned and some words got mangled. I've fixed them where I've spotted them.

Have fun (or not).