htmlArea

A directory of browser-based WYSIWYG editors

  MAIN
INDEX
SEARCH
POSTS
WHO'S
ONLINE
LOG
IN

Home: htmlArea 3 (beta): htmlArea 2 & 3 archive (read only): htmlArea v3.0 - Discussion:
<b> and <i> vs <span>


The htmlArea 2 & 3 editors have been discontinued.

We've made these forums available as a read-only reference and knowledge-base for people using or developing editors based on htmlArea 2 or 3.

Anyone who is interested in taking over version 2 or 3 is free to do so. All we ask is that you choose a new name that doesn't have "htmlarea" in it to avoid confusion with this site. We'll even give you a link in the directory to make it easier for people to find you. If you are developing or hosting an htmlArea based-editor under a new name, please submit it to our directory.

First page Previous page 1 2 Next page Last page  View All


kalessin
New User

Mar 1, 2003, 3:31 AM

Post #1 of 28 (7433 views)
Shortcut
<b> and <i> vs <span> Can't Post

Hiya,

Love the Moz compatibility!

I'm wondering how to change the <span ...> tags that are used for any new bold/italic/underlined text. My website tries to convert user HTML into other formats, and I'd rather not have to worry about looking through tag attributes to find this kind of formatting information. (And it looks pretty ugly for the users who will only see the textarea.)

I can't find the span tags anywhere in the downloaded files, however. Is this something that the browser does on its own? And is there a workaround?

Love your work!


gurix
Novice

Mar 7, 2003, 4:35 AM

Post #2 of 28 (7375 views)
Shortcut
Re: [kalessin] <b> and <i> vs <span> [In reply to] Can't Post

Holy holly that's my problem too! I parse the generatet output for kick out pdfs. Exists any solution to work with the old tags and not with spans?


dlo_itools
Staff


Mar 14, 2003, 4:01 PM

Post #3 of 28 (7332 views)
Shortcut
Re: [kalessin] <b> and <i> vs <span> [In reply to] Can't Post

You have to configure this in Mozilla. In the Preference settings for Composing, uncheck the box for "Use CSS Styles instead of HTML". Then the toolbar will generate <b> and </b> instead of <span>...
/Dave Lo


gdurys
New User

Apr 22, 2003, 10:03 AM

Post #4 of 28 (7264 views)
Shortcut
Re: [dlo] <b> and <i> vs <span> [In reply to] Can't Post

You can use the "useCSS" command to change the behaviour of Midas.


jammjamm
Novice

Jul 22, 2003, 9:54 PM

Post #5 of 28 (7161 views)
Shortcut
Re: [gdurys] <b> and <i> vs <span> [In reply to] Can't Post

>> You can use the "useCSS" command to change the behaviour of Midas.

I've been fooling with htmlarea, trying to auto-initialize the mozilla "usecss". I sucessfully made a button that turns on and off CSS formatting in Mozilla, but I can't figure out wher I can add the code so that it automatically make Mozilla not use css.

Any pointers would be greatly appreciated! Thanks!


bill@wemc.net
Novice

Jul 23, 2003, 8:37 AM

Post #6 of 28 (7141 views)
Shortcut
Re: [dlo] <b> and <i> vs <span> [In reply to] Can't Post

Thanks! This is excelent info. I have to switch between MSIE and Moz and the resulting code was getting pertty conviluded.


gereac
New User

Aug 19, 2003, 6:22 AM

Post #7 of 28 (7036 views)
Shortcut
Re: [dlo_itools] <b> and <i> vs <span> [In reply to] Can't Post


In Reply To
You have to configure this in Mozilla. In the Preference settings for Composing, uncheck the box for "Use CSS Styles instead of HTML". Then the toolbar will generate <b> and </b> instead of <span>...


Yes, but still the html code generated is not the same. What would happen if I will parse afterwards the content of the html area ? I don't know when someone will use IE and when he is using Mozilla. It would be ok if the html code genrated would be the same.


spinnergy
Novice

Aug 19, 2003, 12:48 PM

Post #8 of 28 (7017 views)
Shortcut
Re: [kalessin] <b> and <i> vs <span> [In reply to] Can't Post

Shouldn't the default behavior be <strong> for bold and <em> for italics???

Atleast that's what every "Web Standards" evangelist I know of says. Why waste bandwidth with <span style="font-weight:bold"> tags? This defeats the whole purpose of CSS and web standards!!! Never use an inline style when there is a valid, non-deprecated tag that can do the same thing.


webmonkey
Novice

Aug 20, 2003, 1:29 PM

Post #9 of 28 (7000 views)
Shortcut
Re: [spinnergy] <b> and <i> vs <span> [In reply to] Can't Post

Yea CSS1 inline styles are kinda frowned upon... but they are a standard and so Midas(Mozilla DOM) supports it. But you can turn it off...

If anyone has created a plugin or some code to change it please post here. Or I will when I get around to fixing my editor.


tajan
New User

Aug 21, 2003, 3:09 AM

Post #10 of 28 (6998 views)
Shortcut
Re: [jammjamm] <b> and <i> vs <span> [In reply to] Can't Post


