TablePress

描述

TablePress允许您轻松创建和管理漂亮的表格。您可以使用简单的简码将表格嵌入帖子,页面或文本小部件中。表格数据可以在类似于电子表格的界面中编辑,因此不需要编码。表格可以包含任何类型的数据,甚至包括将被评估的公式。额外的JavaScript库为网站访问者添加了排序,分页,过滤等功能。可以将表格导入和导出到Excel,CSV,HTML和JSON文件。

下载地址

 演示地址

用户文档

How to Easily Create Tables in WordPress with TablePress

开发文档

本页旨在记录TablePress的功能,选项和高级用法,更具技术性,以适应开发人员和程序员的需求。

有关该插件的更多一般信息,请参阅插件信息页面。还有一个包含常见问题的页面,对插件用户也应该很有趣。

简码[table id = N /]显示隐藏

简码[table id=N /]用于在帖子,页面或文本小部件中显示表格。可以在编辑帖子或页面时使用编辑器工具栏中的“表格”按钮手动输入或自动输入。

简码可以有以下参数。所有参数都可以简单地通过添加到简码(以任意顺序),例如

[table id = 1 alternating_row_colors = false column_widths =“40px | 50px | 30px | 40px”/]

[table id = 1 alternating_row_colors = false column_widths =“40px | 50px | 30px | 40px”/]

如果添加了一个参数,它会从该表格的“编辑”屏幕中覆盖相应的表格选项

对于大多数使用情况,建议使用表格的“编辑”屏幕上的相应复选框来更改相关设置。

id(字符串)(必填)
要显示的表的ID(可在“所有表”或“编辑”屏幕上看到)。
column_widths(string)(可选)
具有列宽的字符串,用|-symbol(管道)分隔
示例:

column_widths = “40像素| 50像素| 30PX | 40像素”

column_widths = “40像素| 50像素| 30PX | 40像素”

要么

column_widths = “20%| 60%| 20%”

column_widths = “20%| 60%| 20%”

alternating_row_colors(boolean)(可选)
表格是否应该交替排列颜色(“斑马条纹”)(请参阅CSS类odd和even)
row_hover(boolean)(可选)
如果鼠标悬停在它们上面,表格行是否应以不同的背景色突出显示
table_head(boolean)(可选)
第一行是否会在<th>HTML标签中获取<thead>HTML标签
first_column_th(布尔值)(可选)
第一列是否会获得<th>HTML标签(在“编辑”屏幕上没有复选框)!
table_foot(boolean)(可选)
最后一行是否将<th>在<tfoot>HTML标记中使用HTML标记
print_name(布尔值)(可选)
桌子名称是否应印在桌子上方/下方
print_name_position(字符串)(可选)
打印表格名称的位置:可以是“上面”或“下面”
print_description(布尔值)(可选)
表格的说明是否应印在表格的上方/下方
print_description_position(字符串)(可选)
打印表格描述的位置:可以是“上方”或“下方”
use_datatables(布尔值)(可选)
DataTables JavaScript库(一个jQuery插件)是否应该与该表一起使用(只有在第一行获取<th>HTML标签时(或者通过表的“Edit”屏幕上的设置或Shortcode参数)才能工作)
datatables_sort,datatables_paginate,datatables_lengthchange,datatables_filter,datatables_info(布尔值)(可选)
是否应为该表激活DataTables JS库的相应功能(DataTables部分DataTables网站上的更多信息)
show_rows,hide_rows,show_columns,hide_columns(字符串)(可选)
这些参数可用于在每个简码的基础上覆盖后端的可见性设置。
例:

[table id = 2 hide_columns =“1,2,3”show_rows =“4,5,6”/]

[table id = 2 hide_columns =“1,2,3”show_rows =“4,5,6”/]

将隐藏前三列并显示第4,5和6行,而不管他们在后端具有的可见性设置。除了手动添加每行或列号,还有一个参数值“all”将影响所有行/列。如果需要,它们也可以同时使用:

