Maybe you've got a particular style you want your client to be able to apply to an object when they are editing content in the text editor? Maybe you'd like for them to easily be able to set font color to a color you specify, or be able to create a special formatting on certain paragraphs. Now you can make this easy for them through new Text Editor Styles. Text Editor Styles are available in Water, Sky and Light.
Here's an example of how I used a Text Editor Style to make things easier on myself when I am making blog posts.
Whenever I post a blog article that includes an image, I often like to style that image to float right and let the text wrap around it. Previously, I would go into the code view of the text editor and add these styles to the images inline. Not a big deal, but it does take a little time. Plus, it's probably a little more complex of a task than you want to hand over to your clients. So, here's what I did.
On the stylesheet for this website, I added the following lines of CSS:
/* <textEditor> */
.blogImageFloat { float: right; margin-left: 10px; }
/* </textEditor> */
The commented textEditor tags tell the system to extract those styles and place them into the text editor. So then when I go and open my text editor and click on the drop down that says "Apply CSS Class," I see the following:
You can see that in my CSS drop down I now have a .blogImageFloat class, which is what I defined in my CSS file. All I have to do is click on the object to which I want to apply the class (an image), then select the class from the drop down and boom, styles are applied much faster than manually adding inline styles to the HTML code.
This handy new feature not only allows you to provide a simple way for your clients to apply specific styles to items on their website, but it can also save you a lot of time when you are editing content as well. Either way, Text Editor Styles are available now on all sites. Enjoy!
Posted on
Tue, November 6, 2007
by Tim Wall