Quote
I've been fooling with htmlarea, trying to auto-initialize the mozilla "usecss". I sucessfully made a button that turns on and off CSS formatting in Mozilla, but I can't figure out wher I can add the code so that it automatically make Mozilla not use css.



I've had the exact same problem. I tried to work on this on the Mozilla example of html editor : http://www.mozilla.org/editor/midasdemo/

There is a check box you can click on to switch off the usecss feature but if you put the exact same code directly into the page onLoad() function, it doesn't work.

So I found that it would work if I simulate a click on the check box by adding this line to the Start() function :


Code
  

document.getElementById('usecsscheckbox').click();




ST.


webmonkey
Novice

Aug 21, 2003, 4:08 PM

Post #11 of 28 (6984 views)
Shortcut
Re: [tajan] <b> and <i> vs <span> [In reply to] Can't Post

Should be able top put the disable Code in the Init function.


nels
Novice

Aug 26, 2003, 12:07 PM

Post #12 of 28 (6936 views)
Shortcut
Re: [webmonkey] <b> and <i> vs <span> [In reply to] Can't Post

Has anyone figured out how to do this? I put

Code
  document.getElementById('edit').contentWindow.document.execCommand("useCSS", false, false);

in my init function, but I get

Error: document.getElementByID("edit") has no properties

in the javascript console. What is the correct id for the iframe? I've tried everything I can think of, but nothing works.


ilmarine
Novice

Aug 28, 2003, 9:58 AM

Post #13 of 28 (6910 views)
Shortcut
Re: [nels] <b> and <i> vs <span> [In reply to] Can't Post

there are three way to execute this command.

1) either by creating a button in the page code that "houses" the editor with the onclick event:

document.getElementById('ContentIframe').contentWindow.document.execCommand('useCSS',false,true);

[this will turn the css functionality of permanently]

2) secondly, creating a checkbox with the onclick event:

document.getElementById('ContentIframe').contentWindow.document.execCommand('useCSS',false,this.checked);

[this lets your turn it on and off by clicking on the checkbox]

3) and thirdly by hardcoding it into the htmlarea.js file. somewhere near the 750 line there is this code:editor._doc = doc;
doc.open();
var html = "<html>\n";
html += "<head>\n";
html += "<style>" + editor.config.pageStyle + "</style>\n";
html += "</head>\n";
html += "<body>\n";
html += editor._textArea.value;
html += "</body>\n";
html += "</html>";
doc.write(html);
doc.close();

now add right after this:

if (HTMLArea.is_gecko) {
doc.execCommand("useCSS",false,true);
}

and voila, mozilla doesn't use css anymore!

p.s. the structure of this command is very peculiar - the last true switches the usecss off and the last false switches it on.


ilmarine
Novice

Aug 28, 2003, 10:12 AM

Post #14 of 28 (6905 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post

it seems that i spoke too early. even if you turn the usecss for editor off on creation, every time you use some button that uses css (like higlight text or background color), or even use style in html editing mode, the usecss is turned back on. i found out that if you turn the css off right after the execution of background color it stays that way and the bold button inserts nixe <b> and </b> tags...

maybe the right way to go would be to call it after every command????


ilmarine
Novice

Aug 28, 2003, 11:00 AM

Post #15 of 28 (6903 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post

on with my ramblings (maybe someone will find this useful someday ;)

and i was right, if you insert the following into the end of the _execCommand function, mozilla will switch its css capabilities off after each action:

this.updateToolbar();
if (HTMLArea.is_gecko) {
editor._iframe.contentWindow.document.execCommand("useCSS",false,true);
}
return false;

[ihave included the two lines between which the code should be inserted. this is somewhere on the line 1400 but i may be wrong since i have changed the code very much]

so, this did the trick and i even could use the font color button. however, the background color button stopped working. my anser to this problem was to go some 20 lines back where it says case "hilitecolor": and insert the following code right after:

this._popupDialog("select_color.html", function(color) {
if (color) { // selection not canceled
editor.execCommand('RemoveFormat');
editor.surroundHTML('<span style="background-color: #' + color + '">', '</span>');
}
}, HTMLArea._colorToRgb(this._doc.queryCommandValue(cmdID)));
break;

notice that i use remove format command. this erases all the formating (including bold and suchlike) in the selection to which the background color is applied to. so you may want to comment that line out if you use this code.

i am also pretty positive that the old insert hilitecolor can be get working once again. also, it would be nice to make mozilla stop using those ugly rgb values it uses (ie. rgb(204, 255, 102))

peeter


nels
Novice

Aug 28, 2003, 4:47 PM

Post #16 of 28 (6891 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post

Thanks for the reply.
It appears that the iframe isn't given the id property in htmlarea.js. I got #1 to work by adding the line

document.getElementsByTagName('iframe').item(0).id = 'contentiframe';

in my initEditor() function. I didn't try #2, because I want to turn css off permanently and preferably automatically, as in #3, which also worked. However, when I switched to HTML source mode and then back to WYSIWYG mode, css was turned on again in both methods! Any ideas on how to make it stay turned off, or turn it off again when switching modes?