hide_columns =“3,4,5”show_columns =“8,9”

hide_columns =“3,4,5”show_columns =“8,9”

cellspacing,cellpadding,border(integer)(可选)
对应于中的参数

<table cellspacing =“0”cellpadding =“0”border =“0”> <tr> <td> ... </ td> </ tr> </ table>

<table cellspacing =“0”cellpadding =“0”border =“0”> <tr> <td> … </ td> </ tr> </ table>

默认情况下,这些设置没有设置,因为使用CSS可以更好地影响设置。但在一些罕见的情况下,他们可能需要。

简码[table-info id = N /]显示隐藏

简码[table-info id=N field=”<field-name>”/]可用于在帖子,页面或文本小部件中显示表格元数据。

您可以使用简码以与表格相同的方式显示此数据

[table-info id = N field =“<field-name>”/]

[table-info id = N field =“<field-name>”/]

简码有三个参数:

id(字符串)(必填)
具有自定义数据字段的表的ID
字段(字符串)(必填)
元字段的名称(见下文)
格式
只有可能的价值:raw。只适用于默认字段last_modified,并将返回原始日期时间格式,而不是漂亮的字符串。

字段的可能值是:

名称
ID为ID的表的名称
描述
带ID 标识的表格的说明
上一次更改
ID为表的最后修改的时间ID,如果该format参数设置为raw,一时间字符串将被退回,否则,一个漂亮的字符串。该格式human可用于显示例如文字“6小时前”,格式值date,并time分别显示最后一次修改的只是日期或时间。
last_editor
最后修改ID为ID的表的作者

行动中三个简码的例子(即在一个帖子或附近的一个页面上):

[table-info id = 2 field =“[table-info id = 2 field =”name“/]最后在[table-info id = 2 field =”last_modified“format =”raw“/] last_editor“/]。

[table-info id = 2 field =“[table-info id = 2 field =”name“/]最后在[table-info id = 2 field =”last_modified“format =”raw“/] last_editor“/]。

会产生类似的东西

表格演示表最后在2017-01-30 15:20:21由TobiasBg修改。

表格演示表最后在2017-01-30 15:20:21由TobiasBg修改。

还有一个用于此简码的模板标签功能:

<?php tablepress_table_info ( 'id = 1&field = name'  );  ?>

<?php tablepress_table_info(’id = 1&field = name’); ?>

它的工作原理与下面介绍的模板标签功能一样,使用本节的参数。

模板标签功能显示隐藏

要在简码未涵盖的地方显示表格(例如在页面页脚或侧边栏中),您可以使用模板标记功能tablepress_print_table( $query );。它可以添加到你的主题的任何部分(PHP括号之间:<?php和?>)。
参数$query可以是URL中的查询字符串形式的字符串wp_list_pages(),也可以是其他WordPress功能类似的字符串,也可以是包含查询参数和值的数组。
如果您不想立即打印表格,但只需获取输出,使用tablepress_get_table( $query );方法与此相同。

可能的参数与简码相同。

$query作为字符串的示例:

<?php tablepress_print_table ( 'id = 1&use_datatables = true&print_name = false'  );  ?>

<?php tablepress_print_table(’id = 1&use_datatables = true&print_name = false’); ?>

$query作为数组的示例(推荐和更易于阅读):

<?php tablepress_print_table ( array ( 'id'  =>  '1' , 'use_datatables'  =>  true , 'print_name'  =>  false  ) );  ?>

<?php tablepress_print_table(array(’id’=>’1’,’use_datatables’=> true,’print_name’=> false)); ?>

Shortcode还有一个模板标签功能[table-info id=N field=”<field-name>” /]:

<?php tablepress_print_table_info ( “id = 1&field = name”  );  ?>

<?php tablepress_print_table_info(“id = 1&field = name”); ?>

要么

<?php tablepress_print_table_info ( array ( 'id'  =>  '1' , 'field'  =>  'name'  ) );  ?>

