Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

サーバーを移行したら画像が表示されなく...
 
共有:
通知
すべてクリア

[解決済] サーバーを移行したら画像が表示されなくなった

23 投稿
3 ユーザー
22 Reactions
719 表示
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

いつもお世話になっております。

サーバーをお名前ドットコムの共用サーバーSDからRSに移行したら画像が表示されなくなりました。

と言っても、ChromeやFirefoxではヘッダーの画像や各投稿のサムネは表示されており、グローバルメニューの画像のみがNG。Safariではヘッダーの画像のみが表示されていてサムネもグローバルメニューの画像もNGです。各投稿ページも同様です。

どうやらサーバー移行時に

wp/wp-content

wp-content

に変わったことが原因だと思うのですが、『Better Search Replace』というプラグインで差し替わると聞いて実行したものの

DRY RUN: 48 tables were searched, 0 cells were found that need to be updated, and 0 changes were made.

Click here for more details, or use the form below to run the search/replace.

と言われ変化がありません。

キャッシュのクリアやWP Fastest Cacheの無効化などは試しています。

加えて、吹き出しの画像も表示されなくなっていて、こちらも同様の状況です。

なにかヒントをいただければ幸甚です。よろしくお願いいたします。

----------------------------------------------
サイト名:Nostalgic Japanese Songs
サイトURL: https://douyo-shouka.com
ホームURL: https://douyo-shouka.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
親テーマスタイル:/wp-content/themes/cocoon-master/style.css
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
WordPressバージョン:6.3.2
PHPバージョン:8.2.4
ブラウザ:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.1 Safari/605.1.15
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja
----------------------------------------------
テーマ名:Cocoon
バージョン:2.6.8.4
カテゴリー数:18
タグ数:305
ユーザー数:2
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.3
style.cssサイズ:3948バイト
functions.phpサイズ:1328バイト
----------------------------------------------
Gutenberg:0
AMP:0
PWA:0
Font Awesome:4
Auto Post Thumbnail:0
Retina:0
ホームイメージ:.testrs.jp/blog/wp-content/uploads/2019/07/homeimage-1.jpg
----------------------------------------------
ブラウザキャッシュ有効化:1
HTML縮小化:1
CSS縮小化:1
JavaScript縮小化:1
Lazy Load:1
----------------------------------------------
利用中のプラグイン:
Ad Invalid Click Protector 1.2.8
Autoptimize 3.1.9
Better Search Replace 1.4.3
Broken Link Checker 2.2.3
Category Order and Taxonomy Terms Order 1.7.9
Contact Form 7 5.8.2
Cookie Notice & Compliance for GDPR / CCPA 2.4.11.1
Custom Taxonomy Order 3.4.4
Enable Media Replace 4.1.4
EWWW Image Optimizer 7.2.1
Flying Scripts 1.2.3
Health Check & Troubleshooting 1.7.0
Honeypot for Contact Form 7 2.1.1
Site Kit by Google 1.111.1
UpdraftPlus - Backup/Restore 1.23.10
WebSub (FKA. PubSubHubbub) 3.1.3
Wordfence Security 7.10.5
WP Fastest Cache 1.2.0
XML Sitemap Generator for Google 4.1.13
----------------------------------------------


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17374
 

投稿ページのはSearch Regexプラグインとかで以下のように置換すれば良いのかなと思いました。

 https://douyo-shouka.com/wp/wp-content/ 

 https://douyo-shouka.com/wp-content/ 

※失敗した場合取り返しのつかないことになる可能性があるのでバックアップをして元に戻せる状態を作った状態で自己責任で実行をお願いいたします。

グローバルメニューとかはCSSカスタマイズの記述を変更すれば良いように見えます。

この投稿は1年前ずつわいひらに変更されました

   
gumby reacted
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

グローバルメニューの画像

メニューの背景画像は、子テーマの style.css にお書きになっています。その CSS を変更すれば表示されます。

● サムネイル

添付画像のとおり、WebKit では表示されています。

吹き出しの画像

どこにあるのか分からないです。

※ わいひらさんとコメントがかぶりました。

この投稿は1年前ずつAkiraに変更されました

   
gumby and わいひら reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

わいひらさま
Akiraさま

いつもありがとうございます。

ご指摘のとおり、CSSの部分を編集したら表示されるようになりました。

ただ、

 

1:ChromeやFirefoxでは表示されるのに、Safariでは画像が表示されない問題(各投稿も含む)。

Search RegexプラグインよりBetter Search Replaceを推すサイトが多く思えたのでこちらをインストールし、まさにおっしゃるとおり実行したのですが、最初に添付した画像のように結果が得られませんでした。そこでSearch Regexをインストールし再度実行してみましたが、

No more matching results found.

とBetter Search Replace同様の答えが返ってきます。

Safariの「開発>ページのリソース>コンソール」のエラーを見ても

Failed to load resource: the server responded with a status of 404 ()

と表示されるのに、置き換えプラグインではどちらも「見当たらない」と言う答えで、なんだか狐につままれたような?状況です。

 

