Magic Moments: Shortcuts to HTML free blogging

Some web-users may already be acquainted with Markdown, a method of HTML free blogging or writing code on social media, but I would like to explain what it is and how it could affect your blog writing.

WordPress have announced in their blog that they have activated Markdown in WordPress.com. As I said earlier, this is not a new phenomenon and many are probably using it without realising it, and when I saw this I thought “Goody, now that could be useful” and went in to have a better look.

First of all I thought Markdown could be a function that may appeal to those who are not technically minded or don’t understand HTML. But in reality it’s a shortcut to activate particular writing enhancements without having to stop typing to search for the necessary icon.

Good for mobile devices, bad for widgets

This could be very useful for smartphone and tablet users, where it is more difficult to locate the required tabs to optimise their posts. I personally find the keyboards on these touchscreen technologies cumbersome and much slower to use than my computer’s keyboard, especially when it comes to highlighting specific text to be enhanced, so the ability to continue writing using some HTML free blogging facilities could be very useful.

One area I considered a practical use for Markdown was in text widgets, so I tried it out. Nope, no go. This was very disappointing, as this is the one area where developments could be made to avoid the use of HTML, for example to code in links, which would make it much easier for non-technical people to change the information in their sidebars.

How do you activate Markdown?

Even though WordPress provides the necessary icons in its ‘kitchen sink’ or the grey utilities bar at the top of the text area when you write your post, Markdown (if activated in WordPress.com or the necessary plugin such as WP-Markdown installed in WordPress.org) allows you to do the same by inserting simple punctuation around the words you want to emphasise.

WP-Markdown Plugin

If you use WordPress.com you need to activate the Markdown facility in Settings > Writing located from the left sidebar in Dashboard. Don’t forget to save at the bottom of the page.

Where to activate Markdown in WordPress.com

How does it work?

The simplest use is to make words italic or bold through the use of punctuation. Here’s how:

Text tab to write in code

In your edit post page, first go to the text tab in the top right corner, so you are writing in the text mode. Here you will probably see lots of coding and stuff, but don’t worry, it’s just another state in which to write (and when I use my iPad to write my posts, this is the most convenient state to write them in), so continue as normal. 

Now you’re ready for Markdown. Write your desired word and place one asterisk before and after it for italic = *Alice* makes Alice, and place two asterisks before and after your desired word for bold = **Alice** makes Alice

Showing how to practice Markdown becomes   Showing how Markdown works

and you can test to see if it has worked before publishing via the Preview button in the Publish Menu:

Showing where the preview button is

And it does links too!

This is most useful (pity it’s not suitable for widgets) because writing the code for links can confuse non-technically minded bloggers. I find this totally fascinating (as a similarly non-techie person), but you still need to concentrate.

Normally a link in HTML code looks like this:

<a href=”http://fairyblogmother.co.uk” title=”Fairy Blog Mother”>Fairy Blog Mother</a>

Now there’s a lot going on there, but Markdown makes it simpler:

[Fairy Blog Mother](http://fairyblogmother.co.uk “Fairy Blog Mother”)

Showing how to write a link in Markdown    Showing how a Markdown link will look in preview

Let me explain. Inside the square brackets [  ] is the contextual link words you want to show in your post, in this case I’ve chosen Fairy Blog Mother and you can see those words as the link underlined in red in the preview image.

Inside the round brackets (  ) is where the link material is placed. First you write in the full URL of the link’s destination, such as the Fairy Blog Mother’s website address. If you want the little yellow box to appear when the link is moused over (this is known as a Title), you write the words you want to appear in the Title inside quotation marks, such as “Fairy Blog Mother”. Then you close the rounded brackets.

Is there any more we need to know?

Where to locate the Header facilities in WordPressThere’s lots of things you can do with Markdown and some of them are quite sophisticated, and if you are welcome to go and explore. But I want to show you how to use it to create the different headers in your post.

The usual method of changing text into the desired header is usually through the paragraph drop down menu in the extended “kitchen sink”. You would write the words for the header or subheader, and after you’ve highlighted them, then select the appropriate header size.

The alternative would be to go into the text mode and write <h1> before the text you want to become the biggest header, and then remember to cancel this instruction by placing </h1> afterwards. If you don’t do this, everything continues as big as the heading.

Also I find touch-screens very troublesome when it comes to highlighting text that I wish to enhance, so to use punctuation instead through Markdown would be very useful.

Markdown uses the hash symbol # (sometimes called the pound symbol in the States) and it is the number of them before (and sometimes afterwards) the text that needs to become the required headline that matters.

For example, the largest heading or Heading 1 would be written as # Header 1 # and the next size down would be written as ## Header 2 ##. Here’s my experiments on this:

Using Markdown to create headers in WordPress

Showing the results of creating headers using Markdown

I wanted to check whether you needed to remember to write the same number of hash symbols after the text before continuing the remainder of the post on a new line, and it works without. Good, as many people will forget to close the header hash symbols afterwards, as I pointed out earlier about using the <h1> and </h1> coding.

So that was a very brief (!) lesson in using Markdown as a HTML free blogging device, and I am going to install the plugin for this WordPress.org site so I can use it when writing posts on my iPad. I can’t wait! Have a go yourselves, and let me know how you get on through the comment box below.

The following two tabs change content below.
Alice Elliott writes the award winning Fairy Blog Mother blog for beginner and post-beginner bloggers to “explain things really simply” about blogging and WordPress. She provides simple, easy to understand, highly visual courses and tutorials using ordinary, everyday words. Visit her new Beginner Bloggers blog to find her latest learning resources.
Sharing is caring

Please leave a comment, we would love to hear from you!


Important GDPR stuff: before you submit your comment, you will be asked to leave your name, email and web address, so we request your permission to display this data within our comments. Be reassured this information will not be collected onto lists or used for any other purpose.

>