Our new Marketing Tips category features a series of videos from Wildheart’s Content Queen, Hannah. We’ll be sharing hot marketing tips via screencast videos, so you can see exactly how to do it yourself – making your life just that little bit easier!

Clearing formatting errors in WordPress

In this month’s video Hannah introduces you to one of her best WordPress friends – the clear formatting tool! If you regularly copy and paste content into your WordPress website then you’ll want to watch this one!

Watch our 4-minute video or read the transcript below.

Video transcript

[00:00] Hi, I’m Hannah from Wildheart Media. In today’s Marketing Tips video I’m going to share a really useful tip with you for making sure you don’t have any weird formatting errors when copying and pasting into your WordPress website. So, you might have found that when you copy content from somewhere like an email, or a Word document, or perhaps a Google Doc, and you paste it into a blog post or a page on your WordPress website, that sometimes it comes out with some odd formatting – maybe your subheadings don’t look quite right, or there’s just some strange formatting going on. So I’m going to give you a really useful tip for making sure that doesn’t happen.

[00:46] So, let’s say I want to add a new post onto the Wildheart website. So I go to Posts and Add New. Now, depending on what editor you’re using – we actually use Tatsu to edit our posts – but you can still access the normal WordPress editor as well, so I’m going to show you in here how to do this. So, I’m in normal visual editing mode and this should look quite familiar to you. So this visual editor appears in lots of different places and it’s also known as a ‘WYSIWYG’ editor, which stands for What You See Is What You Get.      

[01:30] And if we stay on the visual tab here for now, and let’s say I want to copy some content, so this is from a recent blog post. I’m going to copy some of this content from this Google Doc and I’m just going to paste it into the visual editor. Now, what happens is, this heading doesn’t look quite right to me. I know what these headings normally look like and the formatting isn’t quite right.  

[02:03] I can also see that if I click into this content, down here at the bottom of the visual editor it’s showing me a ‘p’ which stands for paragraph, but we also have this ‘span’ tag, which we don’t want. This basically means that it’s picked up some erroneous formatting from the document that we pasted the content from – from here – and this nearly always happens if you’re copying from a Google Doc, a Word document or an email.

[02:33] So, you can see this span tag here and if I switch into the Text mode, which actually shows you the html, you can see that we have all these span tags here and it’s trying to pull in lots of information about the font. And we don’t actually want this, we don’t need any of these tags. So, all you do is, in here, select all of the content that’s in here, so you can use control (Ctrl) or command (Cmd) + A to select all, and then it’s this button here that is our friend! It’s the ‘Clear formatting’ button.

[03:08] So, if we go ahead and click that, you can see this heading has now changed format and I know that that’s what it normally looks like. And if I click into a paragraph we just have a nice clean ‘p’ at the bottom here, which just means paragraph. And if I go back into Text mode, all of that erroneous html that we didn’t want has disappeared, and we’ve just got nice clean text. You don’t need to know much about html to know about this, but if you do see those span tags when you’ve copied and pasted from somewhere  else, it’s really best to get rid of them and then you know that when you view this content on the front end, it’s going to look exactly as it should. There’s our H1 and there’s our paragraph text.

[03:55] So, this clear formatting button, this icon here in the visual editor toolbar, is really, really useful and I would advise any time you’re copying and pasting content into any page or post in WordPress, you always highlight it all as soon as you’ve pasted it in and use this clear formatting tool. And then you know you’re going to have clean text and it’s going to display correctly on the front end.

[04:20] OK, I hope that was useful and if you’d like any help with your marketing, do fill in the form below this video and we’ll make a video about it next time. OK, thanks, bye.