Xinha Discussion Forum

willeffects

Xinha Authority

Registered: 2005-03-19

Posts: 130

some customizing look questions

1. It says:

  /** CUSTOMIZING THE TOOLBAR
   * -------------------------
   *
   * It is recommended that you customize the toolbar contents in an
   * external file (i.e. the one calling HTMLArea) and leave this one
   * unchanged.  That's because when we (InteractiveTools.com) release a
   * new official version, it's less likely that you will have problems
   * upgrading HTMLArea.
   */

Does that mean you should actually remove the "this.toolbar =" contents from htmlarea.js?  If you do that where/how do you get xinha to read the new customized file?

-- I would think this stuff should be broken out into a skin system shouldnt it?

2. Where do I control the color/css for xinha?

Thanks,
Will

adamp

Xinha Pro

Registered: 2005-03-14

Posts: 77

Re: some customizing look questions

1. You wouldn't change htmlarea.js, you just re-define the toolbar in your my_config.js (if you followed the newbie guide), or other external file by using something along these lines:

var config = new HTMLArea.Config();
config.toolbar = [
  ['fontname', 'space',
   'fontsize', 'space',
   'formatblock', 'space',
   'separator', 'my-hilite', 'separator', 'space', // here's your button
   'bold', 'italic', 'underline', 'space']
];

I believe gogo is working on some sort of skinning system, but he hasn't mentioned much about what it will cover.

2. htmlareas.css in your /xinha folder

niko

Xinha Authority

From: Salzburg/Austria

Registered: 2005-02-14

Posts: 338

Re: some customizing look questions

Does that mean you should actually remove the "this.toolbar =" contents from htmlarea.js?  If you do that where/how do you get xinha to read the new customized file?

of course not...
the file where you setup xinha loads htmlarea.js (which has the default-settings for the toolbar) and then you can modify these settings.

2. Where do I control the color/css for xinha?

you can define css-rules for xinha using config.pageStyle.

Last edited by niko (2005-03-31 05:22:26)

---

Niko

willeffects

Xinha Authority

Registered: 2005-03-19

Posts: 130

Re: some customizing look questions

thanks for the quick replies guys.

I am trying to change the height and width of the buttons.  When I use:

   height : 20px;
   width : 20px;

in my

.htmlarea .toolbar .button {} class it only seems to work in firefox, not IE.  Anyone know the proper cross browser code?

Thanks

willeffects

Xinha Authority

Registered: 2005-03-19

Posts: 130

Re: some customizing look questions

Does anyone know the best way to move the insert table into the bar with the tableOperations plugin buttons?  It makes more sense to put it there, but it seems the plugin uses a different function to build it:

    // register the toolbar buttons provided by this plugin
    var toolbar = ["linebreak"];
    for (var i = 0; i < bl.length; ++i) {
        var btn = bl[i];
        if (!btn) {
            toolbar.push("separator");
        } else {
            var id = "TO-" + btn[0];
            cfg.registerButton(id, tt[id], editor.imgURL(btn[0] + ".gif", "TableOperations"), false,
                       function(editor, id) {
                           // dispatch button press event
                           self.buttonPress(editor, id);
                       }, btn[1]);
            toolbar.push(id);
        }
    }