2:吹き出しの画像が表示されない問題

添付のように、吹き出しの設定はしていますが、なぜか反映されません。

 

なにかお気づきの点があればご教示いただきたく、よろしくお願いいたします。


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

ChromeやFirefoxでは表示されるのに、Safariでは画像が表示されない問題(各投稿も含む)

Safari のキャッシュや Cookie などを削除するとどうなるでしょうか?

削除しても表示されない場合は、デベロッパーツールのエラーの部分で 404 になっている URL の確認が必要です。

吹き出しの画像が表示されない問題

以下のページに吹き出しを見つけました。

https://douyo-shouka.com/ringo-no-hitorigoto/

吹き出し画像の URL がこうなっています。

 https://douyo-shouka.com.testrs.jp/blog/wp-content/uploads/2022/10/histric-prof.jpg 

画像の URL が間違っているように思えます。

ただ、以下の URL にアクセスしても 404 になります。吹き出し画像は存在するでしょうか?

 https://douyo-shouka.com/wp-content/uploads/2022/10/histric-prof.jpg 

   
わいひら and gumby reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

ご回答ありがとうございます。

 

●吹き出しの画像が表示されない問題

こちら、ご指摘いただいてファイルマネージャーを探したところ、なぜか画像がありませんでした。

なので、直接ファイルマネージャーにjpgファイルを再アップしましたが、まだ表示されません。

(Webpじゃないからでしょうか?)

 

●ChromeやFirefoxでは表示されるのに、Safariでは画像が表示されない問題(各投稿も含む)

キャッシュのクリアやCookieの削除もしましたが、依然として表示されません。

デベロッパーツールでもエラーは出ていません。ただ、「コンソールが消去されました」とグレーで表示されていて、これはキャッシュやCookieの削除の結果かと思っているのですが、いかがでしょうか。


   
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17374
 

まだ画像URLの赤字の部分がおかしいです。

ttps://douyo-shouka.com.testrs.jp/blog/wp-content/uploads/2022/10/histric-prof.jpg

吹き出し画像のURLを変更する必要があると思います。

投稿者:: @gumby

(Webpじゃないからでしょうか?)

そんなことをしたら拡張子の分URLが変わってしまうので表示されなくなります。
.webpにして吹き出し画像のURLの拡張子も変更するなら良いですが。

この投稿は1年前ずつわいひらに変更されました

   
gumby reacted
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

●吹き出しの画像が表示されない問題

以下の URL で画像が表示されるようになりました。

 https://douyo-shouka.com/wp-content/uploads/2022/10/histric-prof.jpg 

ただ、サイト上の画像は以下の URL ですので、URL の変更が必要です。

 https://douyo-shouka.com.testrs.jp/blog/wp-content/uploads/2022/10/histric-prof.jpg 

吹き出しのデータはデータベースにありますので、Better Search Replace プラグインで変更できるかもしれません。

●ChromeやFirefoxでは表示されるのに、Safariでは画像が表示されない問題(各投稿も含む)

状況が分からないため、スクリーンショットを 2 枚いただけるでしょうか?

1 枚は、デベロッパーツールの Console のスクリーンショットです。

もう 1 枚は、デベロッパーツールの Elements のスクリーンショットです。表示されない画像の <img> を確認できるように撮影して欲しいです。

※わいひらさんとコメントがかぶりました。

この投稿は1年前 2回ずつAkiraに変更されました

   
gumby reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

ご指摘ありがとうございます!
吹き出しの画像はわいひらさまからもアドバイスいただいたので追って試してみます。

で、Safariの画像が…の件、スクショを撮りましたが、どうにも<img>の項目が見つからず、一応ChatGPT(3.5)に聞いたみたのですが、Safariのバーションが17.1でMacOS14.1では変更されているのかたどりけていないようです。一応近くまでは行ったのでファイルを添付します。

お手数をおかけして大変申し訳ございません。よろしくお願いいたします。

 


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

添付画像の貼り付け


   
gumby and わいひら reacted
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

Safariの画像が…の件、スクショを撮りましたが、どうにも<img>の項目が見つからず

デベロッパーツールを開いた後に、ターゲットアイコン(標的に狙いを定めるようなやつ)をクリックし、サイト上で画像の部分をクリックします。そうすれば、<img> を確認できます。※ 添付画像をご参考ください。

また、以下の 2 つをお試しください。

  • 全ての WordPress プラグインの停止
  • Safari のプライベートブラウズでの確認
この投稿は1年前ずつAkiraに変更されました

   
わいひら and gumby reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

大変お手数をおかけして本当に申し訳ございません。

じつは、セーフブート&再起動したら一度写真が表示されたのですが、管理画面を行き来してるうちにまた写真が表示されなくなり、再度セーフブートしてもうまくいかなくなりました。写真に関するプラグインは触っていません。

で、ご指摘の通りプラグインを調べてみたところ、「Flying Scripts」がどうやら影響していることがわかりましたので外してみました。

