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:
link style


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.

 


gurechan
Novice

Oct 4, 2004, 5:30 AM

Post #1 of 4 (3068 views)
Shortcut
link style Can't Post

Does anyone know how to set up the create link part of the script so that it adds a css style class to the link. I guess the change needs to be done to the code below.

Even better would be an insert link popup that allows you to set all the paramaters for the link, including the actual link text. There was such an add on in version 2, is there such an add on for version 3 yet?

Any help would be great.

Code from line 1390 in htmlarea.js

HTMLArea.prototype._createLink = function(link) {
var editor = this;
var outparam = null;
if (typeof link == "undefined") {
link = this.getParentElement();
if (link && !/^a$/i.test(link.tagName))
link = null;
}
if (link) outparam = {
f_href : HTMLArea.is_ie ? editor.stripBaseURL(link.href) : link.getAttribute("href"),
f_title : link.title,
f_target : link.target
};
this._popupDialog("link.html", function(param) {
if (!param)
return false;
var a = link;
if (!a) {
editor._doc.execCommand("createlink", false, param.f_href);
a = editor.getParentElement();
var sel = editor._getSelection();
var range = editor._createRange(sel);
if (!HTMLArea.is_ie) {
a = range.startContainer;
if (!/^a$/i.test(a.tagName))
a = a.nextSibling;
}
} else a.href = param.f_href.trim();
if (!/^a$/i.test(a.tagName))
return false;
a.target = param.f_target.trim();
a.title = param.f_title.trim();
editor.selectNodeContents(a);
editor.updateToolbar();
}, outparam);
};


(This post was edited by gurechan on Oct 4, 2004, 5:31 AM)


chr at 1komma6
Novice

Dec 2, 2004, 11:04 AM

Post #2 of 4 (2908 views)
Shortcut
Re: [gurechan] link style [In reply to] Can't Post

try:


Code
		a.target = param.f_target.trim(); 
a.title = param.f_title.trim();
// insert a css class to your Link
a.className = 'textlink';
editor.selectNodeContents(a);
editor.updateToolbar();


If you find a way to make this configurable, please tell me.


gurechan
Novice

Dec 5, 2004, 5:09 PM

Post #3 of 4 (2862 views)
Shortcut
Re: [chr at 1komma6] link style [In reply to] Can't Post

Thanks, that works great.


fishnyc22
New User

Jan 10, 2005, 8:50 PM

Post #4 of 4 (2641 views)
Shortcut
Re: [gurechan] link style [In reply to] Can't Post

Hi,

I just downloaded htmlArea. Its an awesome tool!
I'm looking to do the same thing. I need to add a class='blue' to the href tags in the form. But I added the content above and it seems to work sporadically. For example, here is the source that was output. I had added some links to the example text: I'm using the beta of version 3 so I can use FireFox.


Code
<h3>HTMLArea #1</h3> 
<p><a href="test.html">This</a> will <a class="blue" href="test.html">submit</a> a <a href="index.html" class="blue">field</a> named <em>text1</em>.</p>


You can see that sometimes the class='blue' is not there and sometimes it is first after the <a and sometimes it is after the href. Very weird.

It is important that the class attribute comes before the href so that the rollover effect works on all browsers. Any idea why its not consistant? Heres the code I added.


Code
a.className = 'blue'; 
a.target = param.f_target.trim();
a.title = param.f_title.trim();
editor.selectNodeContents(a);
editor.updateToolbar();


 
 
 


Search for (options)