joppot

コピペで絶対動く。説明を妥協しない

ソフトウェア

wordpress4.4の画像にsrcsetが埋め込まれるのを削除する

投稿日:2016年1月20日更新日:

Pocket

srcset_top_thumb

概要

みなさんこんにちはcandleです。今回はwordpress4.4で追加された、retinaやレスポンシブに対応した画像のsrcsetの削除の仕方を紹介します。

wordpressの画像はewwwなどを使っていると、内部で複数のサイズの画像を持ちます。
例えば、サムネイルなら小さい画像にしたりできます。

問題は、投稿に挿入したい際に、retinaでみたい場合に画素数が足りなかったり、モバイルで見る場合は画像が大きすぎて無駄だったりすることです。

そこで、wordpressは4.4からsrcsetというのを導入して、必要に応じたサイズの画像をロードするようになったのですが、私のようにs3にアップロードする人はこれの影響で、s3のアドレスではなく、サーバのアドレスが挿入されてしまい、画像が404になってしまいました。

このような感じです。

<img class="alignnone size-medium wp-image-825" src="https://joppot.s3.amazonaws.com/wp-content/uploads/2010/01/dd.jpg" sizes="(max-width: 630px) 100vw, 630px" srcset="http://joppot.info/wp-content/uploads/2010/01/dd.jpg 630w, http://joppot.info/wp-content/uploads/2010/01/dd.jpg 968w, http://joppot.info/wp-content/uploads/2010/01/dd.jpg 1023w" alt="dd" width="630" height="330" />

しばらくはこの機能をオフにしておきたいと思います。

参考
http://wordpress.stackexchange.com/questions/211375/how-do-i-disable-responsive-images-in-wp-4-4

srcsetを無効化する

wordpressのプロジェクトに移動します。

*追記)

テーマの中のfunctions.phpに記述する方法の方が最も良い方法です。
wp-content/themes/使用しているテーマ/functions.phpを開いて、一番最後に以下を記述します。

add_filter( 'wp_calculate_image_srcset_meta', '__return_null' );

add_filter_calc

保存すれば、srcsetが挿入されずに画像が表示されます。

==============ここまで追記

下の方法だとwrodpressをバージョンアップするたびに書き加えなくてはならないので、非推奨です。


wp-includes/media.phpをエディタで開きます。
function wp_calculate_image_srcset
を探します。
その次の行に以下を記述します。
add_filter( ‘wp_calculate_image_srcset_meta’, ‘__return_null’ );


まとめ

srcsetは多分便利なものだと思うので、うまく両立できるようにしたいですね。

スポンサードリンク

「為になったなぁ」と思ったら、シェアお願いします。

-ソフトウェア
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

MarathonoはMacのGUIで簡単にlinuxコマンドを実行するソフト

概要 みなさんこんはcandleです。今回はmarathonoというGUIツールの使い方です。 このソフトの目的は大まかに2つです。 1つは任意のLinuxサービスを実行すること 2つ目はファイルの変 …

Mac OS Mavericksのテキスト音声入力を試す

概要 どうもみなさんこんにちわcandleです。今回は文字やテキストをキーボードから打ち込むのではなく、マイクから入力する方法を試したいと思います。 条件 OSがMavericksであること 音声拡張 …

photoshopのブラシを反転させる方法

English 日本語 概要 みなさんこんにちはcandleです。今回はブラシを反転させる方法を紹介します。 前提 なし

centos6.5にemacs24.5をrpmからインストールする

概要 みなさんこんにちはcandleです。今回はcentos6.5にemacs24をrpmからインストールします。 前提 適当なcentos6.5の環境がある。私はvagrantにします。

Mac 標準terminal、iterm2のEmacsでpowerlineが文字化けするのを修正する

概要 みなさんこんにちはcandleです。 今回はemacsのpowerlineが文字化けしてしまうのを修正する方法を紹介します。 こちらのサイトを参考にさせていただいています。 https://gr …

  • English
  • 日本語

プロフィール


ベンチャー企業のCTOをやってます。大学時代にプログラミングを始め、javaから入門し、C++へて、PHPへと進み、会社ではRailsを使用。自動化が大好きなプログラマー

スポンサードリンク

アーカイブ