【解決】TablePressで作った表の並べ替え・検索等が機能しない時の対処法【Cocoon】

本記事はCocoonテーマを利用している人向けです。

TablePressの「DataTables JavaScriptライブラリ機能」にあたる検索や並べ替えなどがうまく動かない問題を解消したので備忘録を残します。

結論書いちゃうと

って感じでした！画像付きで説明するので参考にしてください。

目次（もくじ）

発生したエラー

発生したエラーは、表やデータは表示されるが検索や並び替え・横スクロールが機能しないというもの。

わざわざ表プラグインを使うのは「並べ替えや検索をしたかったから」

これでは本末転倒。

ちなみに正常に表示される場合はこのようになる↓

TablePressの設定をいじってもうんともすんともだったのでとりあえずCocoonのフォーラムで同じ現象で困っている人がいないか、解決策がないか検索…

しようと思ったんですけどその前に答え見つけました！

そう、フォーラムの注意書き２「高速化を無効に」です。

プラグインの問題はCocoonの高速化機能を解除することで解決する場合があるので、早速設定をいじってみるとあっという間に解決！

私の場合はこの手順↓で解決しました。

Cocoon設定→高速化→JavaScript縮小化設定のチェックを外す→保存

ここから画像付きでさらに細かく説明していきます。

まずはCocoon設定内の高速化の画面に移動。

おそらく「JavaScriptを縮小化する」にチェックが入っているので、これを外します。

この状態で保存。

TablePressを使っているページを更新してみると…

ほいきた！件数、検索枠、並び替えが表示されました！

JavaScriptを縮小化しなければTablePressの機能を使えることがわかりました。

ここからもうワンポイント！

せっかくある機能「JavaScriptを縮小化」を完全に無効化するのはもったいないので、

私はプラグイン単体（TablePressのみ）除外する方法にしました。

「JavaScriptを縮小化する」のチェックを入れる。

TablePressのみJavaScriptを縮小化したくないので、除外するためにファイルパス「/plugins/tablepress/」を入力。

設定を保存しテーブルのプレビューを確認。

検索、並べ替えボタンなど全て表示されたらOK！

素敵なブログライフを〜！