<?php tablepress_print_table_info(array(’id’=>’1’,’field’=>’name’)); ?>

它的工作原理与上面介绍的模板标签功能完全一样,使用[table-info]Shortcode 部分的参数。

表选项显示隐藏

每个表格都有单独的选项,只涉及该表格。他们可以在桌面的“编辑”屏幕上进行更改。所有这些都可能被Shortcode的相应参数覆盖(记住:如果一个选项被设置为Shortcode参数,则它优先于表的“编辑”屏幕上的相应选项。)

以下选项可用:

交替的行颜色
如果启用,每个奇数行将获得额外的CSS类odd,每个偶数行将获得该类even。(这些类通过默认的CSS应用了不同的背景颜色。有关如何在FAQ中更改这些颜色的示例。)
行突出显示
如果启用,则当前鼠标光标悬停的行的所有单元格的背景颜色将更改为突出显示该行。(有关如何更改FAQ中颜色的示例。)
表头行
如果激活此选项,则第一个显示行中的所有单元格将被HTML代码封装,<th>而<td>该行将放置在<thead>HTML标记中。这对于使用任何JS库函数都是必需的!
表脚行
如果激活此选项,则最后显示的行中的所有单元格将被HTML代码封装,<th>而<td>该行将放入<tfoot>HTML标记中。
表名称
如果启用,表格的名称将打印在<h2>具有CSS类 tablepress-table-name的HTML标签内的表格的上方/下方。该位置可以从“上方”或“下方”中选择。
表格说明
如果激活,表格的说明将打印在<span>具有CSS类 tablepress-table-description的HTML标签内的表格的上方/下方。该位置可以从“上方”或“下方”中选择。
使用JavaScript库
此选项仅在选中“表头行” 选项时才可用。如果启用,则可以启用DataTables JavaScript库的某些功能。有关更多信息,请参阅DataTables部分。

插件选项显示隐藏

该插件具有以下一般“插件选项”。它们影响不同领域的全球插件行为。

前端选项影响页面,文章或文本小部件中表格的输出和使用特性。

自定义CSS
如果您想更改表格样式,可以将这些附加命令输入到“自定义CSS”文本区域中。有关如何更改FAQ中某些样式方面的示例。
插件语言
使用此设置,您可以更改语言,TablePress将显示在其中,而WordPress的其余部分仍将保留原始语言。如果你想使用插件的特殊翻译,这是很有用的,因为它更完整或更易于理解。
管理员菜单项
使用此设置将菜单项“TablePress”(默认在菜单中间)移动到WordPress管理菜单中的另一个位置。

CSS选择器,样式显示隐藏

每个表都有一些CSS类和一个可用于样式的HTML ID。在“插件选项”屏幕上将样式命令添加到“自定义CSS”textarea。

常见问题页面上有最常见任务的示例。

CSS类附加到<element>,ID附加为。<element class=”class-name”>…</element><element id=”html-id”>…</element>

