+1-888-365-2779
Try Now
More in this section

Forums / Designing & Styling / Custom css layout style inside Rad Editor table properties

Custom css layout style inside Rad Editor table properties

5 posts, 0 answered
  1. Aaron
    Aaron avatar
    2 posts
    Registered:
    05 Mar 2013
    07 May 2013
    Link to this post
    Hello,

    In Table Wizard: Table Properties: CSS Class Layout , there is a drop down with pre-defined styles. Is it possible to create your own custom styles that apply to tables, and how is this done?

    Thank you,
    Aaron
  2. Jen Peleva
    Jen Peleva avatar
    568 posts
    Registered:
    10 Sep 2016
    10 May 2013
    Link to this post
    Hello Aaron,

     You can implement custom Table Layouts by creating a CSS file using the following pattern and point this file to the RadEditor's TableLayoutCssFile property:

    /*Table class*/
    .myClass {}
      
    /*Table Header classes*/
    .myClassTable tr.myClassTableHeaderRow {}
    .myClassTable td.myClassTableHeaderFirstCol {}
    .myClassTable td.myClassTableHeaderLastCol {}
    .myClassTable td.myClassTableHeaderOddCol {}
    .myClassTable td.myClassTableHeaderEvenCol {}
      
    /*Table Body classes*/
    .myClassTable tr.myClassTableOddRow {}
    .myClassTable tr.myClassTableEvenRow {}
    .myClassTable td.myClassTableFirstCol {}
    .myClassTable td.myClassTableLastCol {}
    .myClassTable td.myClassTableOddCol {}
    .myClassTable td.myClassTableEvenCol {}
      
    /*Table Footer classes*/
    .myClassTable tr.myClassTableFooterRow {}
    .myClassTable td.myClassTableFooterFirstCol {}
    .myClassTable td.myClassTableFooterLastCol {}
    .myClassTable td.myClassTableFooterOddCol {}
    .myClassTable td.myClassTableFooterEvenCol {}

    Please take a look at the following live demo for more detailed information on the subject:
    Table Properties CSS Class Layout tool 

    Greetings,
    Jen Peleva
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. David
    David avatar
    13 posts
    Registered:
    23 Jun 2010
    04 Mar 2014
    Link to this post
    That's all nice when I use the editor in a custom control (I then can edit the code of the editor). But is it possible to add a custom Table Layout in the editor that Sitefinity uses when editing content?
  4. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    06 Mar 2014
    Link to this post
    Hello David,

    You can achieve this by mapping the control template for the HTML field control (which contains the RadEditor). You can find more information in this forum post: ViewMap SDK template examples.

    The host type of the HTML field control is: Telerik.Sitefinity.Web.UI.Fields.HtmlField.

    Regards,
    Radoslav Georgiev
    Telerik
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
  5. yan
    yan avatar
    1 posts
    Registered:
    10 Jun 2015
    10 Jun 2015
    Link to this post

    More about......CSS Styling Tables

    Mercal

5 posts, 0 answered