More for Bloggers
Just What Is that HTML Tab?
The world of web is full of acronyms: CSS, HTTP, HTML and so on. HTML refers to a mark-up language used to mark-up material to be displayed on people’s computers using a web browser program. Pages link to other pages, images, documents, etc., often on different web sites — hence, “Hyper-Text Markup Language” (HTML). Since HTML coding is a bit of a chore and sometimes confusing, editing programs have been developed that will allow one to enter text, insert images, indicate styling and so on, in a “What You See Is What You Get” (WYSIWYG) manner. The WordPress Visual Editor is one such program.
Sometimes, however, the editor doesn’t do a good job, or it gets “confused”. Even with extensions such as the Tables and Bridge Tools, it doesn’t always do what we want. There are also people who like to tweak the underlying HTML code 🙂 So the WordPress Editor provides two modes in which you can view your posts: Visual and HTML. If you click on HTML while you are editing your blog post, you will see something that looks vaguely like the following. Obviously it will have the text of your post in it, but it will also have lots of “markup” — especially text we call “tags” that look like this:
and
Unless you have a real need to use the HTML editor, I suggest you stick to the Visual editor. In general it will be easier, faster and less frustrating. If you do decide to the use the HTML editor, you need to be aware of some restrictions (this will be brief as HTML is a topic for another day).
The WordPress editor will make changes to what you enter. This is particularly noticeable if you know what you are doing and use sophisticated HTML markup in the HTML editor. It makes the changes for several reasons.
- It attempts to clean up your markup and prevent egregious markup errors (well, it tries 🙂 )
- It attempts to prevent potentially malicious code from slipping through and being stored in the WordPress database
Here are some rules to follow. Be aware that if you break them, and there are probably other rules, the editor will muck-up your code:
- No blank lines
- No leading white-space on a line
- Text following a tag must start on the same line as the tag
- No embedded new-lines in text
- That includes span tags (must remain embedded, no new-lines)
- No HTML comments
As well, there are some “attributes” that will get deleted from tags, either when your post is saved or when it is displayed to visitors to your blog.
Having said that, sometimes you may need to copy-and-paste a snippet of HTML code into your post, perhaps to embed a photo-gallery or something similar. In that case, HTML mode can be a life-saver!
Quick Hint: You will often want to embed that snippet of HTML code in the middle of your post. While you have the editor in Visual mode, position the insertion point where you want your HTML code to go (position the cursor and then click to set the insertion point). Make it a new paragraph and type a bunch of Xs (or any other single, easy to pick out letter), like this:
XXXXXXXX
Then when you switch to HTML mode, you will be able to find that easily as it will look like the following (on a line by itself):
XXXXXXXX
You can then just select it and replace it with your snippet of code.
Subscribe to our feed
Daily Newspaper 
Bridge-related
Become a facebook fan