Support forums - Editable area background color

Support forums » Products » Cute Editor for .NET » Re: Editable area background color

Editable area background color

Last post 09-15-2008, 10:37 AM by atconway. 8 replies.


	Sort Posts: Previous Next

01-05-2005, 10:07 AM 3273

Phil
Joined on 07-07-2004
Posts 36

Editable area background color

Reply Quote

In the previous release we could set background colors and images for the editable region of CuteEditor. Now the background color seems to set background for the toolbars as well, and the background image attribute seems to be missing. Is there a work-around?

I also would like the html view to be black on white independent of the Normal view backgrounds.

01-05-2005, 12:06 PM 3277 in reply to 3273

Adam
Joined on 09-23-2003
Aurora, ON
Posts 18,678

Re: Editable area background color

Reply Quote

Phil,

Add the following code into your template.aspx file:

body {background-color: black;}

asp.net Chat http://cutesoft.net/ASP.NET+Chat/default.aspx
Web Messenger: http://cutesoft.net/Web-Messenger/default.aspx
asp.net wysiwyg editor: http://cutesoft.net/ASP.NET+WYSIWYG+Editor/default.aspx
asp wysiwyg html editor: http://cutesoft.net/ASP
asp.net Image Gallery: http://cutesoft.net/ASP.NET+Image+Gallery/default.aspx
Live Support: http://cutesoft.net/live-support/default.aspx

01-05-2005, 7:04 PM 3289 in reply to 3277

Phil
Joined on 07-07-2004
Posts 36

Re: Editable area background color

Reply Quote

OK -- that works. I'm not enough of a .net programer to know if I can reach this programatically?

How about a Java script example????

01-05-2005, 8:04 PM 3290 in reply to 3289

Adam
Joined on 09-23-2003
Aurora, ON
Posts 18,678

Re: Editable area background color

Reply Quote

Yes, please wait a sec.

I will post a Javascript example.

01-05-2005, 8:26 PM 3291 in reply to 3290

Adam
Joined on 09-23-2003
Aurora, ON
Posts 18,678

Re: Editable area background color

Reply Quote

The following example shows how to change the bgackground color of the editor using the javascript.

01-05-2005, 8:30 PM 3292 in reply to 3291

Adam
Joined on 09-23-2003
Aurora, ON
Posts 18,678

Re: Editable area background color

Reply Quote

The source code of the above example:

<%@ Page Language="C#" %>
<%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %>
<script> 
function changeBG(color) { 
      var editor1=document.getElementById('<%=Editor1.ClientID%>'); 
      var editdoc = editor1.GetDocument(); 
      editdoc.body.style.backgroundColor=color;  
} 
</script> 
<body> 
    <form runat="server">			
        <CE:Editor id="Editor1" TemplateItemList="bold,italic,underline,InsertImage,InsertMedia" Width="400" Height="180" runat="server"></CE:Editor>
        <br>
       <table cellSpacing="0" cellPadding="3" border="1" style="WIDTH: 400px; BORDER-COLLAPSE: collapse">
          <tr>
            <td onclick="changeBG(&#39;yellow&#39;)" style="BACKGROUND-COLOR: yellow">yellow</td>
            <td onclick="changeBG(&#39;red&#39;)" style="BACKGROUND-COLOR: #ff0000">red</td>
       </tr>
       <tr>
           <td onclick="changeBG(&#39;green&#39;)" style="BACKGROUND-COLOR: #339966">green</td>
           <td onclick="changeBG(&#39;blue&#39;)" style="BACKGROUND-COLOR: #0000ff">blue</td>
       </tr>
   </tbody>
</table>

</form>

</body>
</html>

Hope it helps.

Keep me posted.

01-05-2005, 8:42 PM 3293 in reply to 3292

Phil
Joined on 07-07-2004
Posts 36

Re: Editable area background color

Reply Quote

Outstanding!!! Thanks a million.

06-09-2005, 7:16 PM 7418 in reply to 3293

Adam
Joined on 09-23-2003
Aurora, ON
Posts 18,678

Re: Editable area background color

Reply Quote

Phil,

just let your know in the version 4.0.0.7 the new Editor.EditorBodyStyle Property has been introduced. This style will be applied to the Editor body.

For example:

<CE:Editor id="Editor1" runat="server" EditorBodyStyle="background-color:tan;Color:white"></CE:Editor>

09-15-2008, 10:37 AM 43932 in reply to 3273

atconway
Joined on 07-31-2008
Posts 6

Re: Editable area background color

Reply Quote

The way that worked for me was to change the 'EditorBodyStyle' property like as follows:

EditorBodyStyle="font-family: Arial; background-color: red;"

I could not change the Template.aspx file because I have more than 1 editor in my application and they have different properties.