ヘッダーロゴ未表示になったことの対応について | Cocoonテーマに関する質問 | Cocoon フォーラム

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

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

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

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

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

wpForoの解決済みリンク

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

wpForoのいいねリンク

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

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

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

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

フォーラムのTwitterアカウント(@CocoonForum)はこちら

スポンサーリンク
ヘッダーロゴ未表示になったことの対応に...
 
Share:
Notifications

[解決済] ヘッダーロゴ未表示になったことの対応について  


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月27日 14:40  

わいひらさん

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

表示速度が体感でますます遅くなり、別の相談でもサーバ処理能力の点、ご指摘いただきましたので、レンタルサーバー契約を、ロリポップのライト→ハイスピードに変更しました。まだ1年以上契約が残っているため、他社サーバへの移行前にまずロリポップ内でクラスアップしました。

早速、いくつか不具合がでました。まず、ヘッダーロゴがどうしても表示されない点、お助けいただければと思います。

<経緯>

従前、Cocoon設定画面から次のような設定をして問題なく表示されていました。

-----------------------------------------------

ヘッダーレイアウト:センターロゴ(スリムメニュー)

高さ:未設定

高さ(モバイル):未設定

ヘッダーロゴ:pngファイルを設定(480 × 126)

ヘッダーロゴサイズ:未設定

キャッチフレーズの配置:表示しない

ヘッダー背景画像:jpgファイルを設定(1240 × 240)

ヘッダー背景画像の固定:チェック

-----------------------------------------------

ハイスピードに契約変更したところ、ヘッダー画像の高さが非常に狭くなり、背景画像が1/3程度しか表示されなくなり、ロゴも未表示となったため、下記のように高さを設定

高さ:200 px

高さ(モバイル):200 px

背景画像は問題なく表示されるようになったが、ロゴが表示されないままになっている

気づきとしては、以下のようになります。

①フッターロゴは未設定なので、ヘッダーロゴがそのままフッターには今でも表示されている

②ヘッダー背景画面をクリアして、再表示させると、何も表示されない

契約プラン変更で課題山積みになりました。

この投稿後、縮小化を外します。

どうぞ、本件、お導きを宜しくお願いします。

----------------------------------------------
サイト名:経営コンサルタントによる経営戦略と経営管理に効く経営管理会計
サイトURL: https://keieikanrikaikei.com
ホームURL: https://keieikanrikaikei.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
スキン:/wp-content/themes/cocoon-master/skins/skin-momoon-aqua/style.css
WordPressバージョン:5.3.2
PHPバージョン:7.3.7
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.88 Safari/537.36
サーバーソフト:LiteSpeed
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja,en-US;q=0.9,en;q=0.8
----------------------------------------------
テーマ名:Cocoon
バージョン:2.0.4.1
カテゴリ数:35
タグ数:6845
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.0
----------------------------------------------
Gutenberg:1
AMP:1
PWA:0
Font Awesome:5
Auto Post Thumbnail:0
Retina:1
ホームイメージ:/wp-content/uploads/2019/12/Blog-top-screen-2019-12-13-1.jpg
----------------------------------------------
ブラウザキャッシュ有効化:1
HTML縮小化:1
CSS縮小化:1
JavaScript縮小化:1
Lazy Load:1
WEBフォントLazy Load:1
JavaScript(フッター):1
----------------------------------------------
利用中のプラグイン:
Ad Inserter 2.5.10
Akismet Anti-Spam 4.1.3
All In One SEO Pack 3.3.4
Aurora Heatmap 1.3.3
Broken Link Checker 1.11.9
Category Order and Taxonomy Terms Order 1.5.7.1
Classic Editor 1.5
Contact Form 7 5.1.6
Duplicate Post 3.2.4
Easy Table of Contents 1.7
Edit Author Slug 1.6.1
EWWW Image Optimizer 5.1.3
Google XML Sitemaps 4.1.0
Jetpack by WordPress.com 8.0
Link Manager 0.1-beta
MathJax-LaTeX 1.3.11
Menu Icons 0.12.2
Nested Pages 3.1.7
Post-Plugin Library 2.6.2.1
PS Auto Sitemap 1.1.9
Regenerate Thumbnails 3.1.2
Shortcodes Ultimate 5.6.1
TablePress 1.10
TinyMCE Advanced 5.3.0
WP Multibyte Patch 2.8.3
----------------------------------------------

小林友昭


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月27日 14:46  

わいひらさん

追加情報になります。