CSS类(将它们用作

.class  {  
/ *您的CSS * /  
}

.class {/ *您的CSS * /}

tablepress (<table>的类)
每桌都有这个班。
tablepress-id- <ID> (<table>的类)
每个表都有这个类(其ID为<ID>)。
row- <number> (<tr>的类)
每一行都得到这个。<number>是显示的行数,不管它是标题行还是数据行。计数总是从1开始。
column- <number> (每个<th>或<td>的类)
<number>是单元格所属列的编号。它将是每个<th>和<td>元素的一个类。
使用它来设计样式栏宽度!
例:

.tablepress  .column-2  {  
	width : 200px ;  
}

.tablepress .column-2 {width:200px; }

FAQ中有另一个例子。重要提示:如果您同时使用.column-X和.row-X选择器,则.row-X必须站在.column-X(因为它被赋予给它所<tr>包含的<td>)之前。

奇数和偶数 (每个<tr>的类)
如果启用了表格选项 “交替行颜色”(或简码参数),则每行将获得这些类中的一个,具体取决于它是奇数行还是偶数行。使用这些类实际设置交替背景颜色的样式。FAQ中有这样的例子
tablepress-table-name (<h2>的类别)
如果表格选项 “打印表格名称”已启用,表格的名称将打印在具有此类的<h2> HTML标签内的表格的上方或下方。
tablepress-table-description (<span>的类)
如果启用表格选项 “打印表格描述”,表格的说明将打印在具有此类的<span> HTML标签内的表格的上方或下方。

CSS / HTML ID(将它们用作

#html-id  {  
/ *您的CSS * /  
}

#html-id {/ *您的CSS * /}

tablepress- <ID> -no- <number> (<table>的ID)
每张桌子都有这样的ID。<ID>代表TablePress“所有表”列表中使用的ID。<number>是此页面上该表格的计数/发生次数。(例如,如果您在您的网站上显示两次相同的表格(使用相同的<ID>)两次(例如一次在帖子中,第二次在侧边栏中),第一个将不会-no-…,第二个会有<number> = 2.这意味着,这些HTML ID对于样式来说并不是非常可靠,因为它们可能会随着页面上同一张表的再次发生而改变,这些ID用于调用JavaScript库的调用(如果已激活对于这个表的发生)。

DataTables JavaScript库的功能显示隐藏

DataTables JavaScript库(一个jQuery插件)是TablePress的一个附加功能。它由Allan Jardine编写,并有自己的网站和文档

它可以添加诸如排序,分页(具有长度更改功能),滚动以及过滤/搜索到表格等功能。要启用这些功能,请在表格的“编辑”屏幕上勾选相应的复选框。

DataTables JS库的更多功能可以通过所谓的TablePress扩展添加到TablePress 。

您可以为每个表单独决定是否要为其使用DataTables库(请参阅表选项部分了解更多信息),并且可以单独选择所需的功能。
该库的JavaScript文件位于插件文件夹的子文件夹“js”中。它使用jQuery库(它包含在WordPress中,并将自动加载到您网站的每一页的头部)。

您可以将自定义命令或参数从DataTables文档添加到“自定义命令”文本字段中。您还可以在自定义插件中使用特定的插件钩子来添加自己的命令(有关示例,请参阅TablePress扩展)。

插件钩子,动作和过滤器显示隐藏

TablePress在其源代码中有大量的WordPress插件挂钩(操作和过滤器)。他们提供了简单且完善的方法来为插件添加新功能和增强功能,或者改变插件行为。更详细的解释可以在WordPress Codex中找到。

有一些关于如何在扩展页面上使用这些钩子的例子。

与修改插件的源文件相比,使用这些钩子的优势在于,升级插件后更改仍然可以工作,并且可以单独维护。

导入和导出格式显示隐藏

TablePress可以将表格导入和导出为以下格式:

CSV (字符分隔值)
每一行都在一个新行中,每列由一个字符(如“;”(分号),“,”(逗号)或“\ tab”(制表符))分隔。该插件将尝试自动确定使用的分隔字符。有关CSV格式的更多信息,请参阅维基百科文章
HTML (超文本标记语言)
该插件将导入HTML表格的第一次出现(附在<table></table>)中。它不会识别或导入其单元格中带有“colspan”或“rowspan”属性的表格!
JSON (JavaScript对象表示法)
TablePress可以从JSON中导入表,表示一个普通的二维数组字符串,其中每个字符串表示一个单元格的内容。它还可以导入其导出期间创建的自定义和更高级的JSON格式。有关JSON格式的更多信息,请参阅Wikipedia文章

源代码显示隐藏

插件的源代码可以在ZIP文件中免费获得,可以从WordPress Plugin Repository 的插件页面下载。它是开放源代码并在GNU通用公共许可证2(GNU GPL 2)下作为自由软件许可。

主要的发展发生在GitHub上Git仓库中

更新于 2018年12月4日

帮到你了吗?

相关文章