ただ、そうすると、コンソールの警告表示が大量に出るようになりました。

pdfを添付します。画像が表示されている方は「Flying Scripts」を外しています。

なにかわかることがあればご教示いただけると幸甚です。

よろしくお願いいたします。


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

プラグインの EWWW Image Optimizer か Autoptimize で画像の遅延読み込みをされていませんか?プラグインの設定で画像の遅延読み込みをされている場合は、その設定を無効にします。

※ WordPress はデフォルトで画像の遅延読み込みに対応しているため、基本的にプラグインで遅延読み込みをする必要はありません。

その上で、Flying Scripts を有効にするとどうなるでしょうか?

この投稿は1年前 2回ずつAkiraに変更されました

   
わいひら and gumby reacted
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17374
 

今、僕の環境で以下のトップページでコンソールを見てみましたがアドセンス(広告?)関連のものしか出ていないように見えます。
https://douyo-shouka.com/
対策されたのかな?


   
gumby reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

何度も何度も大変恐縮です。

ご指摘いただいたEWWW Image Optimizer と Autoptimize の画像の遅延読み込みを確認しましたが、
どちらもチェックは外れておりました。

試しにEWWWのチェックを一度入れて外し、Flying Scriptsを有効化してみたのですが、
やはり画像は表示されなくなりました。

ご指摘いただいたプラグインの設定を添付します。

素人的にはFlying Scriptsのキーワードが多すぎるのかとも思っていますが、調べきれておりません。

なにかお気づきの点がありましたらご指摘いただけると幸甚です。

よろしくお願いいたします。

※Chromeでログインすると500エラーになってしまうためSafariから送ろうとしていますが400 Bad Reqestが表示されてしまい何度か試していますが、Wi-Fiの影響もあるのでしょうか。
※わいひらさま。何も対策していませんが、なんかいろいろよくわからないことになっています。


   
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

PDFを添付しようとしたらエラーが頻発したのでjpg画像を3枚添付します。

お手数をおかけしますが、よろしくお願いいたします。


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

以前に添付された Safari のスクリーンショットを見る限り、Safari でアクセスした時に何かが自前で画像の遅延読み込みをしています。data-src と data-srcset が自前での遅延読み込みです。

<img
    data-src=""
    loading="lazy"
    data-srcset="">

この自前での遅延読み込みが怪しいです。

サーバーの機能で画像の遅延読み込みをされてはいないでしょうか?

Chrome では自前での遅延読み込みはしていないため、Cocoon の遅延読み込み機能ではないです。

この投稿は1年前 3回ずつAkiraに変更されました

   
gumby and わいひら reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

サーバー会社(お名前.com)に質問したところ、週末を挟んで返事があり、

「お問い合わせの件について、サーバー側では初期設定としては高速化の処理は行われておりません」

とのことでした。

後回しにして高速化を図ろうとしても、結局FlyingScriptsがあったほうがいいようで、当初の状態でストップしたままです。

どうにか解決できるといいのですが…。


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

以前「Cocoon の遅延読み込み機能ではない」と書きましたが、Cocoon 設定 > 高速化の「Lazy Loadを有効にする」を無効にするとどうなるでしょうか?

もし、それでも表示されない場合は、Cocoon の「Lazy Loadを有効にする」は無効のままで、EWWW Image Optimizer プラグインの「Picture Webp Rewriting」の無効もお試しください。


   
gumby and わいひら reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

Akiraさま

ありがとうございます。

Cocoon 設定 > 高速化の「Lazy Loadを有効にする」を無効化したところ、画像が表示されるようになり、エラーも消えました!

これで一安心です。ずっとお付き合いくださり感謝しております。

サーバー移行以前は問題なかったのに(開発メニューは開けていませんでしたが)、これはサーバーとの相性ということなんでしょうかね?

いずれにせよ、これで正常化できました。助かりました。

重ねてお礼申し上げます。


   
わいひら reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

で、ごめんなさい。その後ためしにChromeの方を覗いてみたら、なにやらエラーがたくさん出ています。ChatGPTに相談しながら自分で解決しようとしたのですが、たとえば

furusato/:1 Uncaught SyntaxError: Unexpected token '+'

を見ても「+」なんてないですし、いまのところ体制に影響はなさそうなのですが、どうなのでしょう?


   
(@akira)
Famed Member Registered
結合: 7年前
投稿: 1657
 

@gumby さん

現在はエラーは出ていないようです。

ただ、Flying Scripts を無効にするとエラーが出るのは気になりますね。


   
わいひら and gumby reacted
gumby
(@gumby)
Estimable Member Registered
結合: 6年前
投稿: 125
トピックスターター  

@akira さま

ありがとうございました。時間を置いたらChromeの細かいエラー以外は出なくなっていました。

テストサーバーで一度試したか、すでに忘却の彼方ですが、そのルートにはまったナニかがあるようですが、これは追って片付けられるかも、と思っております。

大変助かりました。

わいひらさまもありがとうございました!


   
わいひら reacted
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました