This is a migrated thread and some comments may be shown as answers.

RAD Editor doesnt show styles

17 Answers 146 Views
WebParts for SharePoint
This is a migrated thread and some comments may be shown as answers.
Prasad
Top achievements
Rank 1
Prasad asked on 11 Apr 2008, 07:17 PM
Hi,

I am using RAD Editor in MOSS 2007. I have a masterpage at site collection level and have all subsites using that. I have style sheets defined in master page and all the content pages automatically formatted.

Issue: When I open a page in edit mode RAD editor is being shown up. However Entire text is displayed in Black and Times New Roman font. No style or nothing gets applied.

I am using 4.3.2.0 version of RAD editor.

However if i remove these styles from the master page then editor works fine....

17 Answers, 1 is accepted

Sort by
0
George
Telerik team
answered on 14 Apr 2008, 02:29 PM
Hi Prasad,

Please, review the following help article that describes how to define the editor's CSS styles:
Defining custom CSS styles


I hope this helps.

Sincerely,
George
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Prasad
Top achievements
Rank 1
answered on 15 Apr 2008, 11:35 PM
No it didnt helped... Please understand my issue. I dont want to define custom styles... I have a page with styles which is displaying nicely. now if i click edit then page opens in edit mode and RAD Editor appears... however editor doesnt show any styles and appears in black times new roman font.

Editor should display the page with same styles as that of actual one... Default sharepoint editor works fine....
0
George
Telerik team
answered on 16 Apr 2008, 02:52 PM
Hi Prasad,

Note that, in RadEditor for MOSS the  editor's CssFiles property is set by default. Therefore, the editor loads only the styles set by the CssFiles property.

Unfortunately, the only way to achieve the desired behavior is to get the styles from the Master page, isolate them in your CustomFile.css and add the CustomFile.css to the editor's CSS files using the CssFiles property.

For more information how to set the editor's properties via Config File please review the following help article:
http://www.telerik.com/help/radeditormoss/SetPropertiesViaConfigFile.html


Here is an example that shows how to set the CssFiles property to point to a CustomFile.css:
<property name="CssFiles">
        <item>/_wpresources/RadEditorSharePoint/CustomCssFile.css</item>
</property>


Sincerely,
George
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Prasad
Top achievements
Rank 1
answered on 16 Apr 2008, 06:19 PM
Hi George,

Thanks for the reply.. I did all these things but no success. I have added following property to ConfigFile.xml but no success...
0
George
Telerik team
answered on 17 Apr 2008, 04:41 PM
Hi Prasad,

Could you please clarify which Config file you have modified?

  • In Web Part and WCM scenario you need to modify the ConfigFile.xml.
  • In SharePoint forms scenario (Lists, Wikis, Blogs, etc.) you need to modify the ListConfigFile.xml located in the same folder.
The Config files are located in the following folder: /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/4.5.0.0__1f131a624888eeed/RadControls/Editor/


In addition, please try to clean your Browser's Cache or open the page with other browser.


If you still experience the problem, please send us your CustomCSSFile.css along with the ConfigFile.xml/ListConfigFile.xml (this depends on your scenario).


Best regards,
George
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Prasad
Top achievements
Rank 1
answered on 17 Apr 2008, 08:52 PM
Thanks George. It worked. But i still have another issue... I am using Images in my style sheets and they are not appearing in the editor.. here is what my style sheet reads...

ul

li{padding-left:10px; line-height:1.4em; background: url('pc_arrow.gif') left 4px no-repeat}

0
Prasad
Top achievements
Rank 1
answered on 18 Apr 2008, 06:44 PM
Hi George,

Any updates on this?

Prasad
0
Rumen
Telerik team
answered on 19 Apr 2008, 01:52 PM
Hi Prasad,

Open the _wpresources/RadEditorSharePoint/CustomCssFile.css file and set the LI class with important attributes after each selector:

li
{
    padding-left:10px !important;
    line-height:1.4em
!important;
    background: url('pc_arrow.gif') left 4px no-repeat
!important;
}

Save the file, delete your browser cache and restart your browser to see the change. Test on another PC if needed.

Kind regards,
Rumen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Prasad
Top achievements
Rank 1
answered on 19 Apr 2008, 05:41 PM

Hi,

