ワードプレスで記事作成中にアフィリエイトショートコードタグ（div）を入れるとタグ内が消える

Question

お世話になります。
ワードプレスで記事を作成中、記事中に

<div vc_mylinkbox_id="885868715"></div> というようなアフィリエイトのショートコードを挿入すると 中身が消えてしまいます。

しかし不思議な事に消えてしまっている記事もあれば、残ってしっかりとリンクが表示されているものもあります。

関係あるかわかりませんが、公開後の記事をプレビューすると真っ白で、通常のページをみると正常に表示される、という現象がありました。

これについては毎回というわけでもありませんし、ページ自体は表示されているのでそこまで気にしていませんでした。

https://20s-femininity.net/beauty/skin_care/78941
こちらが消えているページで
https://20s-femininity.net/beauty/cosme_make/82813
こちらが正常なページです。

ググってそれっぽい記事を見つけてfunction.phpに追記しました。

add_filter( 'wp_kses_allowed_html', 'customKsesAllowedHtml', 10, 2 );

function customKsesAllowedHtml( $tags, $context ) {
    if ( $context == 'post' ) {
        $tags['script'] = true;
        $tags['button'] = array(
            'data-hoge-hoge'=>true,
            'data-piyo-piyo'=>true,
            'class'=>true
        );
        $tags['div'] = array(
            'data-hoge-hoge'=>true,
            'data-piyo-piyo'=>true,
            'class'=>true,
            'id'=>true
        );
    }
    return $tags;
}
コード

これによれば、「kses」というものが関係していて、タグ入力を許可してあげるコードのようなのですが、他のdivタグ内は消えません。この商品リンクのタグ内の文字だけが消えるのです。

要点をかいつまんで説明しますと、
・上記の特定のdivタグ内の文字が消える（空白のdivタグのみ存在）
・消えるページと消えないページがある

という事です。

ご存知の方いらっしゃいましたら、よろしくお願いいたします。

Answer 1

TinyMCE Advancedのようなプラグインを入れていないでしょうか？
勝手に空タグを消す機能で消えていると思われます。

つまり、下記2．までであれば消えておらず3．直後で消えているのだと思います。

1. ソース編集に切り替え
2. アフィリエイトタグを入れて保存
3. 次にビジュアルエディターで記事を編集して保存

ショートコードを下記のようにしてみてはいかがでしょうか？

// function.php

/**
 * アフィリエイト用タグ出力
 *
 * ◎ショートコード
 * [affiliate 属性名='アフィリエイトID']
 * [affiliate 'アフィリエイトID']
 * 
 * @param  array  $args  array('アフィリエイトID') or array('vc_mylinkbox_id' => 'アフィリエイトID')
 * @return string  アフィリエイト用HTML文字列
 */
add_shortcode('affiliate', function ($args = [])
{
    if (empty($args)) {
        return '';
    }

    $keys = array_keys($args);

    // 引数にアフィリエイト属性名（連想配列キー）がない場合「'vc_mylinkbox_id'」を補完
    $attr = is_numeric($keys[0]) ? 'vc_mylinkbox_id' : $keys[0];

    // アフィリエイトID
    $id = array_shift($args);

    return '<div '. $attr .'="'. $id .'"></div>';
});

実際に埋め込む場合は下記のようにします。タグではなくなるので勝手に消されることもありません。

# div.属性名
[affiliate 属性名=ID]

# div.vc_mylinkbox_id 固定の場合
[affiliate 885868715]

Comments

[t-maekawa]

ご回答ありがとうございます＾＾
上記のコードをfunction.phpに追記して、
テキストエディタにショートコードを入力する際に
番号を
[ ]で囲んで記載する、という事でいいんでしょうか？
試してみます。

[Tomak]

はい、ショートコードのタグを初期設定から変更していなければ、[〇〇〇〇] ← これがショートコードの書き方です。

サンプルソースでは、下記の書き方は同じで、どちらでも同じHTMLが出力されます。

[affiliate 885868715]
[affiliate vc_mylinkbox_id=885868715]

[t-maekawa]

ありがとうございます＾＾

Warning: array_keys() expects parameter 1 to be array, string given in /home/c7099541/public_html/20s-femininity.net/wp-content/themes/luxech/functions.php on line 86

というエラーメッセージがでました。

[t-maekawa]

86行目には

$keys = array_keys($args[0]);

がありました。

[Tomak]

すみません、function.php のショートコード関数のソースが間違っていました。

array_keys($args[0]) → array_keys($args)

[t-maekawa]

ありがとうございます＾＾
記載しなおしましたが

Warning: Illegal string offset 'vc_mylinkbox_id' in /home/c7099541/public_html/20s-femininity.net/wp-content/themes/luxech/functions.php on line 86

というメッセージが表示されます。

[t-maekawa]

phpファイルの余白を消したので行がずれていますけど、

return '<div '. $attr .'="'. $args[0][$attr] .'"></div>';

が86行目です。

ひょっとして86行目の[0]を消すのでしょうか？

[t-maekawa]

[0]を消しましたらページのエラーメッセージは消えましたが、
肝心の商品リンクが表示されません。
元に戻った感じです。
テキストエディタではそのまま
[affiliate 885871622]
が残っています。

[t-maekawa]

お手数をおかけして申し訳ありません。

[Tomak]

すみません、先ほどの修正が全て修正しきれておらず、少々コードを追加いたしました。
コピペで function.php の該当関数のすべのコードを書き換えて頂きたいです。
ご迷惑をおかけしました。

[t-maekawa]

ありがとうございます＾＾
正常に表示されました！
助かりました！
ありがとうございます＾＾

[Tomak]

こちらこそお役に立てたようで良かったです。