WordPressのメディアライブラリが表示されない？

メディアライブラリにファイルが表示されない。

メディアの追加とアイキャッチ画像の設定ができない。

今回の現象。

WordPressの投稿画面から、メディアを追加しようとすると、メディアファイルが空欄になっていた。

つまり、メディアライブラリにファイルが表示されない。

アイキャッチ画像（サムネイル画像）の設定をしようとしても、おなじくメディアファイルが空欄になっており、画像を投稿画面へ挿入や設定ができない。

該当箇所のWordPressの設定やファイルなどは変えていなかったため、原因を見つけるのにかなりの時間を要してしまった。

WordPressでもFTPでも、バックアップファイルのダウンロードができないという症状も出ていたので、なおさら沼った。

メディアファイルの問題かと思いきや、文字コードが原因。

メディアライブラリに表示されない現象が起こるときの例。

メディアファイルではなく文字コードの問題。

結論としては、下記が原因だった。サーバーの自動アップデートやWordPressの自動アップグレードが影響したと思われる。

• サーバーの文字コードが「EUC-JP」のとき。
• WordPress投稿画面が、「クラシックエディタ」のとき。
• WordPressのテーマをデフォルトに変えても改善されないとき。

上記に当てはまる場合は、気をつけた方が良いかもしれない。

初心者向けの「ブロックエディタ（Gutenberg）」を使っていないひとほど、ハマってしまうという皮肉が起きる可能性がある。

（※functions.phpへブロックエディタ無効の記述している場合も同様。）
（※WordPressは現時点最新の6.6.1。それ以外のバージョンの場合は不明だが、セキュリティの観点から最新版にしておくように推奨されている。）

サーバーについて。

今回のサーバーは大手なので、利用者も多いはず。

ただし、Googleで検索するとサジェストで「サポート ひどい」という言葉が出てくるように、残念ながらサポートの役割は機能していない。

（※自分がサポートへ問い合わせるのは年に1度あるかないかの頻度。）

そんなものなのかなと、ためしに他に5つのサーバー会社で検索してみたところ、そのようなサジェストは表示されなかった。

思えば2022年、サーバー上で迷惑メールフィルターを設定しているのにもかかわらず、半日で約1,800通の迷惑メールが届いたことがあった。2023年にも別のメールアドレスへ同じことがあった。2023年は2度目だったので、おそらく数百通で止められたと思う。

（※その後「高性能迷惑メールフィルター」的なものが追加されていた。）

以前はむしろ良いイメージだったので、どこが良いかと聞かれたときはこのサーバーは必ず提案に入れていた。2009年から使用しているが、いまもうお勧めできない状態となっている。

メディアの追加とアイキャッチ画像の設定について。

wp-admin/admin-ajax.phpの可能性。

ネット上では下記の「wp-admin/admin-ajax.php」の記述を変えて改善したという例がいくつか見られたが、自分の場合はメディアファイルの追加は改善されたがアイキャッチ画像の設定は改善されなかった。

admin-ajax.php（変更前）

header('Content-Type: text/html; charset=' . get_option('blog_charset'));

admin-ajax.php（変更後）

if( in_array( $_POST['action'], array( 'query-attachments', 'send-attachment-to-editor' ))){
 header( 'Content-Type: application/json; charset=' . get_option('blog_charset' ));
}else{
 header( 'Content-Type: text/html; charset=' . get_option( 'blog_charset' ) );
}

WordPressのいわゆるコアファイル。

• WordPressのルートディレクトリのファイル。
• wp-adminフォルダ。
• wp-includesフォルダ。

wp-adminフォルダはWordPressのアップデートで上書きされるコアファイルが含まれている。

なのでこれで解決した場合でも、WordPressのアップデートの都度、書き換えなくてはならなくなるという可能性が出てくる。

wp-admin/admin-ajax.phpの情報。

それでも、「wp-admin/admin-ajax.php」の情報は、文字コードの指定に関する記述だったため、原因の切り分けにはとても助かった。

メディアライブラリが表示されないときの対処例。

メディアライブラリ表示不可の対応として、UTF-8で指定する。
保存だけでなく、UTF-8形式であることを記述する。

HTMLもCSSも、データベースもWordPressもUTF-8。

対応としては、とにかく文字コードは「UTF-8」であることを記述する。

現代では、HTMLもCSSもデータベースもWordPressもVS Codeも、ほとんどの場合、文字コードは「UTF-8」で指定されている。

（※データベースは絵文字対応をする場合、「utf8mb4」を選択）。

Webデザインでは、UTF-8、BOMなしが基本。

Webデザインの学校やスクールなどで習うときも、「UTF-8」で保存しましょう、と言われているはず。

