By eap1935 on

htmlArea is a WYSIWYG editor to replace textareas. If you want to see it working, add a comment to this blog. You need to use MS IE 5.5 or above on Windows with JavaScript enabled, but that's a small price. (A future version will support Mozilla 1.3 on any platform.)

It was very simple to do. Details of what I did are explained in the blog entry.

Comments

Anonymous’s picture

(not verified) commented

so going back to windo$e of the black empire is not that casual to me Only local images are allowed.

moshe weitzman’s picture

moshe weitzman commented

gordon integrated this capability into drupal very cleanly. it works in mozilla and IE. coming real soon now. see his sandbox or demo it by creating a story here using IE or Mozilla - any platform

eap1935’s picture

eap1935 commented

Good, thanks for the info. I couldn't find anything in a search on any likely keywords so I went ahead and did this. I'll use gordon's module if it's released with 4.2 or whatever the next version of Drupal is.

Anonymous’s picture

(not verified) commented

Interesting, Gordon's version works in mozilla, but other versions (including htmlArea) do not.

polaar@www.drop.org’s picture

polaar@www.drop.org commented

There seems to be still another one, see
this article on MozillaZine. It also works in IE and Mozilla 1.3.

eap1935’s picture

eap1935 commented

Someone left the following suggestion in the blog comments:

Any Ideas on adding pictures? Maybe with some kind of smart [image:2, left,0,0,0] tag? A Window or so can be opened onclick(somebutton). A couple of fields allow you to add the id, size and border of the pic??

joe lombardo’s picture

joe lombardo commented

What a major win for usability! Does it test for browser platform compatability before loading? What does a linux or mac user see?

Are the changes needed in drupal to support this something that the project owners are willing to incorporate in 4.2? Or will this module always require hacking the core application?

Thanks for a great contribution!!

Joe Lombardo | joe@familytimes.com | My Blog

moshe weitzman’s picture

moshe weitzman commented

mac and linux users see the real thing as long as they are using IE or a gecko based browser like Netscape/Mozilla/AOL

no hacking of core app will be needed. you will be able to enable/disable WYSIWYG editing just like any other module.

gordon’s picture

gordon commented

The way I did it I kept it as generic as possible so it is more likely to be included.

I am working with Dries at the moment to get it included. I have also been doing some more hacking and have removed alot of the unused code and I have started including some preferences so options like the tool bar can be changed. this will mean that we will be able to make more use of htmlarea.

At this stage I have only made one minor change to the core htmlarea scripts to stop a requester from poping up with versions of Mozilla less than 1.3. This means that in the future when they release new versions of htmlarea it should be a case of just dropping in the new version.

I am glad the people like it, and are already using it.

Gordon.

--
Gordon Heydon

Anonymous’s picture

(not verified) commented

Has anyone tried ekit as a cross platform solution?
http://www.hexidec.com/ekit.php

its Java..

Anonymous’s picture

(not verified) commented

Has anyone tried ekit as a cross platform solution?
http://www.hexidec.com/ekit.php

its Java..

gordon’s picture

gordon commented

Hello,

I took a look at it and it is very slow compared to htmlarea. The other thing is that ekit seems to more of an html editor than a replacement for a text area, Plus it will take alot more modification of the form_textarea() function as this would not be a normal hook like what I have used in htmlarea. At this stage you would need to use a patched version of drupal that would never get put into standard. Other than being slow to load, and even on a 2mb connection I think that it would be a great editor.

--
Gordon Heydon

sts@1stein.org’s picture

sts@1stein.org commented

Maybe you have seen it already. Take a looke here:

http://1stein.org/node.php?id=142

Schimmi

mcking’s picture

mcking commented

...Where do i get it?!?!

ax’s picture

ax commented

http://cvs.drupal.org/viewcvs/contributions/modules/htmlarea/?cvsroot=co...

dries’s picture

dries commented

Last night Gordon moved it out of his sandbox (development environment) to the modules directory (production environment) so it will soon show up on the download page (if not already).

bertboerland’s picture

bertboerland commented

just a quick question, this does require drupal post 4.1 i guess?

--
groets

bertb

--
groets
bert boerland

moshe weitzman’s picture

moshe weitzman commented

cvs is required for this module. it uses the absolute latest hooks.

joe lombardo’s picture

joe lombardo commented

I've got drupal CVS from about 4/21 running and installed htmlarea. Strangely, I am only seeing htmlarea on text areas on admin screens.

If I choose "create blog entry" I see the standard textarea field. However, if I choose "administer" for an existing blog entry, I see the oh-so-cool htmlarea.

Comment forms are also not enabled with HTML Area.

Under admin/system/htmlarea, i've got the following checked:
admin/node/edit.body
admin/user/edit.signature
comment/edit.comment
comment/reply.comment
comment/reply/27.comment
node/add/blog.body
node/edit.body

Though I swear, the list is different everytime I look at it!

Also, under admin/system/modules/htmlarea I have Default for New Textareas enabled.

Thanks in advance,
- Joe
Joe Lombardo | joe@familytimes.com | My Blog

dries’s picture

dries commented

See the other comments above (or below depending on how you sort comments); you have to use a theme that is htmlArea-aware. If you stumbled upon a theme that does not support the htmlArea, file a bug report.

Anonymous’s picture

(not verified) commented

I installed the theme "adc" which is really clean and as minimum as what I need.
but with this theme, the htmlarea textarea doesnt show up anymore, juste the regular textarea.
It appears to be a conflict between the theme and htmlarea.
I am investigating but if you have an idea, it is welcome.
thanks

Jeremy H.
sleepz2000@yahoo.fr

Anonymous’s picture

(not verified) commented

I installed the theme "adc" which is really clean and as minimum as what I need.
but with this theme, the htmlarea textarea doesnt show up anymore, juste the regular textarea.
It appears to be a conflict between the theme and htmlarea.
I am investigating but if you have an idea, it is welcome.
thanks

Jeremy H.
sleepz2000@yahoo.fr

Anonymous’s picture

(not verified) commented

replying to myself and to Joe,

I modified the theme adc to support htmlarea.
adc wasn't calling theme_head, theme_onload_attribute and theme_footer and therefore the necessary javascript was missing.

I modified this:
in function header()

and

Anonymous’s picture

(not verified) commented

replying to myself and to Joe,

I modified the theme adc to support htmlarea.
adc wasn't calling theme_head, theme_onload_attribute and theme_footer and therefore the necessary javascript was missing.

I modified this:
in function header()
print theme_head($main);
and
print theme_onload_attribute();

in function footer()
print theme_footer();

so now I actually get the right .js files at the top and the right javascript function at the bottom (initEditor). and this function is called by the onload directive.

I get now some problems with the rollover, but I don't care. Only local images are allowed.

joe lombardo’s picture

joe lombardo commented

The line:
<? print theme_head($main); ?>
should be inserted just below the <head> tag in the theme.

The line:
< print theme_onload_attribute();?>
should be inserted into the <body> tag in the theme. Ie. <body {insert}>

The line:
< print theme_footer();?>
should be inserted just above the </body> tag in the theme.

Joe Lombardo | joe@familytimes.com | My Blog

al’s picture

al commented

Sorry about the adc theme problems - I haven't got round to updating it yet to use onload hooks, etc. I'm going to do this tonight.

al’s picture

al commented

ADC theme is now updated to work properly with htmlarea, including the rollup blocks.

thorpexmachine’s picture

thorpexmachine commented

the CVS version of the themes ADC still has a bug with htmlarea,

";" is missing in the onload when both functions "initEditor" (from the theme_onload_attribute) and preloadImages are called.

To make it work, I put in the adc.theme
$onload = substr_replace($onload, '; preloadImage();', -1, -1);

