Advanced Table Styles

The advanced table styles plugin automatically adds class names to table rows. This allows table styles to include alternating row colors and specific styling for the first or last row in the table.

Installation

You need to make a few simple changes to your configuration file to enable the table styles plugin:

• Load the plugin. Add <plugin url="path/to/tablestyles.xml" /> to the <plugins> element in your configuration file.
• Define the styles that the plugin should work with. Add a new <tableStyles> element with the styles you want to use the plugin with. For example:

  <tableStyles>
    <style name="cssStyleName" hasHeaderRow="true" hasTotalsRow="true" />
    <style name="noTotals" hasHeaderRow="true" hasTotalsRow="false" />
    <style name="customClasses" hasHeaderRow="true" hasTotalsRow="true" 
        evenRowClass="Even" oddRowClass="Odd"
        headerRowClass="Header" totalRowClass="Totals" />
  </tableStyles>
  

Finally, you need to define the way the table should look in your CSS file. See the sampleStyles.css file for an example of how to do this. Make sure that the class name in the CSS exactly matches the name attribute for the style element in your configuration file.

Usage

Authors simply select the style from the styles drop down as usual. The plugin works in the background to automatically keep the row classes up to date, even as the user adds and removes rows.

Dependencies

There are no dependencies.

Download

The Plugin APIs used by these plugins are only available to customers of the EditLive! Enterprise Edition.
Ephox Technical Support does not cover LiveWorks! plug-ins.
Please direct any support requests or general enquiries about any LiveWorks! code, integrations or plug-ins to the LiveWorks! mailing list. This code is released as-is with no support and no warranty and is installed at your own risk. We recommend thorough testing of any LiveWorks! project before deploying to any production system.