開発

画像挿入時にリンク先が画像の時のみデータ属性値を付加する方法【WordPress】

作成日： 2019年5月15日

WordPressの投稿画面で画像を挿入する際、リンクをLightboxで開くように設定したいと思います。

処理内容

「添付ファイルの表示設定」で指定するリンク先が画像ファイルの場合に限りaタグにdata-type="lightbox"を付加する。

コード

[php]function output_image_send_to_editor( $html, $id, $caption, $title, $align, $url, $size, $alt ) {
$image_mime = [ '.jpg', '.jpeg', '.gif', '.png' ];
str_replace( $image_mime, $image_mime, $url, $count );
if ( 0 !== $count ) {
$html = str_replace( '">＜img', '" data-type="lightbox">＜img', $html );
}
return $html;
};
add_filter( 'image_send_to_editor', 'output_image_send_to_editor', 10, 8 );[/php]

解説

image_send_to_editorで画像挿入時に処理するフィルターを追加します。
リンク先の変数$urlの拡張子を調べて、画像か判断します（これでリンク先が「添付ファイルのページ」や「カスタムURL」でも対応可能です）。[mx_card style="card_style:1" title="ポイント"]調べたいキーワードの配列を作成して、str_replaceで置換回数をカウントすることで、複数パターンの文字列の検索が簡単に出来ます。[/mx_link]
画像だった場合、出力される変数$html<code>に対してstr_replaceで末尾にdata-type="lightbox"を付加します。