CSS selectors
Single Document Page
.dlp-single-wrap- This wraps the right and left columns when they are displayed.
.dlp-single-left- The left hand column containing the post content, when document details are displayed.
.dlp-single-right- The right hand column containing the document details, when document details are displayed.
Folders
.dlp-folders- The entire folders output container
.dlp-folder- An individual folder container
.dlp-folder-label- An individual folder label (e.g. category name) container
Tables
These selectors are for the current table frontend. If your site is still in legacy mode, the table uses the older DataTables markup and these class names do not apply.
The table
.ptp-dataview
The wrapper <div> around the entire table and its controls.
.ptp-dataview .data-table
The table itself.
Rows and cells
.ptp-dataview .table-header-row
The row of column headings.
.ptp-dataview .table-header-cell
A single column heading. A heading the reader can sort also carries .sortable, and every heading carries its column class, such as .col-title or .col-date.
.ptp-dataview .header-menu-trigger
The button in a column heading that opens the sort and filter menu.
.ptp-dataview .table-row
A content row, which also carries .odd or .even.
.ptp-dataview .table-cell
A single cell. Every cell carries its column class as well.
.ptp-dataview .cell-content
The content inside a cell.
Controls
.ptp-dataview .layout-header
The area above the table.
.ptp-dataview .search-input-wrapper
.ptp-dataview input.search-input
The search box and its input field.
.ptp-dataview .header-filters
The filters above the table.
.ptp-dataview .footer-controls
The area below the table.
.ptp-dataview .pagination-left
.ptp-dataview .pagination-center
.ptp-dataview .pagination-right
The three pagination areas below the table.
.ptp-dataview .document-count
The totals message, such as "Showing 1-10 of 28".
Legacy mode selectors
The selectors below apply to sites still running in legacy mode.
.posts-data-table- The main posts <table> element
.posts-data-table th- The table headings
.posts-data-table thead tr.posts-data-table tfoot tr- The table header and footer rows
.posts-data-table tbody tr- The table content rows
.posts-data-table tbody td- The table content cells
.posts-data-table tbody tr.even td- A cell within an "even" numbered row, e.g. 2nd, 4th, , 6th, etc
.posts-data-table tbody tr.odd td- A cell within an "odd" numbered row, e.g. 1st, 3rd, 5th, etc
.posts-data-table tbody tr.child- The responsive child rows (shown when clicking the + icon)
.posts-data-table tbody tr.child .dtr-details- The responsive child data (shown when clicking the + icon)
.posts-data-table tbody td.col-title- To target a cell within a column. The class name is always
col-followed by the column name, e.g.col-title,col-date,col-excerpt, etc. .posts-table-controls .posts-table-select-filters.posts-table-controls .posts-table-select-filters label.posts-table-controls .posts-table-select-filters select- The filter dropdowns above the table
.posts-table-controls .dataTables_length.posts-table-controls .dataTables_length select- The 'Show ... entries' dropdown above the table
.posts-table-controls .dataTables_filter.posts-table-controls .dataTables_filter input[type="search"]- The search box shown above the table
.posts-table-controls .dataTables_paginate.posts-table-controls .dataTables_paginate a.paginate_button- The pagination buttons below the table. You will need to add an !important declaration for this rule to override the styles in the DataTables library.
.posts-table-controls .dataTables_info- The post totals message (e.g. Showing 1 of 5 entries)
.posts-data-table .posts-table-reset.posts-data-table .posts-table-reset a- The reset link above the table.
-
.document-library-pro-button- The button element displayed when the table contains the
buttoncolumn.