cocoonの管理画面でのプレビューは添付のようになって問題ないように表示されます。

宜しくお願いします。

小林友昭


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月27日 14:55  

わいひらさん

あれこれ試行錯誤しているうちに、上記ご相談の件、ヘッダーロゴについては表示されるようになりました。お騒がせしました。ただし、あちこちで、Gutenberg により挿入した「メディアと文章」「画像」ブロックで追加した画像が、無作為に画面で未表示になったままです。

この不安定さに対して、cocoonユーザ側で対処できることは何か、という一般化させた質問に切り替えることは可能でしょうか。

ロリポップのハイスピードのサービス安定を待つという以外の方法がもしあればお聞かせ願えれば助かります。

宜しくお願いします。

小林友昭


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月27日 21:02  

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

基本設定を続けていくうちに、再びヘッダーロゴが未表示になる現象が再現してしまいました。

ロリポップのハイスピードプランが提供するサーバ環境の仕様との相性の問題なのか分かりません。

根本的な相性や新プランがまだ実績がない故の粗さだとしたら、座して待つことはできないので、他サービスを検討する必要があると考えています。

なにか、ヒントをいただければ幸いです。

宜しくお願いします。

小林友昭


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月27日 21:14  

わいひらさん

何度もすみません。

ユーザ側で差分が判明したので、根本解決の糸口になればと思い、度々の投稿になりますが、情報共有させてください。

当方でわかったことは、cocoonの高速化設定から「CSS縮小化」を実行すると、ヘッダーロゴが未表示となることが分かりました。これが真因だとすると、何かの追加設定でヘッダーロゴ未表示を解決することは可能でしょうか。

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

小林友昭


わいひら
(@yhira)
メンバーサイト Admin
参加: 2年 前
投稿: 8342
わいひら - Facebookわいひら - Twitter
2019年12月27日 22:24  

当サイトは、CSSを縮小化していますが、ロゴは表示されています。
なのでこちら側で不具合は再現できませんでした。
ですので、実際にCSSを縮小化して不具合が出ている状態を見せていただくことはできますでしょうか。


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月28日 01:13  

わいひらさん

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

現在、「CSS縮小化」をチェックし、ヘッダーロゴ未表示の状態にしました。

おそらく、当方のローカル環境の問題とは思いますが、問題が切り分けられたらうれしいです。

どうぞ、宜しくお願いします。

小林友昭


Akira
(@akira)
Reputable Memberサイト
参加: 2年 前
投稿: 453
Akira - FacebookAkira - Twitter
2019年12月28日 10:59  

Jetpack の Lazy Load を無効にするとどうなるでしょうか。


わいひら 件のいいね!
keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月28日 14:17  

Akira さん

アドバイスありがとうございます。

Jetpack Lazy Load を無効にしてみましたが、ヘッダーロゴ、一部未表示画像(プロフィールページの自画像など)は未表示のままでした。この無効化で影響したのは、その通りサムネイル画像で、トップページのカルーセル画像が未表示に変わったので、無効化自体は効いていることは確認できましたが、ヘッダーロゴに影響を及ぼすことができませんでした。

もうしばらく試行錯誤してみます。

アドバイスありがとうございました。また、お気づきの点がございましたらお知らせ頂けると助かります。

 

小林友昭


Akira
(@akira)
Reputable Memberサイト
参加: 2年 前
投稿: 453
Akira - FacebookAkira - Twitter
2019年12月28日 16:38  

Jetpack と Cocoon のどちらの Lazy Load も有効になっているように見えます。

Lazy Load は、どちらか一方のみにしないといけません。もし、どちらも有効になっている場合は、どちらかの Lazy Load の無効化が必要に思えます。もし可能であれば、Jetpack の方の無効化がいいかもしれません。Jetpack の JavaScript のエラーが出ているように見えます(JavaScript が縮小化されているのでよく分からない)。

また、サーバーのキャッシュ機能が有効の場合は、サーバーのキャッシュの削除もお試しください。ロリポップのキャッシュの説明ページは、このページなのかな?

ロリポップ!アクセラレータ設定・解除方法

This post was modified 2か月 前 by Akira

わいひら 件のいいね!
keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月28日 20:44  

Akira さん

いろいろとありがとうございます。

ご指摘通り、Lazy Load は、Cocoon と Jetpack の両方で設定していたため、アドバイス通り、Jetpack の方を外しました。

cache は、ご案内頂いたものに従い、ロリポップのアクセラレータ機能から削除し、再描画させたましたが、添付のように、ヘッダーロゴに加えて、サムネイルも未表示となってしまいました。

