Custom <table> styles

[Göran Tänzer]

Hi
I have troubles to get a proper HTML table format preview in the RadEditor table wizard. I reference a custom CSS file containing a single HTML table format, overwriting the ".ms-rteTable-1" format defined in "/_layouts/1033/styles/HtmlEditorTableFormats.css". The SharePoint OOTB Table wizard reads the overwritten CSS classes and gives a customized preview but the RadEditor does only show the default table themes (see screenshot)

The SharePoint OOTB CSS is referenced in the following ajax script rendered by the RadEditor (bottom of the page)

Sys.Application.add_init(function() {
   $create(Telerik.Web.UI.RadEditor,
...
...
"cssFiles":["/_wpresources/RadEditorSharePoint/5.7.2.0__1f131a624888eeed/Resources/CssEditor.css","/_layouts/1033/styles/HtmlEditorTableFormats.css","/_layouts/1037/styles/HtmlEditorCustomStyles.css"],
...
...
});

Is it possible to pass the url to the custom HTML table format CSS file to the RadEditor Table Wizard?

regards
göran

[Stanimir]

Hello Göran Tänzer,

If you want to customize the styles in the Css Class Layout drop down you need to use the TableLayoutCssFile property of RadEditor. Review the following online demo: http://demos.telerik.com/aspnet-ajax/editor/examples/tablelayoutcssfile/defaultcs.aspx.
Also check the following online help article: Set Properties Via Config File.

One other way of approaching the issue is by modifying the TableBorder.ascx editor's dialog. Review the following KB article: http://www.telerik.com/support/kb/aspnet-ajax/editor/sorting-radfileexplorer-items-by-name.aspx. There is explained how to use the ExternalDialogsPath property for modifying the built in editor's dialogs (ExternalDialogsPath property). 


All the best,
Stanimir
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Göran Tänzer]

Hi Stanimir

First of all another side note. I have to provide different Table Styles "dynamically" depending on our theme. We have currently 3 differnet web apps running which all have a unique color.

I tried your suggestions to my best knowledge but I failed.

1) TableLayoutCssFile
According to the SharePoint RadEditor documentation I have to use the "RadHtmlField" control but this control does not provide a TableLayoutCssFile property.

<telerik:RadHtmlField id="PublishingPageContentField" runat="server" FieldName="PublishingPageContent"></telerik:RadHtmlField>

I receive the following error message

Parser Error Message: Type 'Telerik.SharePoint.FieldEditor.RadHtmlField' does not have a public property named 'TableLayoutCssFile'.

2) ListConfig.xml:
I do not know the correct property name to provide a different table css file

<property name="TableLayoutCssFile ">
  <item>/_layouts/STYLES/HtmlEditorTableFormatsIntranet.css</item>
</property>

This property at least somehow modified the Ajax script and added a "tableLayoutsCssFile" part to the $create function and modified the table layout slightly but not as it should be.

$create(Telerik.Web.UI.RadEditor, ....
"tableLayoutCssFile":"/_layouts/STYLES/HtmlEditorTableFormatsIntranet.css", ...

3) EditorDialogs
Modifying the Dialogs looks rather complex and I do not wan't to modifiy the dialog, i just want to pass another CSS file to the RadEditor Ajax function. I need to "replace" a value of the "cssFiles" array of the $create function. e.g.: replace OOTB SP table CSS  "/_layouts/1033/styles/HtmlEditorTableFormats.css" with a custom CSS file "/_layouts/STYLES/HtmlEditorTableFormatsIntranet.css"


regards
göran

[Stanimir]

Hello Göran Tänzer,

What you can do is create multiple configuration files ConfigFile1.xml, ConfigFile2.xml, ConfigFile3.xml ... .
In each file you will have different setting. For example:

<property name="TableLayoutCssFile">/_wpresources/RadEditorSharePoint/5.x.x.x__1f131a624888eeed/Resources/TableLayoutCss1.css</property>

Then use the ConfigFile property of RadHtmlField. Review the following online help article: Setting ConfigFile and ToolsFile properties for the WCM field.


