WordPressでCloudFrontを利用する際にブロックエディタが使えなくなる

WordPressアイキャッチ画像

WordPressサーバーの前段にAWS CloudFrontを配置するとブロックエディタが使えなくなります。
症状としてはテキストまたはHTML を入力して開始と表示されてブロックエディタが機能しなくなります。

WordPress記事執筆画面でブロックエディタが使えない画面
ブロックエディタが使えない

CloudFrontはAWSが提供するCDNです。コンテンツをキャッシュすることでページ読込の高速化、DDOS対策が期待できます。

目次

原因 アクセス元がCloudFrontとなるから

WordPressのビジュアルエディタはアクセス元がPCかそれ以外かでブロックエディタを有効にするか無効にするかを決めているようです。
クライアントとサーバの間にCloudFrontを挟むことにより、サーバはCloudFrontからのアクセス(=PCからではない)と判断してブロックエディタを無効化してしまします。

WordPressでブロックエディタが使えなくなってしまう仕組みの解説

対策 functions.phpを修正して常にブロックエディタを有効化する

WordPressの管理画面にログインして外観→テーマファイルエディターの画面に遷移します。
functions.phpを選択して以下コードを追加してください。

function user_can_richedit_custom() {
    global $wp_rich_edit;
 
    if (get_user_option('rich_editing') == 'true' || !is_user_logged_in()) {
        $wp_rich_edit = true;
        return true;
    }
 
    $wp_rich_edit = false;
    return false;
}
add_filter('user_can_richedit', 'user_can_richedit_custom');

これでCloudFrontからブロックエディタを使えるようになったかと思います。

PR
当ブログはWordPressテーマSWELLを使用しています。非常に使いやすく、簡単にプロのようなデザインを使えるのでお勧めです!!

SWELL – シンプル美と機能性両立を両立させた、圧巻のWordPressテーマ

ランキング

ランキングに参加しています。クリックして応援いただけると嬉しいです。
にほんブログ村 IT技術ブログ クラウドコンピューティングへ
にほんブログ村
AWSランキング
AWSランキング

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次