2010年頃にはすでにハローワークの職業訓練校でも「UTF-8」と確立されていた。

VS Codeなどの現在主流のエディタも、普通に保存すれば「UTF-8、BOMなし」となる。

参照元：VS Code PowerShell Microsoft

なので、サーバーへもあちこちで、わたしたちは「UTF-8」ですよ、と伝えてあげる。

HTML

HTML

<meta charset="UTF-8">

style.css

CSS

@charset "UTF-8";

HTMLとCSSは普通、初期状態で記述するのでおそらく大丈夫。問題はここから。

普段では必要のない箇所へも、文字コードの指定を記述していく。

（※編集するときはバックアップを忘れずに。）

wp-config.php

PHP

// Set the default charset to UTF-8 / デフォルトの文字コードをUTF-8に設定
ini_set('default_charset', 'UTF-8');

functions.php

PHP

// Set the Content-Type header to application/json with the blog's charset for AJAX requests / AJAXリクエストのために、Content-Typeヘッダーをapplication/jsonとブログの文字セットに設定
function set_json_content_type_for_ajax() {
    if ( defined( 'DOING_AJAX' ) && DOING_AJAX ) {
        header( 'Content-Type: application/json; charset=' . get_option( 'blog_charset' ) );
    }
}
add_action('init', 'set_json_content_type_for_ajax');

// Force the encoding of the post content to UTF-8 / 投稿コンテンツのエンコーディングをUTF-8に強制
function force_utf8_encoding($content) {
    return mb_convert_encoding($content, 'UTF-8', 'auto');
}
add_filter('the_content', 'force_utf8_encoding');

.htaccess

.htaccess

# Set the default character encoding to UTF-8 for the server response / サーバーのレスポンスのデフォルト文字エンコーディングをUTF-8に設定
AddDefaultCharset UTF-8

以上、参考になれば幸いです。

※Webデザインは実務数年、職業訓練校講師数年、フリーランス数年、計15年以上のキャリアがありますが、一気にがぁっと書いているので「です・ます調」ではありません。（元々はメモ書きでした。） ※事実や経験、調査や検証を基にしていますが、万一なにかしら不備・不足などがありましたらすみません。お知らせいただければ訂正いたします。 ※写真は主にUnsplashやPixabayのフリー素材を利用させていただいております。その他の写真や動画もフリー素材やパブリックドメイン、もしくは自前のものを使用しております。

WordPress 関連メモ。

• Simple Image XML Sitemapの使い方の例。画像サイトマップをGoogleへ。
• WordPressのリビジョン。正しく表示されないときの復元の例。
• PerplexityとWordPressの名前と意味合い。著作権と知的財産。
• WordPressのセキュリティ対策。脆弱性の疑問と強化設定。
• WordPressのテーマ。有料と無料の違いと、ウェブサイトの例。
• Googleアナリティクスでの自分のアクセスを除外。【WordPress】
• WordPressの不要なメディアファイルを削除する方法。Media Cleaner。
• WordPress 画像のキャプション表示を削除したい場合。

• WordPressのログインパスワードを変更する方法。セキュリティ対策にも。
• WordPressのトップページがindex.phpでもfront-page.phpでもhome.phpでも問題はない。
• reCAPTCHAの導入例と、バッジ（マーク）をCSSで非表示に。
• WordPressから届く「モデレートしてください」を止めたい。
• WordPress投稿の目次が消えたら！Table of Contents Plusの表示方法。
• 「データベース接続確立エラー」の対処。wp-configに問題がないとき。
• WordPressの投稿IDを確認したい時は、ここを見るのが簡単。
• WordPressのセキュリティをオンラインチェック、「Sucuri」。
• WordPress pタグを投稿記事から削除する1行のコード。
• アイキャッチ画像（WordPressのサムネイル画像）がない場合、いらない場合は、これで解決。

• さくらインターネットのコンテンツブーストの設定方法。（数ステップで。）
• さくらのサーバーからさくらのサーバーへの引越しで、「DNSゾーンが既に登録されています」のエラーが出たとき。
• WordPressで動画が再生されない！ときの対処。
• WordPressの投稿とカスタム投稿を振り分けたい時はこれで解決。（条件分岐できない時の対処方法。）
• 辿ったリンクは期限が切れています！？ WordPressテーマのアップロードエラー対処。
• PHPの配列の括弧の違いは？WordPressでよく見るarray()と[]。
• Contact Form 7に確認画面がない！の対処方法。CSSか固定ページで。
• WordPressの引越しは、ささっとAll-in-One WP Migrationで。
• WordPressの検索ハイライト表示の仕方。（functions.phpに追加するだけ。）
• 引越しなどで、WordPressのメディアが消えた場合の、Moving Media Library。