<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Mike Branski &#187; CKEditor</title>
	<atom:link href="http://mikebranski.com/blog/tag/ckeditor/feed/" rel="self" type="application/rss+xml" />
	<link>http://mikebranski.com</link>
	<description>Photographer. Web developer extraordinaire. I&#039;m a pretty cool guy.</description>
	<lastBuildDate>Thu, 22 Jul 2010 04:12:36 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Disable Editor Resizing in CKEditor</title>
		<link>http://mikebranski.com/blog/disable-editor-resizing-in-ckeditor/</link>
		<comments>http://mikebranski.com/blog/disable-editor-resizing-in-ckeditor/#comments</comments>
		<pubDate>Thu, 03 Sep 2009 13:41:11 +0000</pubDate>
		<dc:creator>Mike Branski</dc:creator>
				<category><![CDATA[Coding]]></category>
		<category><![CDATA[Tips]]></category>
		<category><![CDATA[CKEditor]]></category>

		<guid isPermaLink="false">http://www.shatteredreality.com/blog/?p=109</guid>
		<description><![CDATA[Customization is key, so when I had spent a considerable amount of time trying to disable editor resizing in CKEditor and kept coming up blank, it started to get frustrating. Here we have a pretty solid editor coupled with a pretty solid lack of documentation &#8211; reminds me a bit of Magento! To their credit, [...]]]></description>
			<content:encoded><![CDATA[<p>Customization is key, so when I had spent a considerable amount of time trying to disable editor resizing in <a href="http://ckeditor.com/">CKEditor</a> and kept coming up blank, it started to get frustrating. Here we have a pretty solid editor coupled with a pretty solid lack of documentation &#8211; reminds me a bit of <a href="http://www.magentocommerce.com/">Magento</a>! To their credit, it&#8217;s still extremely new and they are working on documentation for it. That aside, I managed to stumble across a post on their forum that led me in the right direction.</p>
<p>Open up ckeditor/config.js and put the following code in there.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">CKEDITOR.<span style="color: #660066;">editorConfig</span> <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span> config <span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
	config.<span style="color: #660066;">resize_enabled</span> <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">false</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span></pre></div></div>

<p>Ultimately, I was aiming to disable only horizontal resizing but that feature&#8217;s not available yet (can&#8217;t seem to find the forum post where a dev suggested they might implement it). The whole reason I wanted to disable resizing in the first place is because as soon as you would start to drag the resize handle, the editor width would shoot out and you couldn&#8217;t make it any smaller. Turns out it&#8217;s another somewhat hidden config setting forcing the resize width to a minimum amount.</p>
<p>If you want to keep resizing enabled but adjust the minimum width, use the following code instead.</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">CKEDITOR.<span style="color: #660066;">editorConfig</span> <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span> config <span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
	<span style="color: #006600; font-style: italic;">// Sizes are in pixels</span>
	config.<span style="color: #660066;">resize_minWidth</span> <span style="color: #339933;">=</span> <span style="color: #CC0000;">550</span><span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">// config.resize_maxWidth = 700;</span>
	<span style="color: #006600; font-style: italic;">// config.resize_minHeight = 200;</span>
	<span style="color: #006600; font-style: italic;">// config.resize_maxHeight = 500;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span></pre></div></div>

<p>As you&#8217;ll notice, there is also a setting for resize_maxWidth, along with similar ones for controlling the height. Any config settings you put in this file will be the new defaults for all editor instances, and once you know some of the things you can change here, you can really streamline the setup of new editor instances throughout your application.</p>
]]></content:encoded>
			<wfw:commentRss>http://mikebranski.com/blog/disable-editor-resizing-in-ckeditor/feed/</wfw:commentRss>
		<slash:comments>14</slash:comments>
		</item>
	</channel>
</rss>
