TCDテーマにVOGUEというテーマがあります。多くのTCDテーマと同じようにテーマのTOPページにはコンテンツを設定できるようになっています。
このTOPページのコンテンツの中に、HTMLを直接書けるフリーエリアというのがあります。このフリーエリアにHTMLを書いて保存してもなぜかTOPに表示されない。
頭に来たので解析したらTCD VOGUEテーマのバグでした。
この記事では、TCD VOGUEテーマのバグの対処方法について記載しています。たぶんTCDのテーマの不具合はリアルタイムにアップデートがなされないのが通例なので、困っている人がいたら参考になるかもしれません。
TCD 51番目のテーマVOGUEとは
公式サイト:https://design-plus1.com/tcd-w/tcd051
臨場感あふれるビジュアルで企業のウェブサイトの魅力を最大化するWordPressテーマ「VOGUE」
何もかもが洗練 最先端の表現と技術に彩られた コーポレートサイトがあなたの手に
と、言う、TCDテーマの中で51番目にリリースされたテーマです。
50番目にリリースされた大ヒットテーマGENSENと時期が近いですね。
TCD VogueのTOPフリーエリアが表示されない
ことの発端は、TCDテーマがあまりにも無能(デモを作るための機能しかない)なので、TOPページのフリーエリアにHTMLタグを直接書いてカスタマイズしようと思ったのが始まりです。
フリーエリアに保存されたHTMLタグがどうやってもTOPページに表示されないので、テーマファイルを解析していくことにしました。
問題の箇所:フリーエリアのHTMLタグを出力
VOGUE: contents-builder.php (template-parts/contents-builder.php)の一番最後に以下の記述があります。
elseif ( 'wysiwyg' === $value['cb_content_select'] && $value['cb_wysiwyg_display'] ) :
$cb_wysiwyg_editor = apply_filters( 'the_content', $value['cb_wysiwyg_editor']);
if ( $cb_wysiwyg_editor ) {
echo '<div id="cb_' . esc_attr( $key ) . '">' . $cb_wysiwyg_editor . '</div>' . "\n";
}
endif;
なぜ出力されない?⇒フリーエリアの中身が空っぽ
$cb_wysiwyg_editor = apply_filters( ‘the_content’, $value[‘cb_wysiwyg_editor’]);の部分が出力する箇所なのですが、apply_filterすると空っぽになっていました。
- $value[‘cb_wysiwyg_editor’]⇒正常
- $cb_wysiwyg_editor⇒空
よって、犯人は、apply_filterと特定
しかし、記述が間違っているわけではないので、この時点では対処方法はわかりませんでした。
TCD Vogue TOPフリーエリア表示 不具合対策の検討
the_contentで過去の事例を検索してみると
テーマのバグで同じように文字列が出力されない事例がありました。
I had the same problem. It turned out there was a function in my theme, that also filtered
the content
, but had a bug in it, causing the filter to return an empty string.So check your theme and plugins for functions that filter
the_content
. In Sublime Text 2 for example you can do a quick “find in files” with ⌘/CTRL + ⇧ + F to find possible culprits.
となると、テーマ側でthe_contentのフィルターをいじってる可能性を調べないといけません。
VOGUE TCDテーマでthe_content filter_hookをいじってるか確認
この記事を参考に、filter_hookされている内容を確認しましたが、出力が思ったより多くてよくわからず。
後述する原因から考えると、テーマが勝手に追加したfilterがあるのか確認すればよいのだと思いました。
あれば、それをremove_filterすればよいことになりそうですが、remove_filterは優先順位が分からないと有効にならないので、そういう意味ではテーマをgrepした方が早いかもしれません。
VOGUE TCDテーマでthe_content filter_hookをgrepしてみる
某秀丸のgrep機能を使ってthe_contentでgrepします。
functions.php(39): remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
page-full.php(24): the_content();
page-no-side.php(24): the_content();
page.php(26): the_content();
single-news.php(40): the_content();
single-plan-full.php(25): the_content();
single-plan.php(12): the_content();
single.php(50): the_content();
inc\password_form.php(105): $output .= '<div class="c-pw__desc">' . apply_filters( 'the_content', $options['pw_editor' . $pw_content] ) . '</div>';
pagebuilder\pagebuilder.php(1303): // get_the_content()用にHTML生成し各種グローバル変数を上書き
pagebuilder\pagebuilder.php(1310): * フロント用 the_contentフィルター
pagebuilder\pagebuilder.php(1312): function page_builder_filter_the_content($content) {
pagebuilder\pagebuilder.php(1322): // wpautopを外してthe_contentの最後に戻す
pagebuilder\pagebuilder.php(1323): if (has_filter('the_content', 'wpautop')) {
pagebuilder\pagebuilder.php(1324): remove_filter('the_content', 'wpautop');
pagebuilder\pagebuilder.php(1325): add_filter('the_content', 'page_builder_filter_the_content_after', 999);
pagebuilder\pagebuilder.php(1333): function page_builder_filter_the_content_after($content) {
pagebuilder\pagebuilder.php(1334): if (!has_filter('the_content', 'wpautop')) {
pagebuilder\pagebuilder.php(1335): add_filter('the_content', 'wpautop');
pagebuilder\pagebuilder.php(1337): remove_filter('the_content', 'page_builder_filter_the_content_after', 999);
pagebuilder\pagebuilder.php(1340): add_filter('the_content', 'page_builder_filter_the_content', 8);
pagebuilder\modules\editor.php(72): remove_filter('the_content', 'page_builder_filter_the_content', 8);
pagebuilder\modules\editor.php(74): echo apply_filters('the_content', $values['content']);
pagebuilder\modules\editor.php(77): add_filter('the_content', 'page_builder_filter_the_content', 8);
pagebuilder\modules\slider.php(402): remove_filter('the_content', 'page_builder_filter_the_content', 8);
pagebuilder\modules\slider.php(418): echo apply_filters('the_content', $repeater_values['caption']);
pagebuilder\modules\slider.php(426): add_filter('the_content', 'page_builder_filter_the_content', 8);
pagebuilder\modules\tab.php(1004): $is_remove_filter_the_content = false;
pagebuilder\modules\tab.php(1155): if (!$is_remove_filter_the_content) {
pagebuilder\modules\tab.php(1156): remove_filter('the_content', 'page_builder_filter_the_content', 8);
pagebuilder\modules\tab.php(1157): $is_remove_filter_the_content = true;
pagebuilder\modules\tab.php(1159): echo apply_filters('the_content', $repeater_values['content']);
pagebuilder\modules\tab.php(1173): if ($is_remove_filter_the_content) {
pagebuilder\modules\tab.php(1174): add_filter('the_content', 'page_builder_filter_the_content', 8);
template-parts\contents-builder.php(122): $cb_wysiwyg_editor = apply_filters( 'the_content', $value['cb_wysiwyg_editor'] );
add_filterしたりremove_filterしている箇所が何か所かありました。
add_filter(‘the_content’, ‘page_builder_filter_the_content’, 8);
↑の記述がadd_filterした後にremove_filterされずに終わっている可能性がありそうな気がします。
おそらくremove_filterを直前でしてやれば直る!⇒気がするだけ。
TCD VOGUE TOPフリースペース不具合修正方法
ダメ元で、apply_filterの直前でremove_filterを追加します。
追加したら、あっさり直りました。
VOGUE: contents-builder.php (template-parts/contents-builder.php)の一番最後に以下の記述があります。
elseif ( 'wysiwyg' === $value['cb_content_select'] && $value['cb_wysiwyg_display'] ) :
remove_filter('the_content', 'page_builder_filter_the_content', 8); //追加します
$cb_wysiwyg_editor = apply_filters( 'the_content', $value['cb_wysiwyg_editor']);
if ( $cb_wysiwyg_editor ) {
echo '<div id="cb_' . esc_attr( $key ) . '">' . $cb_wysiwyg_editor . '</div>' . "\n";
}
endif;
まとめ
TCD VOGUE テーマのTOP フリーエリア表示不具合の原因究明の過程と不具合対策についてまとめました。
今回の不具合は、たまにしか使わない重箱の隅の機能じゃないので、リリース前のテストをしていれば普通にわかる不具合です。こんな不具合も見つからないというのは、TCDテーマの品質管理が破綻していることが分かる事例となりました。
TCDテーマの全てが悪いとは思いませんが、同じようなテーマをチョイ変してテーマの種類を量産するビジネスモデルなので、今ではテーマが80種類近くに増えています。当然、初期のテーマはメンテナンスもされていませんので、80近いテーマを管理しているとは思いませんが、かなりいい加減なテーマも混ざっていると思います。
TCDテーマは日本人から見ると綺麗なデモに騙されて、こんな綺麗なサイトが作れるならと、買う人が多いですが、TCDのテーマはデモに命かけていますのであれ以上のサイトは作れません。購入してもデモとの違いにげんなりする人が多いと思います。
どうせげんなりするなら、海外の全部入りテーマの方が品質は高いので、是非海外テーマをおススメします。