WordPress To Go - How To Build A WordPress Website On Your Own Domain, From Scratch, Even If You Are A Complete Beginner (2013)

IN-DEPTH GUIDE - DRILL DOWN TO THE WONDERS OF WORDPRESS

Lesson 19. Behind The Scenes With HTML

Right at the start of this tutorial I said that you don’t need to know HTML to use WordPress. This is true, but you can see from a couple of the previous lessons that it can be handy to know how to insert HTML if you need to use it to display something not covered by WordPress.

HTML stands for ‘Hyper-Text Markup Language’ and is the code that, originally, people had to use to create and maintain a regular website.

The beauty of WordPress is that it shields you from all this in its user interface but, behind the scenes, WordPress generates all the necessary code for you. And it does it (mostly) very efficiently.

I’m not going to teach you HTML here but I’m going to show you how to use it if you have written any of your own code or if you have a code snippet provided for you to perform some function not supported by WordPress.

Add HTML Code To A Wordpress Page

WordPress presents you with an alternative window to use on Posts and Pages if you want to insert your own code. To do this, click on the ‘Text’ tab in a post or page, as in Figure 19.1:

When you click on that you are taken to the HTML window and WordPress expects that there will be some HTML or other code included in the text.

You can write any text as normal and WordPress will display it as normal, but when it encounters any HTML it will execute it rather than displaying it as text.

Figure 19.2 shows the text box with HTML code in it…

… and Figure 19.3 shows what that page looks like to the visitor:

When you use this Text tab there can be occasions when WordPress doesn’t render the HTML code as you might expect. This is because it does a further layer of verification before accepting the code and this can mean that it strips out anything that it doesn’t like.

This can be annoying, but you can force WordPress to accept your code if you temporarily change your User profile.

Disable The Visual Editor

From the dashboard, go to ‘Users’, ‘Your Profile’ and you’ll see a screen like Figure 19.4:

Check the ‘Disable the visual editor when writing’ box and then scroll down and click ‘Update Profile’.

Now you can enter the code you want into your post or page and it should retain the code ‘as is’ when you publish it.

If you do this, you will have to go back to your User profile and uncheck this box if you want to re-enable the visual editor for use in future posts.

But you’ll have to remember to repeat the disabling if ever you want to go back to edit the original post because, if you don’t, WordPress will strip out all your code!

___

I suppose I ought not to leave this lesson without a health warning. Inserting HTML code into a WordPress post or page can have unintended consequences. This can be because the HTML code may contain an error, or maybe something in the code clashes with the site’s theme, or simply that you are trying to do something that WordPress considers to be invalid.

If you get problems with HTML you have two choices: remove the offending code, or call for help from someone who knows what they are doing.

FAQ

I’m a total non-techie and all this stuff gives me a headache. Do I really need to know about HTML?

No. You don’t have to worry your pretty little head about it at all, if you don’t want to. You can leave it to WordPress.