1. National Aeronautics and Space Administration www.nasa.gov TablePress Evaluation & Section 508 Accessible Tables with Visual Editor WP Workshop, 3/19/2014 Joe Banks joseph.h.banks@nasa.gov 1

2. National Aeronautics and Space Administration www.nasa.gov 2 WP Workshop TablePress & Tables TablePress –A WordPress plugin that enables you to create, manage and display tables on your WordPress site. No HTML knowledge is needed, as a comfortable interface allows to easily edit table data. –Tables can contain any type of data, even formulas that will be evaluated. An additional JavaScript library can be used to add features like sorting, pagination, filtering, and more for site visitors. –You can include the tables into your posts, on your pages, or in text widgets. Tables can be imported and exported from/to CSV files (e.g., from Excel), HTML files, and JSON. –Overview: https://wordpress.org/plugins/tablepress/https://wordpress.org/plugins/tablepress/

3. National Aeronautics and Space Administration www.nasa.gov WP Workshop TablePress & Tables Status: In use as requested. Initial Use and Example OCIO Section 516 Requirements: sorting by table header and simple method of updating table data. Search within table. User uploads Excel spreadsheet as needed while logged into WP admin https://ocio.grc.nasa.gov/policies-guidance/section-516/agency- assessed-cleared-it-list/ https://ocio.grc.nasa.gov/policies-guidance/section-516/agency- assessed-cleared-it-list/ Recommendations Section 508 testing should be done for each table configured Each new TablePress extension be tested first before making them part of the “OCIO Supported Plugin” package. Supported Plugins: https://wordpress.grc.nasa.gov/728/https://wordpress.grc.nasa.gov/728/ 3

4. National Aeronautics and Space Administration www.nasa.gov WP Workshop TablePress & Tables Demo (Facilities Division) Example (Dev): https://cws.grc.nasa.gov/fd/building- information/building-managers/https://cws.grc.nasa.gov/fd/building- information/building-managers/ Table is saved as CSV from Excel Table can be grabbed from a server automatically (see Table Press extensions) Out of the Box Configuration & Settings Just Added: Just search one column https://datatables.net/usage/columns http://wordpress.org/support/topic/filtering-rows-of-a- table?replies=14 http://wordpress.org/support/topic/filtering-rows-of-a- table?replies=14 "aoColumnDefs": [ { "bSearchable": false, "aTargets": [ 1, 2, 3, 4 ] } ] Careful: VERY PICKY ON SPACING Need additional research to get literal search on single digit. Brandon? 4

5. National Aeronautics and Space Administration www.nasa.gov WP Workshop TablePress & Tables Display Issues & Notes –Overall styling of TablePress tables: we may consider styling that more closely matches the NASA WP Theme. Styling of bottom arrows needs better visible style. Suggestions for global theme-usable CSS welcome. –Would like to use sidescrolling used by TablePress as standard responsive behavior for tables 5

6. National Aeronautics and Space Administration www.nasa.gov WP Workshop TablePress & Tables Documentation Overview/Start: WP Repository Documentation https://wordpress.org/plugins/tablepress/ More Features: WP Developer Plugin Documentation: http://tablepress.org/ http://tablepress.org/ Extensions (TablePress Plugins) http://tablepress.org/extensions/http://tablepress.org/extensions/ How it Works: Integrates DataTables, a plug-in for the jQuery Javascript library. For serious developers: DataTables jQuery Plugin: http://www.datatables.net/ http://www.datatables.net/ 6

7. National Aeronautics and Space Administration www.nasa.gov Section 508 Tables Simple data tables can be created using any HTML tool, such as Dreamweaver, then pasting HTML in to Text Editor. Dreamweaver makes it easy to clean up poorly formatted code from MS Office. But you can paste table data from Excel or Word into Visual Editor “Paste from Word” –Note: No tables for layout ever again! Use column classes instead. https://wp-dev.grc.nasa.gov/space/page-elements/column-classes/ Section 508 Table Guidelines: –http://webaim.org/techniques/tables/datahttp://webaim.org/techniques/tables/data –Key Elements to Define TH scope 7

8. National Aeronautics and Space Administration www.nasa.gov Section 508 Tables Joe Banks is wrapping up a short training document on how to paste a table from Excel or Word, using only the WordPress Visual Editor. –Best for pasting smaller tables –Larger tables updated often from a source file stored locally on your computer, consider TablePress use. 8