ilmarine
Novice

Aug 28, 2003, 6:12 PM

Post #17 of 28 (6893 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post


Quote
and i was right, if you insert the following into the end of the _execCommand function, mozilla will switch its css capabilities off after each action:

this.updateToolbar();
if (HTMLArea.is_gecko) {
editor._iframe.contentWindow.document.execCommand("useCSS",false,true);
}
return false;

[i have included the two lines between which the code should be inserted. this is somewhere on the line 1400 but i may be wrong since i have changed the code very much]



this is how you can switch the use css off permanently. even switching between modes doesn't cause any problems.

p.s. there is a slight problem with older mozilla code. if you turn the css off then mozilla doesn't recognize its own span tags anymore and for instance bold placed earlier can not be removed from text via toolbar but only via html source.


nels
Novice

Aug 28, 2003, 6:59 PM

Post #18 of 28 (6890 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post

That works - thanks! Maybe mishoo could make this a configuration setting, so we don't have to modify the main source file...?


ilmarine
Novice

Aug 28, 2003, 8:26 PM

Post #19 of 28 (6889 views)
Shortcut
Re: [nels] <b> and <i> vs <span> [In reply to] Can't Post

before this can be done, there are many issues to cover. the v3beta code is still not as flexible, as simple and as bugfree as that of v2. also, the midas engine is just taking its first steps and those steps are still a bit shaky (this same styles issue for example) and we don't were the developers are actually heading (specifically).

but yeah, i also think that this usecss false thing should be implemented because the code is waaay nicer. any comments mishoo?


spinnergy
Novice

Oct 21, 2003, 3:20 PM

Post #20 of 28 (6460 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post

Mishoo, could you comment on this? I think that there should be a consensus that this should be the default behavior of the editor. using <span style="blah, blah> tags when more semantically correct ones (em, strong, etc) are available is nonsense.


SamM
Novice

Nov 12, 2003, 9:56 AM

Post #21 of 28 (6303 views)
Shortcut
Re: [ilmarine] <b> and <i> vs <span> [In reply to] Can't Post

Has anyone noticed that this fix doesn't work with Mozilla 1.5?


tonio-mgd
Novice

Dec 9, 2003, 8:47 PM

Post #22 of 28 (6098 views)
Shortcut
Re: [spinnergy] <b> and <i> vs <span> [In reply to] Can't Post

I agree. Mishoo?


Custa
Novice

Dec 13, 2003, 1:25 PM

Post #23 of 28 (6032 views)
Shortcut
Re: [spinnergy] <b> and <i> vs <span> [In reply to] Can't Post


In Reply To
Mishoo, could you comment on this? I think that there should be a consensus that this should be the default behavior of the editor. using <span style="blah, blah> tags when more semantically correct ones (em, strong, etc) are available is nonsense.


Yeah I can't even see why <b> or <i> is an issue here. Things should definitely be <strong> and <em> to have cleaner code created. I definitely vote for things to be moved towards them.

Mishoo or anybody else out there agree or think of any reason this should not be the case?

On a side note thought this lil app is starting to get mighty fine. Kudos to all people pumping out code for it, you are all Angelic ....Laugh


wroxbox
Novice

Mar 2, 2004, 6:01 AM

Post #24 of 28 (5302 views)
Shortcut
Re: [tonio-mgd] <b> and <i> vs <span> [In reply to] Can't Post

Hi!

Is there a official (Mishoo?) opinion about this?

imho it would be good to have some control over this issue. Many CMS -tools are used with both IE and *zilla's so for the same output this issue must be solved..


Shovelface
New User

Mar 2, 2004, 1:13 PM

Post #25 of 28 (5292 views)
Shortcut
Re: [wroxbox] <b> and <i> vs <span> [In reply to] Can't Post

I was wondering if word cleaner and an "anti word cleaner" could be used to clean up between edits. In other words, IE uses <strong> and <em>, Mozilla uses <b> and <i> (or <span...>). For all intents and purposes this will render the same when the page is ultimately shown. The problem is making sure editors in both browsers can toggle bold/unbold correctly. But this could also keep submitted code aligned from both browsers.

I think it would go like this:
- On "View Source" or "Submit", the code would be Word Cleaned (which currently removes double-tags and replaces <b> etc with <strong> etc).
- On "Submit", the code would be Word Cleaned, keeping submitted code consistend between browsers.
- On a switch back to "HTMLarea" (rendered), the code could in Mozilla "anti word clean" back to <b> or <span> etc., so that the Mozilla editor can perform operations on the code.

I also looked into just replacing the B/I/U functions with custom built ones, but haven't gotten very far yet. The useful "surroundHTML" makes this fairly easy, but there's no capacity I can find to toggle on and off (recognize it's surrounded so when you hit B again, the bold code is removed). But maybe I'm missing something... (I haven't been playing with it long.)

Any more ideas?

-Trout

First page Previous page 1 2 Next page Last page  View All
 
 


Search for (options)