title: How to use customized tool bar in tiny mce?
body: <p>I'm using tiny mce in one of my projects and client do not want to use the Horizontal tool bar of tiny mce. He wants a centralized custom tool bar from where user can control all the properties like text color, type of text, size, back grounds and every thing that is needed to do while designing a web page using templates. I configured the mce instance with out its default tool bar and controlled the properties from the customized tool bar. And the properties are applied to the tiny mce instance as a whole. But now, the requirement has come up that, the text editing should be in MS office style.That means, if user has placed cursor at one place and changes color, nothing will be affected, but if he starts typing from the cursor position the text should have the color which was set recently. I tried to use the external tool bar option. But, my work area and customized tool bar are at different z index levels. So, positioning the tool bar fails. If I append the tool bar to  my customized tool bar, it is not click-able. So, how to invoke tiny mce's core functionality using customized tool bar? </p>
  
  <p>Or, Kindly suggest, should I change editor ? Then, which one should I go for ? </p>
  
  <p><strong>EDIT</strong>
  As per the suggestion, I'm writing the function save the property styles and insert the span at caret position. But I'm facing some problems and could not do it after spending whole day. I could add span at caret position by using following code. </p>
  
  <pre><code> marker = ed.selection.getBookmark();
   ed.selection.moveToBookmark(marker);
   tinyMCE.execCommand('mceInsertContent',false,'&lt;span id="mytitle"&gt;&lt;/span&gt;');
  </code></pre>
  
  <p>But still, I failed to type inside the new span. Also, I could not figure out how to set styles to this span.</p>