0

我是网页设计新手,正在创建一个基于 WordPress 平台的体育网站。

该网站将涵盖的一项运动是板球。我的网站快完成了,但我被一些非常重要的 CSS/Html 数据表困住了。如果这里有人可以指导/帮助我如何创建类似于下面链接中的表格,或者是否有人可以从现有站点复制 html/css 并对其进行样式设置,我将不胜感激。

我只需要表格的副本,不需要排序选项

尽可能轻的类似记分卡会很棒

在 Wordpress 中使用 CSS/html 是否可以实现这些事情,或者这些表格是否有更好的选择?

4

1 回答 1

0

以下是您可以使用的两种解决方案:

解决方案 #1: TabPress 插件

通过图形面板,您可以完全自定义您的表格。你可以设置你自己的 CSS,你可以有 colspan、rowspan 或所有在一起。查看演示。如果您不想在编码上花费太多时间,请尝试一下。

解决方案#2: WP_List_Table

它从 WordPress 3.1 开始可用。WP 3.1 使用它来构建您可以在管理面板中看到的表格。例如,显示帖子的表使用此类。但是,您可以禁用某些功能,例如排序、批量操作等。

这是取自我的一个博客的示例代码。我想显示一个没有排序选项的统计表。调用ff_show_stats()以显示您的 PHP 代码中的表格。

if( ! class_exists( 'WP_List_Table' ) ) {
    require_once( ABSPATH . 'wp-admin/includes/class-wp-list-table.php' );
}

class FFStatsTable extends WP_List_Table {
    function __construct(){

    }

    function get_columns(){
        $columns = array(
            'id' => 'ID',
            'creation' => 'Creation',
            'country' => 'Country'
            // Add as much column as you want
            // 'column_name_in_query' => 'Displayed column name' 
        );
        return $columns;
    }

    function column_default( $item, $column_name ) {
        switch( $column_name ) { 
        case 'id':
        case 'creation':
        case 'country':
            return $item[ $column_name ];
        default:
            return print_r( $item, true ) ; //Show the whole array for debugging purposes
        }
    }

    function prepare_items() {
        global $wpdb;

        $columns = $this->get_columns();
        $hidden = array();
        $sortable = array();//Empty array for disabling sorting
        $this->_column_headers = array($columns, $hidden, $sortable);

        $this->items = $wpdb->get_results(
            "SELECT id,creation,country FROM wp_my_table WHERE my_condtion=TRUE",
            ARRAY_A 
        );
    }    
}

function ff_show_stats() {
    $myListTable = new FFStatsTable();

    echo '<div class="wrap"><h2>Stats</h2>'; 
    $myListTable->prepare_items(); 
    $myListTable->display(); 
    echo '</div>'; 
}

您可以在这里获得更详细的示例代码:http: //plugins.svn.wordpress.org/custom-list-table-example/tags/1.2/list-table-example.php

于 2013-02-14T00:06:07.980 回答