Here is a custom CK Editor Toolbar config for interested Ecommerce Templates users. This is what it does ...

1) When you Login and go to Product Admin or Categories ... Modify, the CK Editor Toolbars for both "Description" and "Long Description" editing windows will be OPEN by default.

2) The pesky little Arrow to Open and Close the Toolbar is GONE. In minimized view the Toolbar will now always remain open. You can now use any Web Browser for Product Admin without that Toolbar Open/Close issue interfering.

3) Creates a new custom set of "frequent use" Toolbar Icons for the basic minimised view. Includes a "Save" icon, which works exactly the same as the "Submit" button.

4) Rearranges the Toolbar Icons in full maximised view so that "frequent use" icons all appear in the bottom 3rd row.

===============================================================
This is what the new Toolbars will look like ...





===============================================================

DOWNLOAD and INSTALL

Step 1) Look in your website folder named vsadmin\ckeditor and copy the 2 files named config.js and ckeditor.js
Paste both those files into some other folder as a Backup.

Step 2) Click here to download this CK Editor Custom Toolbar Config WinZip file >

Step 3) Unzip both new config.js and ckeditor.js files into your website folder named vsadmin\ckeditor and replace the existing files (that you did Backup first, yes ?).

Step 4) Very important you do this to specify which CSS style sheet you want CK Editor to use in the Website Admin Panel.
Open the new config.js file. At LINE 58, find the code that says ...

quote:

---

config.contentsCss = '../css/ckeditor.css';

---

Edit the red bit to specify the correct Folder location and Filename for the CSS style sheet you want CK Editor to load.
Save changes to the config.js file.

Step 5) Upload both new config.js and ckeditor.js files to your server.

Step 6) Must do this. Open your Web Browser and clear the Browser Cache so that those Toolbar Menu changes become visible immediately you next Login and Modify a webpage.
In Firefox you press "Alt" to see top menu, then Tools => Options => Advanced => Network tab.



Step 7) You are done ! Login to your Website Admin Panel and check out the new Toolbars.

Gary

If you want to restore that pesky little Arrow that Opens and Closes the CK Editor Toolbar in minimised view, here is what to do ...

Step 1) In the vsadmin\ckeditor folder, open the file named config.js

Step 2) At LINE 11, notice I added code that says ...
========================================================================================================================

Step 3) Change that to true. Or just delete that line of code. Either way works.

Step 4) Save and Upload amended config.js file to server.

Step 5) Clear your Web Browser Cache. Login to Website Admin Panel and check out the Toolbar behaviour.

Gary

If you do not want to use my custom CK Editor Toolbar config files that rearrange the default icon sets, but you do want the Toolbar to be Open by default, here is what to do ...

Step 1) In the vsadmin\ckeditor folder, open the default version of the file named ckeditor.js

Step 2) Search for config.toolbarStartupExpanded!==false,x;
You will find this at the very end of LINE 94.

Step 3) Change that to config.toolbarStartupExpanded!==true,x;

Step 4) Save and Upload amended ckeditor.js file to server.

Step 5) Clear your Web Browser Cache. Login to Website Admin Panel and check out the Toolbar behaviour.

Gary

If you want to change the CK Editor Toolbar Icon Set configuration to your liking for Basic Minimised view or Full Maximised view, then that can be done by editing the code in the file named config.js

Before you begin, do recommend you take a look at this CK Editor Developers Guide page :

http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Toolbar

That will give you the gist of what's going on there.

Gary

Edit the red bit to specify the correct Folder location and Filename for the CSS style sheet you want CK Editor to load.
Save changes to the config.js file.

Maybe I'm being thick here but what style sheet should I change this to? Is this the main css file for the site or the adminstyle.css?

I used the adminstyle.css file... and it worked! Just as an FYI for anyone else, LOL!



Julie
Browns Summit NC USA

Hi Julie, you could use your main.css website file.

But I open that, save as ckeditor.css, and then trim it right down so it contains only the bare essentials that CK Editor needs.
The reason (I think) this is best way to go is explained in another thread here >>
And to get particular classes to appear in your CK Editor 'Styles' dropdown menu, read this page here >>

Gary