ユーザープロフィール画面の「プロフィール情報」でHTMLを使えるようにする方法

公開日:2024(令和6)年11月13日/最終更新日:

WordPressのカスタマイズ方法についての画像

【景品表示法に基づく表記】ページ内のコンテンツには、商品プロモーションが含まれています



WordPressのプロフィール画面にある「プロフィール情報」に入力した内容が作者ブロックで表示できるのはご存じかと思います。

あいうえお

このプロフィール情報には、不正なコードの入力ができないよう、WordPress標準で更新時にサニタイズ(不正コードの削除)が行われるようになっています。

でもリンクや一部文字色の変更などHTMLを使いたいケースが結構ありますね。

そこで本ページではより安全に「プロフィール情報」欄でHTMLを許可するためのコードを紹介します。

本ページで掲載しているコードは、以下に了承した上で使用ください

  • コードは商用・非商用問わず自由に使っていただいて構いませんが、コード追加による不具合やトラブルが発生しても当方では一切責任を負いません
  • コードは有効化しているテーマのfunctions.php、style.cssなどへ追加することで機能します。それらのファイルへの変更を行うことに不安のある方は使用しないでください
  • コードは本ページの公開日時点で私の環境において動作したものです。WordPressバージョン他環境の違いによって動作しないことがあります
  • コードは、セキュリティ、コードの正確さなどにおいて完全なものではありません。中には紹介するコードを簡略化するために省略している部分があるものもありますので、ご自身でコードを十分に検証し、必要な部分の編集を行った上で使用するようにしてください
  • 掲載しているのは参考コードです。自身の環境に合わせるための編集はご自身で対応いただく必要があります(コメント欄等から質問いただいても基本回答は致しません)
  • 掲載しているコードの転載を禁じます(SNSで紹介いただいたり、本ページへのリンクを張っていただくことは大歓迎です)

「プロフィール情報」でHTMLを許可するためのコード

まず、いろいろなサイトで紹介されているのが、有効化しているテーマのfunctions.phpへ以下のコードを追加するというものです。

remove_filter('pre_user_description', 'wp_filter_kses');

確かにこれでHTMLが使えるようにはなるのですが、この措置は「プロフィール情報」欄に入力する文字列のサニタイズ(不正な文字列が含まれた場合に削除する措置)を無効にしてしまうもので、いわばこの欄は無法地帯になってしまいます。

まあ、この欄の編集を行うのはサイトにログインし、プロフィール画面を開いてというのが前提になるため、ログインされなければ危険性はほとんどありませんのでこの方法でもいいとは思うのですが、会員制プラグインを使用しているサイトではよく検証をしないと、不正なコード(特にスクリプト)などを挿入されてしまうかも知れません。

そこで考えたのが以下のコードです。

このコードでは、一旦無法地帯にした後、改めて投稿や固定ページの編集画面上で許可されるHTMLタグと属性を許可するというものです。

/*** プロフィールの詳細でHTMLを許可 ***/
/* 投稿で使用できるHTMLタグのみを許可 */
function pwcn_manage_user_description_allow_html() {
// 管理画面、かつ、現在のユーザーがプロフィール編集できる権限を有するかどうかを確認
	if (is_admin() && current_user_can( 'edit_user')) {
		// pre_user_description のksesフィルターを無効化
		remove_filter('pre_user_description', 'wp_filter_kses');
		//改めてwp_kses_postでフィルターを構成
		add_filter('pre_user_description','wp_kses_post');
	}
}
add_action('init', 'pwcn_manage_user_description_allow_html');

これであればスクリプトタグは確実に削除されるので、比較的安全に運営できると思います。



Lolipop ServerMoshimo Ad x-serverMoshimo Ad

WordPressのカスタマイズ方法についての画像
プラグインなしで自動キーワードリンク機能を実装する方法