ax’s picture

ax commented

i quite like what htmlArea adds in authoring usability. one drawback it has, however, is that you, as with every WYSIWYG editor, don't have 100% control about the final markup. sure - you have that "Toggle HTML source" - but this reformats the manually edited code. thats why people prefer TeX over Word and Homesite / Dreamweaver over Frontpage.

because those leave the code as you want it. instead, they show the interpreted markup in a second, preview window. thats my favourite way of writing html. and it works for browser-based editing, too:

DHTML Previews Textarea

lean (just some 10 lines of javascript), cross-browser - perfect! this definitely gets my vote for the best drupal textarea replacement.

(for people who don't know html, this can be improved by adding textarea helper buttons (like here (IE only)). even though i would prefer just some "use &ltstrong> for strong, &ltcode> for code, ..." beside the editing area. so that people learn html ...)

comments?

joe lombardo’s picture

joe lombardo commented

I do like the immediate feedback, the speed and the respect for the users code. However, i'm concerned about the ease of use for the average joe.

While in the technical field, people prefer a tool like tex, i think the general public prefers word. I guess the nice thing about all these different solutions and an open-source project like drupal is that site admins can pick the tool that best suites their audience.

For drupal.org, my vote goes for your dhtml solution, for my family website, I think i'll go with htmlArea.

Cheers!

Joe Lombardo | joe@familytimes.com | My Blog

nolageek’s picture

nolageek commented

I followed all of the instructions (including installing the diff by hand, since i cant telnet into my server) and nothing is working. I notice "error on page" in the status window at the bottom of the page.

All I really want is a few helper buttons really.

Is there anything else I need to use htmlarea with xtemplate?

bertboerland’s picture

bertboerland commented

worked as designed for me with 4.3.1.

look again at your diff code?

i can send you my common.inc and system.module if that helps?

do they look like:
[root@kjell myblog]# wc -l includes/common.inc
1202 includes/common.inc
[root@kjell myblog]# ls -al includes/common.inc
-rw-r--r-- 1 apache apache 34243 Jan 1 12:41 includes/common.inc

and
[root@kjell myblog]# ls -al includes/common.inc
-rw-r--r-- 1 apache apache 34243 Jan 1 12:41 includes/common.inc
[root@kjell myblog]# wc -l modules/system.module
365 modules/system.module
[root@kjell myblog]# ls -al modules/system.module
-rw-r--r-- 1 apache apache 19126 Jan 1 12:41 modules/system.module

?

--
groets

bertb

--
groets
bert boerland

nolageek’s picture

nolageek commented

Thanks! Could you send me these files for 4.3.1? I'd appreciate it! nolageek (at) yahoo (dot) com

Thanks again!!

cptvitamin’s picture

cptvitamin commented

I am getting the same error that others using tableless themes were having (htmlarea doesn't work with theme using DIV ??) where loading a page that would use Htmlarea fails to produce Htmlarea and gives the following javascript error: initEditor is not defined. However, the problem the others cited does not seem to be the issue here as the javascript seems to be properly loaded. Any ideas? When i switch to different theme, Htmlarea works fine.

cptvitamin’s picture

cptvitamin commented

Sorry but i figured out the issue. it was not printing the theme_footer, which was the problem with the other tableless designs.

ldyguique’s picture

ldyguique commented

I've transferred all of the files, except for the drupal.diff -- the install file says to "apply patch drupal.diff to stardard drupal source"

How do I do this? My version of drupal was installed via a Fantastico "auto install" interface. I'm willing to dink around to get it right, I just don't know how at this time.

gatezone’s picture

gatezone commented


htmlArea is great! Thanks for such a great module.

I'm not sure about the preference settings in terms of what needs to be turned on. Are they all functional or only functional with other modules installed?

PS - are you sure you don't want to write a module to help us order nodes within a term... To this non-coder ;-( it seems like it would be much simpler than htmlArea.