views:

326

answers:

1

Hi

I am currently having problems with attempting to style the HTML rich text editor in our MOSS 2007 site definition.

I have specified a corporate logo inline on a custom master page in the body tag as follows:

<%@Master language="C#"%>
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Import Namespace="Microsoft.SharePoint.ApplicationPages" %>
<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="wssuc" TagName="Welcome" src="~/_controltemplates/Welcome.ascx" %>
<%@ Register TagPrefix="wssuc" TagName="DesignModeConsole" src="~/_controltemplates/DesignModeConsole.ascx" %>
<HTML id="HTML1" dir="<%$Resources:wss,multipages_direction_dir_value%>" runat="server" xmlns:o="urn:schemas-microsoft-com:office:office">
<HEAD id="HEAD1" runat="server">
    <META Name="GENERATOR" Content="Microsoft SharePoint">
    <META Name="progid" Content="SharePoint.WebPartPage.Document">
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
    <META HTTP-EQUIV="Expires" content="0">
    <SharePoint:RobotsMetaTag ID="RobotsMetaTag1" runat="server"/>
    <Title ID=onetidTitle><asp:ContentPlaceHolder id=PlaceHolderPageTitle runat="server"/></Title>
    <SharePoint:CssLink ID="CssLink1" runat="server"/>
    <SharePoint:Theme ID="Theme1" runat="server"/>
    <SharePoint:ScriptLink ID="ScriptLink1" language="javascript" name="core.js" Defer="true" runat="server" />
    <SharePoint:CustomJSUrl ID="CustomJSUrl1" runat="server" />
    <SharePoint:SoapDiscoveryLink ID="SoapDiscoveryLink1" runat="server" />
    <asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server"/>
    <SharePoint:DelegateControl ID="DelegateControl1" runat="server" ControlId="AdditionalPageHead" AllowMultipleControls="true"/>

    <style>
body
{
    background-image:url(/_layouts/images/corp/corpLogo.gif);
    background-repeat:no-repeat;
}
</style>
</HEAD>

...

When deployed as a feature, this master page works fine for all of our standard out of the box pages and sites - the logo appears in the top left hand corner (and the code also applies a colour scheme using a separately-defined style sheet).

However, when we try to modify a piece of content using a CEWP, the rich text editor also displays this logo in the top left corner, partially obscuring the text the user needs to edit (see screenshot at http://tr.im/Rcci).

I have tried to amend the style in the master page to hide this logo but cannot find a way to do this. I have also looked into amending the

C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033\htmleditor.js

and the actual rich text editor itself at

C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\RTE2PUEditor.aspx

but this has not led to any success (and I would really rather not do this anyway!!).

Can someone point me in the right direction?

I would like a custom branding (logo, css etc.) applying to all pages, but not to the pop up rich text editor. Is this possible? If so, how?

Thanks for reading.

Andrew

+2  A: 

The RTE2_GenerateLaunchArguments method in HtmlEditor.js copys all of the stylesheets and styles on the page:

var styleRules=new Array();
var styleRulesUrl=new Array();
for (var i=0; i<document.styleSheets.length; i++)
{
    var styleSheet_href=document.styleSheets[i].href;
    if (styleSheet_href !="")
    {
        styleRulesUrl[styleRulesUrl.length]=styleSheet_href;
    }
    else
    {
        var rules=document.styleSheets[i].rules;
        for (var j=0; j<rules.length; j++)
        {
            styleRules[styleRules.length]=rules[j];
        }
    }
}

These values are then passed and applied to the modal dialog RTE2PUEditor.aspx. It looks like the quickest work around is to use the form instead of the body tag:

form#aspnetForm
{
    background-image:url(/_layouts/images/corp/corpLogo.gif);
    background-repeat:no-repeat;
}

The ID of the form on RTE2PUEditor.aspx is RTE2PUEditorForm, while most of the other pages (especially those using your master page) use aspnetForm.

That said, you might want to look into setting the site logo instead of using CSS. You can set the logo manually by going to Site Settings > Title, Description, and Icon > Logo URL and Description and changing the URL. Or you can set it through code using the SPWeb.SiteLogoUrl property. Note, this requires that the SiteLogoImage control is present on your custom master page.

Rich Bennema
Thank you for your prompt response Rich. I shall look at these options on my return to work and post back here. Andrew
Andrew Vevers
Rich - the form#aspnetForm{ background-image:url(/_layouts/images/corp/corpLogo.gif); background-repeat:no-repeat;}worked fine for me. Thanks very much for the quick response and helping me out here. Andrew
Andrew Vevers