【作者情報表示】VK Post Author Displayのカスタマイズ方法

作者情報表示プラグイン「VK Post Author Display」のカスタマイズ方法に関して、ご紹介をさせて頂きます。

基本的な使い方・ダウンロード方法は「作者情報を簡単に表示する便利なプラグイン【VK Post Author Display】」を参考にしてください。

スポンサーリンク

VK Post Author Displayのカスタマイズ

完成図

sns-link

上の画像のように各SNSやRSSへのリンク画像を表示させています。

やはり作者情報とまとめて表示したほうがユーザーにとってフレンドリーだと思い、このような表示方法を採用しました。

「絵動-kaiDo-」からオーダーを受けて、カスタマイズを行いました。
絵動-kaiDo-では複数人で管理を行っているので作者情報によって画像数が異なります。

では具体的にカスタマイズの方法を書いていきます。

デフォルトでは外部リンク・画像掲載が出来ない

VK Post Author DisplayはWordPressのプロフィールで掲載した情報を、表示してくれるプラグインになっています。

記事下に筆者情報を挿入することが出来る「VK Post Author Display」のご紹介。アバター表示の「Simple Local Avatars」も同時にご紹介。

詳しいVK Post Author Displayの表示方法などは当サイトの過去記事を参照ください。

「外部リンク」と「イメージ画像」を挿入する実験

vk-post-author-display-customize-01

プロフィール情報に入力したものが、反映される仕組みになっています。

vk-post-author-display-customize-02

Twitterの「外部リンク」と「イメージ画像」を追加して更新をします。

vk-post-author-display-customize-03

なぜか、「外部リンク」と「イメージ画像」が消えています。

vk-post-author-display-customize-04

当然ですが、反映されていません。

どうやら、プロフィール情報では「外部リンク」と「イメージ画像」の利用が出来ないようになっているようです。

調べてみると、一部のHTMLを除き厳しく設定されていることがわかります。

具体的なカスタマイズ方法

結論から言えば、制限を緩和する処置を行うことになります。
外部リンク」と「イメージ画像」を使ってもいいことに再設定すればいいわけです。

おはようございます。小林です。最近のレゴ®ってすごいですね。 さて、WordPressのプロフィールにHTML書きたいときありますよね、特にリンクとか。 例えば、プロフィールを以下のようなHTMLにしたいとします。 もうすぐ4歳。

WordPressの「フィルターフック」を利用することで解決出来ます。
フィルターフックとは何かに関しては上記のリンク様で詳しく解説されています。

functions.phpに追記するコード

add_filter( 'wp_kses_allowed_html', 'my_wp_kses_allowed_html', 10, 2 );
function my_wp_kses_allowed_html( $tags, $context ) {
    if ( 'pre_user_description' === $context ) {
        $tags['a']['target'] = true;
        $tags['br']= true;
	$tags['img']['src'] = true;

    }
    return $tags;
}

凄く簡単に説明すると、プロフィール情報の場所で「a」「target」「br」「img」「src」の使用許可をするよ、って感じです。

vk-post-author-display-customize-02

では先ほどと同じようにプロフィールにTwitterの「外部リンク」と「イメージ画像」を追加して更新をしてみましょう。

vk-post-author-display-customize-02

更新を押しても「外部リンク」と「イメージ画像」が消えていません。

vk-post-author-display-customize-05

ちゃんと記事のページにも反映されています!

まとめ

VK Post Author Displayのカスタマイズ方法いかがだったでしょうか?

フックを使うと今回のケースだけではなく、様々なカスタマイズが捗ると思います。
積極的にWordPressサイトで利用をしてみてください!

子テーマでカスタマイズされている方は「functions.php」を今回はいじっているで下記の方法を取るとテーマが更新された際、対応が楽になります。

WordPressで子テーマを作成する際の注意点。WordPressをカスタマイズする時は、元のテーマに上書きせずに別途子テーマを作るって行うのがセオリーとなっていますが、functions.phpをカスタマイズする際は注意が必要です。その注意点とは・・・?

では、素晴らしいWordPressライフを!

この記事をお届けした
O3 WEBの最新ニュース情報を、
いいねしてチェックしよう!
スポンサーリンク

コメント

  1. 【絵動】WORKSに動画を2点追加しました【更新情報】 | 絵動 -kaiDo- より:

    […] 【作者情報表示】VK Post Author Displayのカスタマイズ方法 […]