Tips for using the WordPress WYSIWYG editor

The WordPress WYSIWYG (What You See Is What You Get) editor is incredibly useful but just on occasions it can be incredibly frustrating in equal amounts! (particularly if you don’t use it regularly).  Here are few tips to help you get the most out of it:

• When writing a longer blog post, make use of the ‘Read more’ tag (12th icon from left, top row).  The tag tells you main blog page to just display stuff above it, and then add a ‘Continue Reading’ link so people can go through to the full post.  It makes your main blog index page easier to scan.
• Numbered or bulleted lists are easy – just click the ‘bullet’ or ‘number’ symbol to add you points.  But what happens if you want to have a sub-list – indented another level?  Good news – that’s easy too (took me a while to discover it though!).  Click on the right indent button (4th button from right, bottom row) and you’re done!  Click on the left indent button to get back to your previous level.
• Want a ‘£’ sign or a © symbol?  Click on the symbol icon (6th button from right, bottom row) and you’ll see a range of icons ready for you to insert into your post.
• Images.  Probably the most frustrating part of using a WYSIWYG editor.  Make that definitely, not probably!  A few tips:
  • Always put your cursor roughly where you want the image to end up (line-wise – it doesn’t matter whether it’s over the left or right).
  • Set an alignment – left or right (normally), so that the image floats to the left or right of the text.
  • If the image size is way out, never fear – click on the image, then click on the left hand ‘edit’ icon.  Up the top of the pop up box, you’ll have a slider with percentages – where you can adjust the image size down.
  • If the image is not appearing in quite the right place, you can try clicking on it and dragging it up to where you want it to appear.
  • If all else fails and you want to start all over again, click on the image and then on the right hand, red delete icon.  It’s worth noting that this doesn’t actually delete the image from the media library – so you don’t have to re-upload it, just re-insert it from the image uploader media tab.  (And if you do re-upload it, remember to delete the original image – again, from the image uploader media tab.
• Don’t paste directly from Word (you risk adding a load of junky formatting code at the same time – which can on ocassions muck up how the template displays) – use the ‘Paste from Word’ icon (8th button from right, bottom row) to clean up your text first
• Following on from the above, if something looks very weird when you preview/publish your post, it’s always worth checking the ‘Text’ tab (to the top right hand corner of the editor), and checking for any weird text or characters that you don’t recognise (other than <a href=”… for links, and <img src=”… for images, etc).  Remove as necessary.
• Rather that setting font sizes and colours yourself, try and stick with the Heading/Paragraph styles (via the ‘Format’ dropdown box).  This will mean that things stay congruous with your theme  & consistent across the site.
• Remember to use the built in spell checker function to check for any obvious typos – I always forget!
• Lost that second line of buttons?  Click on the ‘Show/hide kitchen sink’ button at the end of the first row to bring up the second row of buttons.

Hope those few tips help – let me know if there’s anything else you can’t work out with the WYSIWYG editor.