Greetings,
Stanimir
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Göran Tänzer]

Hi

thank you for you advise about the 3 separate config files. I think i will go for this but currently it's not even working properly with a single config file.

It's still passing the SP OOTB css file "/_layouts/1033/styles/HtmlEditorTableFormats.css" to the CssFiles collection and adds a TableLayoutCssFile property which has some effect and modifies the preview but not as it should, please have a look at the attached screenshot.

ajax code

Sys.Application.add_init(function() {
    $create(Telerik.Web.UI.RadEditor, {"_localization":{"addcustomcolor":"Add Custom Color...","addcustomhexcolor":"Add Hex Color...","addcustomwordsuccess":"successfully added to dictionary","addtodictionary":"Add to dictionary","askwordcleaning":"The content you are trying to paste has MS Word formatting.\r\nWould you like to clean it?","cancelbutton":"Cancel","canceltable":"Cancel","cellproperties":"Cell Properties","cellwarning":"Please, select a cell to set its properties!","changewordstring":"Change Manually","class":"CSS Class","clearclass":"Clear Class","clearallhtmltags":"All HTML Tags","clearcssformatting":"Cascading Style Sheets","clearfonttags":"Font Tags","clearformatting":"Clear Formatting","clearspantags":"Span Tags","clearstyle":"Clear Style","clearwordformatting":"Microsoft Word Formatting","correctspelling":"Spelling Changes","createlink":"Create Link","dialogtoolbar":"Dialogs","dropdowntoolbar":"Dropdowns","exceededhtmllength":"The added HTML code exceeded the character limit","exceededtextlength":"The added text exceeded the character limit","enhancededittoolbar":"Enhanced Edit","fileopen":"Open file..","filesaveas":"Save as...","formbutton":"Button","formcheckbox":"Checkbox","formform":"Form","formhidden":"Hidden","formpassword":"Password","formradio":"Radio button","formreset":"Reset","formselect":"Select","formsubmit":"Submit","formtext":"Textbox","formtextarea":"Textarea","htmlmode":"HTML Mode","ignoreallstring":"Ignore All","ignorestring":"Ignore","imagemapwarning":"Please, select an image to set its image map properties!","indenthtml":"Indent HTML","inserttoolbar":"Insert","maintoolbar":"Main Toolbar","morethanoncemessage":"This word occurs more than once in the text. Would you like to replace all instances?","movecommand":"Move","nospellingmistakes":"No mistakes found.","nosuggestions":"(no suggestions)","promptcolor":"Please, provide the custom color HEX value:","radeditordesignmode":"Design","radeditorhtmlmode":"HTML","radeditorpreviewmode":"Preview","reducetheconentlength":"Please, reduce the content of the field","resizecommand":"Resize Object","sethtml":"Set HTML","showtoolbartooltip":"Show toolbar","spellcheckcomplete":"Spellchecking complete!","spellcheckend":"Finish spellchecking","spellingchange":"Spelling Change","spellinginprogress":"Spell checking in progress...","spellingmode":"Spell checking mode. Misspelled words are highlighted in yellow.","table":"Table","tabletoolbar":"Table","tablewarning":"Please, select a table to set its properties!","toolbarcaption":"RadEditor Toolbar","toolnotsupportedbynetscape":"This tool is not supported by Mozilla/Netscape browsers.","typing":"Typing...","undodisabledmessage":"You cannot undo further while in spellcheck mode. Please finish spellchecking first.","updatebutton":"Update","usectrlc":"Please use Ctrl+C to Copy","usectrlv":"Please use Ctrl+V to Paste","usectrlx":"Please use Ctrl+X to Cut","aboutdialog":"About RadEditor","absoluteposition":"Set Absolute Position","ajaxspellcheck":"AJAX Spellchecker","applyclass":"Apply CSS Class","backcolor":"Background Color","bold":"Bold","converttolower":"Convert to lower case","converttoupper":"Convert to upper case","copy":"Copy","cut":"Cut","decreasesize":"Decrease Size","deletecell":"Delete Cell","deletecolumn":"Delete Column","deleterow":"Delete Row","deletetable":"Delete Table","documentmanager":"Document Manager","findandreplace":"Find And Replace","flashmanager":"Flash Manager","fontname":"Font Name","fontsize":"Size","forecolor":"Foreground Color","formatblock":"Paragraph Style","formatcodeblock":"Format Code Block","formatstripper":"Format Stripper","help":"Help","imageeditor":"Image Editor","imagemanager":"Image Manager","imagemapdialog":"Image Map Editor","increasesize":"Increase Size","indent":"Indent","insertanchor":"Insert Anchor","insertcolumnleft":"Insert Column to the Left","insertcolumnright":"Insert Column to the Right","insertcustomlink":"Custom Links","insertdate":"Insert Date","insertemaillink":"Insert Email Link","insertformbutton":"Insert Button","insertformcheckbox":"Insert Checkbox","insertformelement":"Insert Form Element","insertformform":"Insert Form","insertformhidden":"Insert Hidden","insertformpassword":"Insert Password","insertformradio":"Insert Radio","insertformreset":"Insert Reset","insertformselect":"Insert Select","insertformsubmit":"Insert Submit","insertformtext":"Insert Textbox","insertformtextarea":"Insert Textarea","insertgroupbox":"Insert Groupbox","inserthorizontalrule":"Horizontal Rule","insertorderedlist":"Numbered List","insertparagraph":"New Paragraph","insertrowabove":"Insert Row Above","insertrowbelow":"Insert Row Below","insertsnippet":"Insert Code Snippet","insertsymbol":"Insert Symbol","inserttable":"Insert Table","inserttime":"Insert Time","insertunorderedlist":"Bullet List","italic":"Italic","justifycenter":"Align Center","justifyfull":"Justify","justifyleft":"Align Left","justifynone":"Remove alignment","justifyright":"Align Right","linkmanager":"Hyperlink Manager","insertlink":"Insert Link","mediamanager":"Media Manager","mergecolumns":"Merge Cells Horizontally","mergerows":"Merge Cells Vertically","modulemanager":"Module Manager","outdent":"Outdent","pageproperties":"Page Properties","paste":"Paste","pasteashtml":"Paste As Html","pastehtml":"Paste Html","pastefromword":"Paste from Word","pastefromwordnofontsnosizes":"Paste from Word, strip font","pasteplaintext":"Paste Plain Text","pastestrip":"Paste Options","print":"Print","realfontsize":"Real font size","redo":"Redo","repeatlastcommand":"Repeat Last Command","selectall":"Select All","setcellproperties":"Cell Properties","setimageproperties":"Properties...","insertimage":"Insert Image","setlinkproperties":"Properties...","settableproperties":"Table Properties","silverlightmanager":"Silverlight Manager","spellcheck":"Spellchecker","splitcell":"Split Cell","splitcellhorizontal":"Split Cell Horizontally","strikethrough":"Strikethrough","stripall":"Strip All Formatting","stripcss":"Strip Css Formatting","stripfont":"Strip Font Elements","stripspan":"Strip Span Elements","stripword":"Strip Word Formatting","stylebuilder":"Style Builder","subscript":"Subscript","superscript":"SuperScript","tablewizard":"Table Wizard","templatemanager":"Template Manager","toggledocking":"Dock all Floating Toolbars/Modules","togglescreenmode":"Toggle Full Screen Mode","toggletableborder":"Show/Hide Border","trackchangesdialog":"Track Changes","underline":"Underline","undo":"Undo","unlink":"Remove Link","xhtmlvalidator":"XHTML Validator","zoom":"Zoom","blank":"New Window","media":"Media Pane","parent":"Parent Window","search":"Search Pane","self":"Same Window","top":"Browser Window","action":"Action","align":"Alignment","alt":"ToolTip","bgcolor":"Background","border":"Border Width","bordercolor":"Border color","cellpadding":"CellPadding","cellspacing":"CellSpacing","classname":"Classname","cols":"Columns","doctype":"Select Doctype","dominspectorremoveelement":"RemoveElement","expandvalidator":"Expand Report Pane","height":"Height","href":"URL","id":"Id","name":"Name","nodeinspectorinvalidvalue":"Invalid value. Please enter a number.","nodeinspectorselectedelement":"The selected element is ","nowrap":"Nowrap","radeditordominspector":"Tag Inspector","radeditorhtmlinspector":"Real-Time HTML View","radeditornodeinspector":"Properties Inspector","radeditorstatistics":"Statistics","radeditorxhtmlvalidator":"XHTML Validator","rows":"Rows","statisticscharacters":"Characters:","statisticswords":"Words:","target":"Target","title":"ToolTip","validatexhtml":"Validate XHTML","valign":"Vertical Alignment","value":"Value","width":"Width"},"ajaxSpellCheckScriptReference":"/WebResource.axd?d=NevrdVtcx6mjQD1-L8jD8Juua1QsJDiu19e8gy9u0n-53l2bRYvRuSQtUkOD1BbBNIKVmdyjbtLsxzX1ItcSzkVALVfLyyuoEw97lSy7p-yPp-2v5BdVZejC1utKy-HJ0&t=634194718430259417","clientStateFieldID":"ctl00_PlaceHolderMain_PublishingPageContentField_ctl00_RadHtmlField1_ClientState","contentAreaCssFile":"/WebResource.axd?d=NevrdVtcx6mjQD1-L8jD8Juua1QsJDiu19e8gy9u0n-53l2bRYvRuSQtUkOD1BbBoTV807tFjupg7uRlNP2bsOv5zTOb5ou1HXpaLms8NJ6IdxsUjfODXT6J0m2wUUKJ3Mbb0JiPoKE_eti5y-TH8A2&t=634194718430259417","contextMenusJSON":[{"tools":[{"name":"Cut","text":"Cut"},{"name":"Copy","text":"Copy"},{"name":"Paste","text":"Paste"},{"name":"PastePlainText","text":"Paste Plain Text"}]},{"tagName":"TABLE","tools":[{"name":"ToggleTableBorder","text":"Show/Hide Border"},{"name":"SetTableProperties","text":"Table Properties"},{"name":"DeleteTable","text":"Delete Table"}]},{"tagName":"TD","tools":[{"name":"InsertRowAbove","text":"Insert Row Above"},{"name":"InsertRowBelow","text":"Insert Row Below"},{"name":"DeleteRow","text":"Delete Row"},{"name":"InsertColumnLeft","text":"Insert Column to the Left"},{"name":"InsertColumnRight","text":"Insert Column to the Right"},{"name":"DeleteColumn","text":"Delete Column"},{"name":"MergeColumns","text":"Merge Cells Horizontally"},{"name":"MergeRows","text":"Merge Cells Vertically"},{"name":"SplitCell","text":"Split Cell"},{"name":"SplitCellHorizontal","text":"Split Cell Horizontally"},{"name":"DeleteCell","text":"Delete Cell"},{"name":"SetCellProperties","text":"Cell Properties"},{"name":"SetTableProperties","text":"Table Properties"}]},{"tagName":"IMG","tools":[{"name":"SetImageProperties","text":"Properties..."},{"name":"ImageMapDialog","text":"Image Map Editor"}]},{"tagName":"A","tools":[{"name":"SetLinkProperties","text":"Properties..."},{"name":"Unlink","text":"Remove Link"}]}],"cssClasses":[["","Clear Class"],["a.thickbox","ThickBox"],[".lead-color","Lead color"],[".lead-background-color","Lead background color"],[".lead-color-switched","Lead color switched"],[".grey-color","Grey color"],[".grey-background-color","Grey background color"],[".grey-color-switched","Grey color switched"],[".intranet-color","Intranet color"],[".intranet-background-color","Intranet background color"],[".intranet-color-switched","Intranet color switched"],[".teamnet-color","TeamNet color"],[".teamnet-background-color","TeamNet background color"],[".teamnet-color-switched","TeamNet color switched"],[".myunite-color","MyUnite color"],[".myunite-background-color","MyUnite background color"],[".myunite-color-switched","MyUnite color switched"]],"cssFiles":["/_wpresources/RadEditorSharePoint/5.7.2.0__1f131a624888eeed/Resources/CssEditor.css","/_layouts/1033/styles/HtmlEditorTableFormats.css","/_layouts/1033/styles/HtmlEditorCustomStyles.css"],"links":[{"name":"www.heidelbergcement.com","href":"http://www.heidelbergcement.com","childLinks":[]},{"name":"UNITE","href":"http://unite","childLinks":[{"name":"Group Functions","href":"","childLinks":[{"name":"Compliance","href":"http://unite/gc","childLinks":[]},{"name":"Corporate Finance","href":"http://unite/gf","childLinks":[]},{"name":"Internal Audit","href":"http://unite/gia","childLinks":[]},{"name":"Insurance & Corporate Risk Management","href":"http://unite/gicr","childLinks":[]},{"name":"Information Technology","href":"http://unite/git","childLinks":[]},{"name":"Legal","href":"http://unite/gl","childLinks":[]},{"name":"Purchasing","href":"http://unite/gp","childLinks":[]},{"name":"Communication & IR","href":"http://unite/gcomm","childLinks":[]},{"name":"Human Ressources","href":"http://unite/ghr","childLinks":[]},{"name":"Reporting, Controlling & Consolidation","href":"http://unite/grcc","childLinks":[]},{"name":"Shared Service Center","href":"http://unite/gssc","childLinks":[]},{"name":"Tax Management","href":"http://unite/gtax","childLinks":[]},{"name":"Strategy & Development","href":"http://unite/gsd","childLinks":[]},{"name":"Treasury","href":"http://unite/gt","childLinks":[]}]},{"name":"Area Functions","href":"","childLinks":[{"name":"Global Competence Center Materials","href":"http://unite/gccm","childLinks":[]},{"name":"Logistics","href":"http://unite/gtax","childLinks":[]},{"name":"Tax Management","href":"http://unite/glog","childLinks":[]},{"name":"Sales and Marketing","href":"http://unite/gsm","childLinks":[]},{"name":"HC Fuels","href":"http://unite/hcfuels","childLinks":[]},{"name":"HC Trading","href":"http://unite/hctrading","childLinks":[]},{"name":"Heidelberg Technology Center","href":"http://unite/ghtc","childLinks":[]}]},{"name":"Central Europe","href":"http://unite/ceca","childLinks":[{"name":"Bosnia-Herzegowina","href":"http://unite/ba","childLinks":[]},{"name":"Czech Republic","href":"http://unite/cz","childLinks":[]},{"name":"Germany","href":"http://unite/de","childLinks":[]},{"name":"Hungary","href":"http://unite/hu","childLinks":[]},{"name":"Kazakhstan","href":"http://unite/kz","childLinks":[]},{"name":"Poland","href":"http://unite/pl","childLinks":[]},{"name":"Romania","href":"http://unite/ro","childLinks":[]},{"name":"Russia","href":"http://unite/ru","childLinks":[]},{"name":"Ukraine","href":"http://unite/ua","childLinks":[]}]},{"name":"T.E.A.M","href":"http://unite/team","childLinks":[{"name":"Afrika","href":"http://unite/africa","childLinks":[]},{"name":"Benelux","href":"http://unite/benelux","childLinks":[]},{"name":"Northern Europe","href":"http://unite/ne","childLinks":[]},{"name":"UK","href":"http://unite/uk","childLinks":[]}]},{"name":"North America","href":"http://unite/nam","childLinks":[]},{"name":"Asia-Oceania","href":"http://unite/ao","childLinks":[{"name":"Australia","href":"http://unite/au","childLinks":[]}]}]},{"name":"TeamNet","href":"http://team","childLinks":[]},{"name":"Find","href":"http://find","childLinks":[]},{"name":"Archive","href":"http://archive","childLinks":[]}],"modulesJSON":[{"scriptFile":"","name":"RadEditorDomInspector"},{"scriptFile":"","name":"RadEditorNodeInspector"},{"scriptFile":"","name":"RadEditorStatistics","attributes":{"dockingzone":"Bottom"}}],"mozillaFlashOverlayImage":"/WebResource.axd?d=NevrdVtcx6mjQD1-L8jD8Juua1QsJDiu19e8gy9u0n-53l2bRYvRuSQtUkOD1BbBoTV807tFjupg7uRlNP2bsArIVs5a5lb3zEslETNQiRdMyVD3vGNsvgawFzuIDyuw0&t=634194718430259417","paragraphs":[["\u003cbody\u003e","Clear formatting"],["\u003cH2\u003e","\u003cH2\u003eHeading 2\u003c/H2\u003e"],["\u003cH3\u003e","\u003cH3\u003eHeading 3\u003c/H3\u003e"],["\u003cH4\u003e","\u003cH4\u003eHeading 4\u003c/H4\u003e"],["\u003cpre\u003e","\u003cpre\u003eFormatted\u003c/pre\u003e"]],"skin":"Default","spellCheckJSON":{"configuration":"Fn5cWVMCLkRbWwRLJGR7XSFwVDVlLwBLVQVlQnQHPBdQKHdbYWBaDldVLk5qXCtfEQl6e24TJgZbcQ9KJHdrXAhddXZuKA8IbAZ6RVsMCiRiAwBbYXNWNlJUD0B2aTNfCVVfRGQQGH1bBy5rEl9BVBdZWx9gLiJybAZlSG8qKC5XEG8EZGBkEn1+E3xvXxVcCVRIAW4od31gBBNIEFxVVBJyBnRtBC5zV1tAaG0pChNXE29DYllWFlB+E3x2aS9gCVRYXG53c2VsYQtLI3pvXhdZUD5jBTZSUmIBQXcMIBx4El0FYFhCA1ZScGxrZQl4JVV1A2N1EF1bcDJqF19NbBdcQzVuOA8Ne2B+RW0pPC94Hl1ybgVaBmlVC3xrWwFsEldYZ2ATJmFvcQx6F1x3XBdZUH94cgBJb29YZ1opMzZnK3NCVAdnNn56OXl0ZShMHQlYeFUCD0t2YgRYI2cMRhwEWHNicypgY1xqUGt2MzJsLHt6YXJ0DWFXLVVvWgkEHW9TAnoAOgRvbhR9JGZrABFwQwVtLi4OZFoBf28BdXFiEGdrUmAHAGlDE2RrABlFE1VUYVMpFEZvWDJbDANjABJjeRFSKTFAY1pIWGt1HnBsEFFLU2NrPGVULXlbdxl9EH5IfFN0MmpcfgxgDF9RRhJjeXZkFCpgeGBEWGt1HnBhAQR2Ulh0DGlDcQk=","url":"/_wpresources/RadEditorSharePoint/5.7.2.0__1f131a624888eeed/Resources/Telerik.Web.UI.SpellCheckHandler.ashx","language":"en-US"},"tableLayoutCssFile":"/_wpresources/RadEditorSharePoint/5.7.2.0__1f131a624888eeed/Resources/HcagHtmlEditorTableFormatsIntranet.css","toolAdapterType":"Telerik.Web.UI.Editor.DefaultToolAdapter","toolJSON":[{"tag":"MossTools1","tools":[{"name":"AjaxSpellCheck"},{"name":"FindAndReplace","shortCut":"CTRL+F"},{"type":8},{"name":"Cut","shortCut":"CTRL+X"},{"name":"Copy","shortCut":"CTRL+C"},{"name":"Paste"},{"name":"PastePlainText","shortCut":"CTRL+V"},{"type":8},{"attributes":{"popupclassname":"reUndoRedo"},"name":"Undo","shortCut":"CTRL+Z","type":4},{"attributes":{"popupclassname":"reUndoRedo"},"name":"Redo","shortCut":"CTRL+Y","type":4},{"type":8},{"name":"MOSSLinkManager","shortCut":"CTRL+K"},{"name":"LinkManager"},{"name":"Unlink","shortCut":"CTRL+SHIFT+K"},{"type":8},{"name":"MOSSImageManager"},{"name":"ImageManager","shortCut":"CTRL+G"},{"name":"ImageMapDialog"},{"type":8},{"name":"DocumentManager"},{"name":"MOSSTemplateManager"},{"type":8},{"name":"FlashManager"},{"name":"MediaManager"},{"type":8}]},{"tag":"MossTools2","tools":[{"name":"Bold","shortCut":"CTRL+B"},{"name":"Italic","shortCut":"CTRL+I"},{"name":"Underline","shortCut":"CTRL+U"},{"name":"StrikeThrough"},{"type":8},{"name":"Superscript"},{"name":"Subscript"},{"name":"InsertParagraph"},{"type":8},{"name":"JustifyLeft"},{"name":"JustifyCenter"},{"name":"JustifyRight"},{"name":"JustifyFull"},{"name":"JustifyNone"},{"type":8},{"name":"InsertOrderedList"},{"name":"InsertUnorderedList"},{"type":8},{"name":"Indent"},{"name":"Outdent"},{"type":8},{"name":"InsertHorizontalRule"},{"attributes":{"itemsperrow":"8","sizetofit":"true","popupclassname":"reInsertSymbol"},"name":"InsertSymbol","type":4},{"type":8},{"attributes":{"sizetofit":"true"},"name":"FormatStripper","type":16,"tools":[{"name":"StripAll","text":"Strip All Formatting"},{"name":"StripCss","text":"Strip Css Formatting"},{"name":"StripFont","text":"Strip Font Elements"},{"name":"StripSpan","text":"Strip Span Elements"},{"name":"StripWord","text":"Strip Word Formatting"}]}]},{"tag":"MossTools3","tools":[{"attributes":{"popupclassname":"reApplyClass","clearclasstext":"Clear Class"},"name":"ApplyClass","type":2},{"name":"FormatBlock","type":2},{"attributes":{"popupclassname":"reCustomLinks"},"name":"InsertCustomLink","type":2},{"type":8},{"name":"MOSSInsertTable"},{"name":"SetTableProperties"},{"name":"ToggleTableBorder"},{"type":8},{"name":"MOSSInsertTableElement","type":16,"tools":[{"name":"InsertRowAbove","text":"Insert Row Above"},{"name":"InsertRowBelow","text":"Insert Row Below"},{"name":"InsertColumnLeft","text":"Insert Column to the Left"},{"name":"InsertColumnRight","text":"Insert Column to the Right"},{"name":"DeleteRow","text":"Delete Row"},{"name":"DeleteColumn","text":"Delete Column"},{"name":"SplitCell","text":"Split Cell"}]},{"name":"MergeColumns"},{"type":8},{"name":"AboutDialog"},{"name":"Help","shortCut":"F1"}]}],"toolbarMode":8,"toolsWidth":"610px"}, {"load":RadEditorClientLoad}, {"dialogOpener":"ctl00_PlaceHolderMain_PublishingPageContentField_ctl00_RadHtmlField1_dialogOpener"}, $get("ctl00_PlaceHolderMain_PublishingPageContentField_ctl00_RadHtmlField1"));
});

