Hi.
I'm trying to set default Link color in the css file for the editor.
I'm unable to set the link color within the body part in the css file.
The only way I have made it work is to do as the example below. That is working.
BUT. I do not know how to change the link-color on the fly using a javascript function.
I need this to work. Anyone with a how to here?
I also tried to put this within the body part in code below, but without any luck:
link: #dddddd;
The code below works, but I'm not able to change the link color for the editor on the fly using a javascript function:
a:link { color: #dddddd; }
body
{
font-family: Arial, Verdana, Sans-Serif;
font-size: 16px;
padding: 5px 5px 5px 5px;
margin: 0px;
border-style: none;
background-color: #333333;
color: #FFFF00;
link:
}
I'm trying to set default Link color in the css file for the editor.
I'm unable to set the link color within the body part in the css file.
The only way I have made it work is to do as the example below. That is working.
BUT. I do not know how to change the link-color on the fly using a javascript function.
I need this to work. Anyone with a how to here?
I also tried to put this within the body part in code below, but without any luck:
link: #dddddd;
The code below works, but I'm not able to change the link color for the editor on the fly using a javascript function:
a:link { color: #dddddd; }
body
{
font-family: Arial, Verdana, Sans-Serif;
font-size: 16px;
padding: 5px 5px 5px 5px;
margin: 0px;
border-style: none;
background-color: #333333;
color: #FFFF00;
link:
}
RE: Help needed. Default link color in IE
Or is it a big secret only for paying contributors?
RE: Help needed. Default link color in IE
By the way: there is no need to post an extra message. If someone knows the answer you'll get it.
RE: Help needed. Default link color in IE
After the editor has loaded and the end user want to change the link color of the editor then I would like that to be possible by calling a javascript function from outside the FCKeditor which again calls some internal functions of the editor.
I have managed to change the width and height and the background color of the editor. But I'm unable to make it work for changing the link color.
See bottom of this message for code I would like to use to change link color... and why that code is not working....
See below for code that I'm using for changing the width , height and background-color:
function set_editor_height(h){
document.getElementById('MyTextarea___Frame').height=h;
}
function set_editor_width(w){ document.getElementById('MyTextarea___Frame').width=w;
}
function setEditorAreaColor(instanceName,daColor) {
editor_frame = document.getElementById(instanceName+'___Frame');
if (editor_frame!=null) {
editor_source = editor_frame.contentWindow.document.getElementById('eEditorArea');
if (editor_source!=null) {
editor_source.contentWindow.document.body.style.backgroundColor=daColor;
return true;
} else { return false; }
} else { return false; }
}
Then I was hoping to use something like this for changing the default link color.. but unable to do so because I'm not able to make link: #FF0000
work when used for the body styling in the css file for the editor area.
See my first post here how I managed to set a custom link color... then you will see why my code is not working....
function manipLinkColor(instanceName){
alert("start the manipLinkColor");
editor_frame = document.getElementById(instanceName+'___Frame');
if (editor_frame!=null) {
editor_source = editor_frame.contentWindow.document.getElementById('eEditorArea');
if (editor_source!=null) {
var oBody = editor_source.contentWindow.document.body;
SetAttribute( oBody, 'link' , '#ff0000' ) ;
alert("after manipLinkColor");
return true;
} else { return false; }
} else { return false; }
}
RE: Help needed. Default link color in IE
This one works in both. I guess I forgot to post it 5 months ago. Sorry bngobngo!
At any rate, the getElementsByTagName can be usefull for other stuff as well. YMMV. Enjoy!
-ps you can make the check payable to FredCK
<script language="javascript">
function manipLinkColor2(instanceName,daColor){
editor_frame = document.getElementById(instanceName+'___Frame');
if (editor_frame!=null) {
editor_source = editor_frame.contentWindow.document.getElementById('eEditorArea');
if (editor_source!=null) {
var oBody = editor_source.contentWindow.document.body;
oBody.setAttribute('link' , "green" ) ;
var a_arr = editor_source.contentWindow.document.getElementsByTagName('a');
for (var i = 0; i < a_arr.length; i++) {
a_arr[i].style.color = daColor;
}
return true;
} else { return false; }
} else { return false; }
}
</script>
Thanks a lot for the reply.
Thumbs up.
Okay... I have a follow up question
I'm working on a CMS system.
I would like the editors to be able to change the body style dynamically without refreshing the page?
Is that possible? If so... how do I do that?
The best thing for me would be to apply a class to the body part of the editor, but that might not be possible.
If the above way is not working (apply a class to the body) then I will have to be able to manipulate the style attributes of the body.
This you have actually showed me how to do in your previous post..... but then if I define a child style of the body tag like this:
body h3 { styling here }
then how do I with javascript, change the attributes of the h3 tag of the body?
If none of the above is doable I guess I will have to submit the page and redisplay it when the user changes the class to use for the body of the editor. He could do that by change a dropdown outside the FCKeditor.
But as you know this is a little awkward way of doing it.
The reason I'm asking all these questions are:
I want the editor of a site being able to define some custom styles (classes). When switching between these styles (classes) he willl change attributes like:
background-color
color
font-family
font-size
link color
link text-decoration
title and subtitle attributes
In my opinion this will make it more easy for the editor to laiter alter the site content if he uses the class this way:
When starting to edit some content:
1. Select the class to use.
He will then have set the styles automagically for most of his content and will not have to e.g select a link and then a color for that link and then.....
If he wants to insert a subtitle, then just pick a H2 which is a "child" of the selected class.
Etc...
Most of the settings in the class would/should cover most of his needs.
Then if editor follows this way of working (which he of course not have to do), then applying another look to the site would be a really easy task.
But for the editor to be able to work like this then
I would need a fast way of changing the style setting for the body in the editor......
Blaaa... this got a lot longer than I was hoping for... anyway... hope you have some input or anybody else
RE: Okay... I have a follow up question
var arr = editor_source.contentWindow.document.getElementsByTagName('h3');
for (var i = 0; i < arr.length; i++) {
arr[i].style.color = daColor;
}
where that same code is in the function I posted earlier. See that I changed the 'a' to 'h3'. I don't know if that really works, as I didn't test it, but something like that should theoretically work.
As for the styles, you might want to look at csszengarden.com and see the tao.
Having the page refresh is probably the most painless choice. Just be sure to store the text and pass it back!
RE: Help needed. Default link color in IE
Since I want my users to be able to use nested divs within the editor I find it a bit awkward to use this method:
var arr = editor_source.contentWindow.document.getElementsByTagName('h3');
for (var i = 0; i < arr.length; i++) {
arr[i].style.color = daColor;
}
Thanks for the csszengarden.com link
I have posted an open letter to FCK today and hope he can respond... then I take it from there.
RE: Help needed. Default link color in IE
If you have the classes pre-defined, you could use this:
<style type="text/css">
.first
{
color: black;
}
.second
{
color: red;
}
</style>
<script language="JavaScript">
function change(id, newClass) {
identity=document.getElementById(id);
identity.className=newClass;
}
</script>
<h1 class="first" id="changeme">Changeable text</h1>
<a href="javascript:;" onClick="change('changeme', 'second');">RED</a> | <a href="javascript:;" onClick="change('changeme', 'first');">BLACK</a>
to switch the styles/whatnot.
I'm not sure if you're gonna get any response from FredCK... you've been doing things that generally aren't socially acceptable round here. Generally, with open source projects, and indeed with any project, but specifically Open type projects, you don't say : I'll donate money, but only if you fix my problem.
I think that was in the "how to get help" link that was posted earlier. It's bad form. Besides the fact that fred was pretty clear in his past postings. (see http://tinyurl.com/9d268 ###donations and ###forums).
It's his perrogative, basically.
It is open source, so to beat a dead horse, you can develope what you want yourself, if you have the skills. It seems like you are getting better, maybe just some practice, and you will be able to do the things you want yourself, besides being in a better place to realize your CMS system.
Make a large enough donation and you get email support from FredCK.
Thanks for the description of what you'd like tho, and what's bugging you. It helps to know the user's experience and needs. Just don't expect an instant fix. And when you DO get one, be grateful and praise Bob.
Well, I gotta go drink some coffee, *yawn*, but take all this to heart. If you want.
RE: Help needed. Default link color in IE
Thanks Denny for your replies.
Well.... originally I would not have messed around with the individual body styles attributes... it is really not the optimal way to do these things. And I sure hope I do not have to do it that way.
That is why I was asking if there was a way to define a class for the body of the editor. And then ... if that was possible it would be a lot easier to switch the styling for the body of the editor. Just by changing the body class.
Is this just a dream I have or is that possible that FCK could add an optional way to handle the styles for the BODY of the editor. I would guess every CMS developer would applaud it.
Regarding donations.
I'm not against donations. And I would really like to donate. But my financial situation are not that good at the moment.... I mean... so good that I would donate to this project without knowing if I got something useful back. So that was why I was trying to describe my needs to FCK hoping that my needs was not that far away from other developers need.... and that I could get an answer from him if he could make this issues work or not within a timeframe...... If so .. then I would like to donate... I'm sorry for not beeing in a situation where I can donate without any "payback"
But as the FCKeditor work right now I'm not able to implement into my CMS.
I need to get the DIV's working as described in my open letter to FCK as well as finding a nice way to handle the styling for the body tag of the editor. Well I could eventually live with having to submit and repopulate to make the body class work... but the DIV's..... I need them to work....
I do not know much about the underlying workings of the FCKeditor but editing DIV's in TinyMCE works pretty nice in both IE and FF. But TinyMCE have other issues.
I was hoping to use FCKeditor in my project because it has a lot of potential.
Hope you enjoyed your coffee.
RE: Help needed. Default link color in IE
Use: FCKConfig.EditorAreaCSS ='path/to/css/file';
in fckconfig.js or set it when you initialize the editor.
Someone has also posted a plugin which converts css to the xml styles for use with the drop-down menu (rather nifty, I fear) if I remember correctly. Have you checked out the available plugins? Might find some kewl stuff!
RE: Help needed. Default link color in IE
Hey xenden you've been faster )
I started writing the answer a couple seconds before the sf notification came
RE: Help needed. Default link color in IE
The problem for me at least (and probably a lot of other that use FCKeditor in CMS systems) is that controlling the body styles using the CSS file is a bit problematic if you want to let end users change the style for the body of the editor area.
Someone posted a partly "how to" do that in my "Open letter to FCK" posted yesterday.
I was hoping that FCK could make it possible to optionally use styles (classes) this way in standard installation.
<body class="whatever-class">
where body above is the body for the editor area.
If it was possible to start FCKeditor this way (optionally) then it would be really easy for the users (at least mine) to switch between classes (styling) for the body or editor area...
if FCK implements a way of controlling the class in the page that displays the editor.
When I see how this works now and how easy it could be implemented.. .I'm a little more optimistic about future implementation....
*** FCK please implement this in future versions!!!! *****
If I only could get some feedback on my DIV issues posted in my "Open letter to FCK".....