こんにちは。
WordPressを運用していて、ファイルをアップロードしたら、CSSが一切適用されていなかったり、ところどころ画像がリンク切れを起こすという現象にぶち当たりました。
あまり記事がなかくて解消に少し時間がかかったのでメモがてら残していきます。
起こっていること
新しいページを作成してFTPツールの代わりにWP File Managerを使ってファイルをアップロードしていたのですが、不具合なのかうまくいかなかったため、大人しくFTPツールを使って全ての画像ファイルやCSSファイルをアップロードし直しました。
すると今まで問題なく表示されていたものが表示されなくなっていたのです。
- CSSが適用されない
- 一部の画像(3枚)がリンク切れになっている
ConsoleやDevToolのネットワークでは403と出ています。


エラーになっているファイルのURLに直接アクセスするとForbiddenとブラウザに表示される。
よくみるとアクセス権がないよって怒られてますね。

そもそも403のHTTPエラーは閲覧する権限がないときに起こるエラーです。
今まで普通に表示されていたのに、何かをきっかけにパーミッションが変わったようです。。。
解決策
パーミッションで怒られていたのでFTPソフトから直接変更しました。
私はMacでCyberduckを使っているのですが、Cyberduckの場合は該当のファイルを右クリックして情報 > アクセス権のところからパーミッションを確認できます。
実際に403になっていたファイルのアクセス権を見てみると600になっています。
他のファイルは644だったので、このアクセス権を644に直したところ正常に読み込んでくれました!

同様に他の403になっていた画像ファイルも644に直してあげたら全て表示されました。