以下、現象を確認した際のステイタスになります。

1. Lazy Load: Cocoonを有効、Jetpack を無効

2. cache: Cocoonのブラウザキャッシュを有効化、ロリポップのアクセラレータを無効、プラグインのLiteSpeed Cache はインストール後、無効化←途中、余計なことをしています。

3. その他高速化設定:(私が認識できる範囲のみで恐縮ですが)Cocoon管理画面にある高速化設定のすべてをon

その時点の環境情報は以下の通りです。

----------------------------------------------
サイト名:経営コンサルタントによる経営戦略と経営管理に効く経営管理会計
サイトURL: https://keieikanrikaikei.com
ホームURL: https://keieikanrikaikei.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
スキン:/wp-content/themes/cocoon-master/skins/skin-momoon-aqua/style.css
WordPressバージョン:5.3.2
PHPバージョン:7.3.7
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.88 Safari/537.36
サーバーソフト:LiteSpeed
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja,en-US;q=0.9,en;q=0.8
----------------------------------------------
テーマ名:Cocoon
バージョン:2.0.4.1
カテゴリ数:35
タグ数:6856
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.0
----------------------------------------------
Gutenberg:1
AMP:1
PWA:0
Font Awesome:5
Auto Post Thumbnail:0
Retina:1
ホームイメージ:/wp-content/uploads/2019/12/Blog-top-screen-2019-12-13-1.jpg
----------------------------------------------
ブラウザキャッシュ有効化:1
HTML縮小化:1
CSS縮小化:1
JavaScript縮小化:1
Lazy Load:1
WEBフォントLazy Load:1
JavaScript(フッター):1
----------------------------------------------
利用中のプラグイン:
Ad Inserter 2.5.10
Akismet Anti-Spam 4.1.3
All In One SEO Pack 3.3.4
Aurora Heatmap 1.3.3
Broken Link Checker 1.11.9
Category Order and Taxonomy Terms Order 1.5.7.1
Classic Editor 1.5
Contact Form 7 5.1.6
Duplicate Post 3.2.4
Easy Table of Contents 1.7
Edit Author Slug 1.6.1
EWWW Image Optimizer 5.1.3
Google XML Sitemaps 4.1.0
Jetpack by WordPress.com 8.0
Link Manager 0.1-beta
LiteSpeed Cache 2.9.9.2
MathJax-LaTeX 1.3.11
Menu Icons 0.12.2
Nested Pages 3.1.7
Post-Plugin Library 2.6.2.1
PS Auto Sitemap 1.1.9
Regenerate Thumbnails 3.1.2
Shortcodes Ultimate 5.6.2
TablePress 1.10
TinyMCE Advanced 5.3.0
WP-Optimize - Clean, Compress, Cache 3.0.15
WP Multibyte Patch 2.8.3
----------------------------------------------

なお、現時点でも、やはり、2019年12月27日 21:14に報告させて頂いた状況と同じく、Cocoonの高速化設定の「CSS縮小化」のみ外すと、ヘッダーロゴも、サムネイル画像および、記事内の貼付け画像もすべてうまく描画されます。

いったん、Akira さんから、CSS縮小されていてエラーが読みにくいとのご指摘がありましたが、わいひらさんに、CSS縮小化されている状態を見せてほしいともいわれているので、この後、「CSS縮小化」をしたまま(いつもとは真逆でそれはそれでドキドキですが)で検分いただかこうかと思います。

(回避策が分かっているのに採れないもどかしさはありますが、真因追究のため、このまま未表示で晒しておきます。)

本件、「CSS縮小化」機能を外せば、元通りうまく描画されますので、もし「CSS縮小化」させたままで試す価値がある他機能がございましたら、またご連絡いただければ嬉しいです。

引き続きよろしくお願い致します。

 

小林友昭


keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月28日 20:47  

度々すみません。

蛇足ながら、CSS縮小化を外した場合のトップ画面は添付のように問題ありません。

小林友昭


Akira
(@akira)
Reputable Memberサイト
参加: 2年 前
投稿: 453
Akira - FacebookAkira - Twitter
2019年12月28日 22:24  

まだ Cocoon 以外の Lazy Load が効いています。

今度は ewww と確認できるのですが、EWWW Image Optimizer に Lazy Load 機能があるのでしょうか?

「Google XML Sitemaps」「Contact Form 7」「WP Multibyte Patch」以外のプラグインを全て停止するとどうなるでしょうか。この 3 つは、不具合と関係ないはずです。