thanks
regars
göran

[Stanimir]

Hello Göran,

Unofrtunately I was not able to reproduce the problem. For your convenience I created a small video with my test. You can find it in the following URL http://screencast.com/t/MjI3YzExO.

In order to help you further. Please provide me with one of your ConfigFile.xml files and the corresponding table layout css file.

Kind regards,
Stanimir
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Göran Tänzer]

Hi
sorry for this really late reply but the last answer was to late for our internal release and this issue was not ranked that high on our priority list.

Unfortunately I'm still not able to get a proper preview of our custom layout within the RadEditor popup.
I watched your video and you did exactly the same steps I did with the same results but the video stopped at the most interesting point. You have not selected one of these custom layouts e.g. "purpletable" or "redtable" and you have not shown if this purple layout is really used in the preview window and in the RadEditor itself. This is exactly the problem I'm facing in our environment!

In addition our business found another error. When selecting a different locale for a web under "_layouts/regionalsetng.aspx" which is not installed on SharePoint farm the Table stylesheets are not referenced correctly. E.g.: the user selects en-GB which has a LCID of 2057 the HtmlEditorTableFormats.css is referenced from "/_layouts/2057/styles/" but the 2057 folder does not exist. SharePoint of course delivers different CSS and JS for english but only en-US with LCID 1033. Same applies to german, only de-DE (1031) is available and not de-AT (3079).

