【问题标题】:Bootstrap data table styles not applied in wordpress?引导数据表样式不适用于wordpress?
【发布时间】:2021-03-27 01:37:36
【问题描述】:

我正在尝试在我用add_shortcode()“注入”的 wordpress 页面上使用 Bootstrap Datatables (https://datatables.net/manual/installation),但它看起来很糟糕: 前两行是日期选择器,但是条目选择框、搜索栏和底部的分页看起来不合适...... 我已经用

导入了样式表和脚本
wp_register_script( 'datatablejs', 'http://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js');
wp_register_style('datatables_styles', 'http://cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css');

wp_enqueue_script('datatables_styles');
wp_enqueue_script('datatablejs');

但我不知道如何修复样式以使其看起来“正常”... 我也在使用 bootstrap 4 样式,可能会干扰数据表样式?我在 wordpress 的 php 文件中创建了我的表...:

function renderTable() {
global $finishedData;

$table ="";
$table .= '<div class="container">
            <div class="row">
                <input id="start-date" > <input id="end-date">
                <div class="col-xs-12">
                <table id="pruefungentable"  class="table striped dark" style="width: 100%">
                    <thead class="thead-dark ">
                        <tr scope="row" class="table-danger">
                            <th>#</th>
                            <th>AID</th>
                            <!--<th>BID</th>-->
                            <th>OID</th>
                            <th>Mod</th>
                            <th>Datum</th>      
                        </tr>
                    </thead>
                    <tbody>';
                    $count = 0;
                    foreach($finishedData as $entry) {
                        $ID = ++$count;
                        $ID=$entry["ID"];
                        $BID=$entry["BID"];
                        $MOD=$entry["MOD"];
                        $Datum=$entry["Datum"]; 

                        $table .=   "<tr><td>" .  $ID . "</td>";
                        $table .=    "<td>" .  $AID . "</td>";
                        $table .= "<td>" . $BID . "</td>";
                        $table .= "<td>" . $MOD ."</td>";
                        $table .= "<td>". strftime("%d.%m.%Y",strtotime($Datum)) ."</td></tr>";
            
                    } 
$table .=           '</tbody>
                    </table>     
                </div>
            </div>
        </div>';

return $table;

}

【问题讨论】:

    标签: php css wordpress plugins datatables


    【解决方案1】:

    通过检查开发人员工具(检查)确保样式和JS文件实际加载并且控制台中没有错误并检查其他样式是否可能覆盖数据表样式,也尝试添加链接到使用这个插件的标题https://wordpress.org/plugins/insert-headers-and-footers/

    【讨论】:

      猜你喜欢
      • 2017-04-15
      • 1970-01-01
      • 1970-01-01
      • 2019-03-21
      • 2014-05-02
      • 2014-10-28
      • 2014-09-08
      • 2016-07-11
      • 1970-01-01
      相关资源
      最近更新 更多