尚、「LiteSpeed Cache」は、プラグインのキャッシュを必ず削除し停止しなければなりません。

一応ご説明すると、私が最も怪しいと思っているのが Lazy Load です。CSS 縮小化を無効にすると正常になることからも Lazy Load が怪しい気がします。

しかも、Cocoon の Lazy Load は、ロゴ画像は対象外です。なのに、ロゴ画像にも Lazy Load が効いているのはプラグインが原因のはずです。そのプラグインが不具合を引き起こしているのではないか?と疑っています。


わいひらkeieikanrikaikei 件のいいね!
keieikanrikaikei
(@keieikanrikaikei)
Eminent Memberサイト
参加: 3か月 前
投稿: 39
keieikanrikaikei - Facebookkeieikanrikaikei - Twitter
2019年12月29日 01:43  

Akiraさん

何度もご指導ありがとうございます。

プラグインを順番に入れ替えて確認したところ、ご指摘通り、EWWW Image Optimizer を外した所で、ヘッダーロゴ、サムネイル、その他の画像、すべての描画を確認することができました。

ご賢察の通り、EWWW Image Optimizer に Lazy Load 機能がしっかり存在していました。こちらだけoffにすれば、すべて元通りの描画となりました。環境変更が、ロリポップのライトプラン→ハイスピードプラン だけだったので影響はココと思い込み、プラグインの干渉は最初から検討漏れでした。

私と同レベルの粗忽者がいらっしゃるかもなので、一応、同プラグインの Lazy Load 設定画面を貼っておきます。

何度もアドバイス頂きありがとうございます。機能重複なので、LiteSpeed Cache は、キャッシュ削除後、機能停止させました。

本件、真因解決に至りましたのでcloseでお願いいたします。

P.S.

わいひらさんが言及していたフォーラム利用ガイドにある「解決マーク」が漸くどこにあるか捜し当てられたので、これからセルフで「解決済」ポチっとさせて頂きます。

 

 

小林友昭


わいひら 件のいいね!
Share:
スポンサーリンク
わいひらをフォローする
おすすめサーバ

性能も兼ね備えながら安くブログ運営を開始できる点においてのNo.1。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/3(高速化プロトコル)に対応
◎東京・大阪でリージョン選択が可能
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎ディスク容量が多い
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越しオプションあり(有料)

サービス運営期間:1年7ヶ月

1年以上の契約をする場合は、クーポンコード入力でさらに10%割引(※2020/6/30まで)。

クーポンコード:PK4JK4RJ

クーポンの使用方法はこちら

安定感抜群のサーバーです。あまり急激なアクセス変動がないアフィリエイトサイトに向いています。

◎nginxを用いた高速サーバー(完全SSD)
◎老舗サーバーなので安定感抜群
◎ディスク容量が多い
◎転送量が多い
◎同サービス内でドメイン管理が可能
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
△DBは7日分だけ無料復旧可能(ファイルは有料)
×プラン変更でCPUのスペックアップができない
×プラン変更しても即時反映されない
×アダルト・出会い系サイト不可

サービス運営期間:16年

プラン変更で負荷対策が行えるので、ブログ向きのレンタルサーバーです。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/3(高速化プロトコル)に対応
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎転送量が多い
◎ディスク容量が多い
◎毎日無料バックアップ(14日分)
△DBは14日分だけ無料復旧可能(ファイルは有料)
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越しオプションあり(有料)

サービス運営期間:3年

とにかく速い。サイトに表示スピードを求めるならココ。

◎nginxを用いた高速サーバー(完全SSD)
◎プランのアップ・ダウングレードが自由自在
◎ディスク容量が多い
◎転送量が多い
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
○DB復旧は無料(ファイルは有料)
○サーバ引っ越しツールあり
○サーバー料金をチャージ払いが可能
△新しいサービスなので運営櫪がまだ短い

サービス運営期間:1年5ヶ月

格安な値段で始められる高機能サーバーです。
性能も備えつつ最安ならここ。
サイトを続けるうちにアクセスが増えれば、プランのアップグレートで対応可能です。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎激安プランが用意してある
◎値段あたりのスペックが高い(コスパ良し)
◎サーバ引っ越しオプションあり(無料)
◎アダルト・出会い系サイト可
○http/2(高速化プロトコル)に対応
△プランのアップは可能だがダウンは不可
△毎日自動バックアップ(1日分)
△前日のバックアップからのみ復元できる(無料)

サービス運営期間:4年

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