WWordPress4.4で気づいたのですが、挿入画像のリンクに「rel属性」が挿入されるようになっていました。
これによって、一部のLightbox(WP Lightbox 2等)で、Lightboxが動作しない等の不具合があるようです(筆者未確認)。
いつのバージョンからこうなったのかは不明ですが、これは困りますよね。
WordPress4.4の管理画面からメディアを追加して、出力されるHTMLは下記のような感じです。
<a href="(画像のURL)" rel="attachment wp-att-(メディアのID)"><img class="alignnone size-thumbnail wp-image-(メディアのID)" src="(画像のURL)" alt="(altのテキスト)" /></a>
このHTMLを「W3C Markup Validation Service」でチェックすると、下記のようなエラーになります。
エラー: Bad value “attachment wp-att-(メディアのID)” for attribute “rel” on element “a”: The string “wp-att-(メディアのID)” is not a registered keyword.
これはまだ良いのですが、PDFなどのメディアにリンクをつけると下記のようなHTMLが出力されます。
<a href="(PDF等のメディアURL)"rel="">ここにテキストが入ります</a>
「rel属性」が前のダブルコーテーション(quote)にくっついてます (^^; 当然このHTMLを「W3C Markup Validation Service」でチェックすると、下記のようなエラーになります。
エラー: No space between attributes.
これをFIXさせるには、WordPressのコアファイルをいじれば直りますが、新しいバージョンにアップするとまた直ってしまうので、簡単なプラグインを作ってみました。ちなみに、このプラグインでは「rel属性」を削除してしまっていますが、rel属性を残したい方は、お好みの応じてコードを変更してください(rel属性を残したい方向けに、コメント等を使って冗長なコードの書き方をしています)。
<?php
/*
Plugin Name: FIX-get_image_send_to_editor
Description: FIX-get_image_send_to_editor
Version: 0.0.1
Author: Sitespiral
Author URI: https://www.sitespiral.jp
License: GPL2
*/
// Activation
FIX_get_image_send_to_editor::activation();
/**
* Core Class
*
*/
class FIX_get_image_send_to_editor {
/**
* activation
*
* @return void
*/
public static function activation() {
// add_filter('image_send_to_editor'
add_filter('image_send_to_editor', array(__CLASS__, 'get_image_send_to_editor'), 10, 8);
// add_filter('media_send_to_editor'
add_filter('media_send_to_editor', array(__CLASS__, 'fix_media_send_to_editor'), 10, 3);
}
/**
* FIX: get_image_send_to_editor
*
* @see /wp-admin/includes/media.php (get_image_send_to_editor) from WorPress 4.4.2-ja
* @return void
*/
public static function get_image_send_to_editor($html, $id, $caption, $title, $align, $url, $size, $alt ) {
$html = get_image_tag($id, $alt, '', $align, $size);
$rel = '';
//if ( ! $rel ) {
// $rel = ' rel="attachment wp-att-' . esc_attr( $id ) . '"';
//} else {
// $rel = ' rel="' . esc_attr( $rel ) . '"';
//}
if ( $url )
$html = '<a href="' . esc_attr($url) . "\"$rel>$html</a>";
return $html;
}
/**
* fix_media_send_to_editor
*
* @since WorPress 4.4.2-ja
* @return void
*/
public static function fix_media_send_to_editor($html, $id, $attachment) {
$html = str_replace('"rel=', '" rel=', $html);
$html = str_replace('\'rel=', '\' rel=', $html);
$html = preg_replace('@rel="[^"]*"@', '', $html);
$html = preg_replace("@rel='[^']*'@", '', $html);
return $html;
}
}
?>
もちろん、同じようなことをfunctions.phpで行っても良いのですが、複数のWEBを管理されている方には、プラグインの方が便利かなと思い作ってみました。また、今後、新しいWordPressでこれらが直る可能性もありますので、その際は、このプラグインを無効にして削除すれば楽かなと…
※docの書き方がちょっと違うような笑
あまり検証していないので、上記の内容をご採用の際は、全て自己責任のもとでお願い致します。