WordPress 自定义主题中的 Bootstrap 3 响应式表格代码替换

Posted 2023-03-06

【中文标题】WordPress 自定义主题中的 Bootstrap 3 响应式表格代码替换

【英文标题】：Bootstrap 3 responsive table code replacement in Wordpress custom theme

【发布时间】：2016-08-23 08:14:22

【问题描述】：

我正在使用 bootstrap 和 wordpress 集成。

在 bootstrap 集成之前，已有带有 <table> 的帖子。

为了确保 Bootstrap 的组件，我想添加包装器和类来替换所有现有帖子中的现有表格标签：

<table>...</table>

到

<div class="table-responsive">
    <table class="table table-condensed table-bordered">...</table>
</div>

在我的自定义主题的functions.php 中，我是否可以实现一个函数或过滤器来全局执行此代码注入？

【参考方案1】：

一个可以在functions.php中使用的快速过滤器，不确定它是否是最好的方法，但可以解决问题：

    function wp_bootstrap_responsive_table( $content )   
        $content = str_replace( ['<table>', '</table>'], ['<div class="table-responsive"><table class="table table-bordered table-hover">', '</table></div>'], $content );

        return $content;  
      
    add_filter( 'the_content', 'wp_bootstrap_responsive_table' );

【讨论】：

这不起作用，最终会破坏内容。 WordPress 会去掉开头的<div class="table-responsive">，但留下结尾的</div>，破坏设计布局。