Using html in your serendipity blog entries

When you use the default text editor that ships with serendipity you are only given a few different styling options, italic, bold, underline, and quote.

These are great but sometimes you need more. Some users opt to use the WYSIWYG option, others download tinymce or another editor, but I prefer to stick with the basic approach.

If you’re like me, yet still want a bit more customisation of your posts, spare a thought to regular html tags such as the following; <acronym>,<code>, <strike>, <sub>, <sup> which can spruce up your entry nicely.Using these tags requires a little bit of effort, but is well worth it to add that something extra in you entries, and it feels good to know you’re actually using html competently.

The first thing to understand is that these are html tags, and as such they need to be opened and closed correctly. All html tags must be enclosed within <>, and when we close the tag we need to enclose it within </ >. The ‘/’ indicates that we are closing the tag.

HTML Examples
The first example I’m going to use is the <code> tag, which changes your text to a monospaced font like the next line.

<code>this is what the code tag looks like </code>

All of the above tags are used in exactly the same way, however the acronym tag has an additional element that needs to be included.

The <acronym> tag lets your blog visitors read a short description of your term by simply hovering your mouse over it. What makes the acronym tag different is the additional text that appears when your mouse hovers over it. Notice the cursor changed as well. Simply adding a title=”your text” component, like below, is all that is required.

<acronym title='this is an acronym'>hovering your mouse</acronym>

The <sup> tag is the html equivalent of superscript, and creates superscript text like this, which makes the font slightly smaller, and lifts it to the top of the line.

The <sub> tag is the html equivalent of subscript, and creates subscript text like this. The font is also usually reduced in size, and dropped to the bottom of the line.

And last but not least the <strike> tag, the html equivalent of strike out, and strikes out this text. The font size usually stays the same.

Comments are closed.