SharePoint renders always the CSS based on the language of the web itself and not based on the locale which is correct because the SiteTemplate is only available for the installed language packs.

SharePoint CSS refererence for site template in "en-US" but locale set to "en-GB":

<link rel="stylesheet" type="text/css" href="/_layouts/1033/styles/HtmlEditorCustomStyles.css?rev=8SKxtNx33FmoDhbbfB27UA%3D%3D"/>
<link rel="stylesheet" type="text/css" href="/_layouts/1033/styles/HtmlEditorTableFormats.css?rev=guYGdUBUxQit03E2jhSdvA%3D%3D"/>

RadEditor CSS references for site template in "en-US" but locale set to "en-GB":

"cssFiles":["/_wpresources/RadEditorSharePoint/5.7.2.0__1f131a624888eeed/Resources/CssEditor.css","/_layouts/2057/styles/HtmlEditorTableFormats.css","/_layouts/2057/styles/HtmlEditorCustomStyles.css"],

Becuase the css cannot be found under the reference path the RadEdtior does not render a table style selection at all. Please see attached screenshots.

regards
göran

[Stanimir]

Hi Göran,

I created the test screen cast again. You can find it in the following location http://screencast.com/t/j8UBwkcRQGk. What you should know is that if you set the TableLayoutCssFile property

