Using content management systems for maintaining your web site makes life much easier for web site owners, however, sometimes things don't always render as expected. Overview of the richtext editor from TinyMCE
So there you are, you've got your lovely new website and you're keen to add more content and edit existing content. You log in to the manager and start getting on with the job in hand.
There are a couple of things to watch out for when adding text to your Resource (or Page) Content. Obviously you can simply type into the blank resource content text area and you really shouldn't experience to many problems. You will be able to create paragraphs, and you may also have access to somes styles under the 'Styles' drop down list which will provide consistency across your site.
However, we all know that sometimes you simply want to copy and paste content from one source straight into your web page - but beware! Quite often if you do this without 'cleaning' any behind the scenes code you will find yourself with loads of additional and unwanted code - one of the biggest issues is copying from Word. To see exactly how this looks give it a go. Copy some text from a Word document straight into the editor and then Toggle the Editor - the toggle choice is at the bottom left of the content page. By turning off the rich text editor you can see the raw code and now you can see all the extra (previously hidden and definitely unwanted) code.
The Toggle Editor is so useful to see what is going on below the surface of your beautifully created resource and it can help you discover which sometimes there appears to be extra space appearing or even why some content ends looking completely out of place when you publish the resource and View it on the front end.
One common frustration can be when adding images. It is so easy to insert an image and you can add styling to it as required, however, sometimes it appears to have moved content down, the reason? The rich text editor has probably inserted <p><img src="YOUR IMAGE"/></p> around your image. To check if the code simply toggle your editor and remove the offending tags - SAVE before you toggle back as this ensures the changes you have made a retained, if you toggle back before you save the text editor can sometimes re-insert the code.
f you want to be sure that information you paste into your resource is clean make sure you use either the 'Paste from Word' or 'Paste as Plain Text' buttons which provide pop up dialog boxes into which you paste using the short cut CTL+V and then insert into your document.
Hopefully that gives you an insight into how to access the html code with little technical knowledge and get rid of extra spaces or unwanted code.
Check back on the Crimson Pixel blog again soon, as I will be providing other tips on how to maintain your site with MODX.