Using HTML to make Impacting Headlines

Did you know that you can easily add some formatting to your site’s headline by editing the Homepage Heading field?

For example, navigate to Settings -> General -> Homepage Heading and paste the following into the field:

The Most <i>Amazing</i> Headline <span style="color:red;">Ever</span>.

This will change your boring heading into:

The Most Amazing Headline Ever.

Let’s break down what we see here.

The <i> tag is HTML for italics and in order to markup your text to italics it’s necessary to add the closing </i> tag. If you forget to do this, this is what happens.

The Most Amazing Headline Ever.

Do you see what happened? The italics didn’t stop after the first word – it continued until the end of the line. In fact, the italics would continue forever until it met a suitable closing </i> tag.

So, don’t forget closing tags!

The <span> tag provides a way to add a hook or a way to group words or parts of the document together. The <span> tag alone does nothing but adding a style command lets us play with the colour of the text.

<span style="color: red;">Your Word</span>

As with all tags (there are some exceptions), don’t forget the closing </span>. Play around with the colour style, pick some common colour names (orange, blue, green).

This also works in the Homepage Description field.

Leave a Reply

Your email address will not be published. Required fields are marked *