<property name="TableLayoutCssFile">/_wpresources/RadEditorSharePoint/5.8.4.0__1f131a624888eeed/Resources/TableLayoutCss1.css</property>

you need to make sure that the file is loaded in presentation mode as well (it is not automatically added by RadEditor for MOSS). For example you can add the following link in the master page:

<link href="/_wpresources/RadEditorSharePoint/5.8.4.0__1f131a624888eeed/Resources/TableLayoutCss1.css" type="text/css" rel="stylesheet"/>

(In your case 5.8.4 is 5.7.2)

Regarding the selecting a different locale problem, at this point the only workaround that I can provide you with is setting the cssFiles collection as it is explained in the following article: Defining custom CSS styles. If you need to have different cssFiles collections set in different pages, you can create different ToolsFile.xml files. In order to do this follow the approach described in the following online help article: Different configuration files for different webs


Best wishes,
Stanimir
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Göran Tänzer]

Hi Stanimir,
Thank you for the updated video and your feedback. I was finally able to bring the correct layout into the table wizards table preview.
We had a perfect layout all the time in the live and edit mode but never in the table wizard. The table layout was done by an external agency and we just implemented this layout. Because many CSS in the table layout is redunant the designer combined several css classes into some generic
e.g.: instead of applying the same color to all four header columns (first, last, odd, even) they just made a single CSS entry ".tr.ms-rteTableHeaderRow-1 th" to apply the color to all columns. This works perfect in a regular HTML page but in case of the table wizard it seems that the classes must explicitly implement all the styles. I have changed this and now we have a perfect preview in the wizard, the edit area and in published mode.

The workaround for the locale issue (en-GB) by adding the required files manually to the toolfile.xml via the "cssFiles" node works also. Nevertheless I think this rendering the CSS files based on the locale of the web is a bug and should be addressed within the next version.The CSS should only be based on the installed language packs and therefore the language of the selected site template and not the selected locale in the regional settings.

Thank you again!
regards
göran

[Stanimir]

Hello Göran Tänzer,

I logged the locale issue (en-GB) in our bug tracking system, so our developers will work on fixing it. How ever at this point I can not confirm in which of the next releases the fix will be implemented.

Regards,
Stanimir
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.