Its not working.. Following is what i have entered and cleared browser cache...

Also tell me how the path should be entered... Physical OR virtual...

Do i need to consider path from Images folder of the site?


ul

li

{

padding-left:10px!important;

line-height:1.4em!important;

background: url('pc_arrow.gif') left 4px no-repeat!important

}

0
Prasad
Top achievements
Rank 1
answered on 19 Apr 2008, 05:41 PM

Hi,

Its not working.. Following is what i have entered and cleared browser cache...

Also tell me how the path should be entered... Physical OR virtual...

Do i need to consider path from Images folder of the site?


ul

li

{

padding-left:10px!important;

line-height:1.4em!important;

background: url('pc_arrow.gif') left 4px no-repeat!important

}

0
Prasad
Top achievements
Rank 1
answered on 22 Apr 2008, 05:13 PM
Any updates on this? I need to close this at earliest....
0
Rumen
Telerik team
answered on 23 Apr 2008, 12:39 PM
Hi Prasad,

You need to replace the background: url('pc_arrow.gif') left 4px no-repeat!important
with list-style-image: url("pc_arrow.gif") !important;

e.g.


ol, ul, li
{
    padding-left:50px !important;
    line-height:1.4em !important;
    list-style-image: url("pc_arrow.gif") !important;
}


and after that put the image file pc_arrow.gif in the same folder in which the CustomCssFile.css file resides.

If the
CustomCssFile.css file is located in the \Program Files\Common Files\Microsoft Shared\web server extensions\wpresources\RadEditorSharePoint, then copy the pc_arrow.gif in this folder too.

The CssFiles property in the ConfigFile / ListConfig file should point to the CustomCssFile.css:

  <property name="CssFiles">
    <item>/_wpresources/RadEditorSharePoint/CustomCssFile.css</item>
  </property>

Delete your browser cache and restart your browser after that to see the change.

Greetings,
Rumen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Prasad
Top achievements
Rank 1
answered on 23 Apr 2008, 06:32 PM
thanks this one worked. However I have another few issues...

1. I found that creating CustomCSSeditor.css file didnt solve my problem. I  
    have modified EditorContentArea.css file in default - skins and then this
    started working. Is this correct? and why its behaving like this...
2. Also not all styles are displayed in Firefox browser...
3. Another issue i am facing now is I am getting exactly same styles that are available in the style dropdown above in this editor... H1, H2, H3.. Direcotry list... Apart from this what I want is to see my custom styles.. I want to see bulletd list... and all other custom styles that we have...
I have already created CustomCSSeditor.css but still not able to see them in dropdowns....

Please help...
0
Prasad
Top achievements
Rank 1
answered on 23 Apr 2008, 08:19 PM
Hi

Just to update that I have resolved issue no 3 mentioned in earlier thread by adding styles to tools file...
0
Rumen
Telerik team
answered on 28 Apr 2008, 12:18 PM
Hi Prasad,

Up to the questions:
  1. Yes, it is OK to modify the EditorContentArea.css file. The classes placed in this file are directly applied to the editor's content area.
  2. Could you please, specify which classes are not displayed in Firefox? Is it possible to provide an example?

Kind regards,
Rumen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
0
Prasad
Top achievements
Rank 1
answered on 28 Apr 2008, 05:11 PM
Following are some of them. But its observed that most of the hyperlink ones are not working....

h2

a{color: #F0731E; font-size: 13px; font-weight:bold; text-decoration:none}

h1

a{color: #F0731E; font-size: 16px; font-weight:bold; text-decoration:none}

Following is the way it shows in firefox..

1. Color is shown as blue and not the one mentioned above.
2. If I select and apply style from dropdown then editor shows the color but underline remains blue.

0
Lini
Telerik team
answered on 09 May 2008, 12:42 PM
Hello,

If you do not see the styles in firefox, try making them important to be sure that they are not overridden from somewhere. For example:

h2 a{color: #F0731E !important; font-size: 13px; font-weight:bold; text-decoration:none !important;}

Sincerely yours,
Lini
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center
Tags
WebParts for SharePoint
Asked by
Prasad
Top achievements
Rank 1
Answers by
George
Telerik team
Prasad
Top achievements
Rank 1
Rumen
Telerik team
Lini
Telerik team
Share this question
or