Xinha Discussion Forum

In which case what you're trying to do is not feasible as standard. Xinha is a WYSIWYG, so it has to display any code you give it, but it of course doesn't have the functionality of the template engine.

You could try writing a 'code shielding' function as has been suggested for hiding PHP code, but there's no ready-made solution.

Basically what you would do is have some kind of image that is shown when in WYSIWYG view, where the alt tag of the image has the code being hidden. This wouldn't necessarily work for you however, as putting an image inside an input value causes even more problems.

As long as you don't want to edit the template codes (the [% ... %] bits), you could write a script to pull them all out (using a similar regex to the code I gave before) and hide them in a set of hidden inputs which are then put back in when you save the template.

e.g. say you had this code:

<form action="[% component.formpath %]" method="post">
<input type=hidden name=component_id value=[% component.component_id %]>
<input type="submit" />

You would write some code where each template tag is pulled out into an array that gets passed separately from the WYSIWYG contents, so the first tag becomes something like [tag_1], the second becomes [tag_2] and so on and you then have an array where $array[1] has the value "[% component.formpath %]" and $array[2] has the value "[% component.component_id %]"

You can then pass the array either with the form or as a session value and put them back in before saving the template (i.e. you swap bacl [tag_1] for $array[1] etc.)

In other words, there's no easy solution from the info you've given.

Good point, hadn't noticed the bit about adding it in htmlarea.css

I think you'll need to play with the width of the iframe in htmlarea.js making it smaller than the editor width.

I don't handle it at the moment as I haven't used Xinha on any client sites yet. A quick and dirty solution is to style p tags in both your editor and your site to remove the spacing (margin:0) though you then lose the ability to have paragraphs when you do want them.

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

Not so sure on using it in that context, but editor.insertHTML() should work (presuming you've declared editor as an HTMLArea somewhere)

No problem, though it's not me that writes Xinha - you have gogo to thank for that

The newbie guide explains what the content of my_config.js should be, which includes the xinha_init function. Are you editing section 2 of the my_config.js to include the name(s) of your textarea(s)?:

xinha_editors = xinha_editors ? xinha_editors :
      [
        'myTextArea',
        'anotherOne'
      ];

In the above, each array item should be the ID of each textarea you want to use Xinha. When you then add the onload="xinha_init()" to your body tag, it'll create Xinha editors for each textarea you specified in the xinha_editors array above.

Hmm, there's no reference to full_example.js anywhere in my code.

If you've followed the newbie guide then you need to change the onload="initEditor()" in the body tag for onload="xinha_init();"

You can then get rid of the old HTMLArea stuff.

It might just be that it's in Italian, but that has me confused

I can't find a page using Xinha and it's printing a lot of strange code at the top.