「メイド・イン・ヘブン」スキン適用中

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カスタマイズ依頼

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

Ampエラーの解消方法 ※タグ「sty...
 
共有:
通知
すべてクリア

[解決済] Ampエラーの解消方法 ※タグ「style amp-custom」の CSS 構文エラー - 宣言が不完全です

11 投稿
3 ユーザー
13 Likes
1,662 表示
(@himajin1985)
New Member Registered
結合: 3年前
投稿: 3
Topic starter  

対象のページのURL:

https://rearncareer.com/blog-wordpress/

 

相談内容:

Ampエラー

タグ「style amp-custom」の CSS 構文エラー - 宣言が不完全です

となり、解消しようにもエラー範囲が広すぎてどこを修正すればいいかわからず、困っております。

ご教授のほどよろしくお願いいたします。

 

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

このページではエラー範囲が広すぎて、試したことはございません。

 

 

 

環境情報:

----------------------------------------------
サイト名:ブログキャリアを学ぶ
サイトURL: https://rearncareer.com
ホームURL: https://rearncareer.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バージョン:5.8
PHPバージョン:7.4.13
ブラウザ:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.159 Safari/537.36
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
言語:ja-JP,ja;q=0.9,en-US;q=0.8,en;q=0.7
----------------------------------------------
テーマ名:Cocoon
バージョン:2.3.4.1
カテゴリ数:7
タグ数:4
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.3
style.cssサイズ:6448バイト
functions.phpサイズ:203バイト
----------------------------------------------
Gutenberg:1
AMP:1
PWA:0
Font Awesome:5
Auto Post Thumbnail:0
Retina:0
ホームイメージ:/wp-content/uploads/2021/06/oujIEolBE4MQqOm1624491883.jpg
----------------------------------------------
ブラウザキャッシュ有効化:1
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:1
WEBフォントLazy Load:0
----------------------------------------------
利用中のプラグイン:
AddQuicktag 2.6.1
Advanced Editor Tools (previously TinyMCE Advanced) 5.6.0
Akismet Anti-Spam 4.1.11
Autoptimize 2.9.1
Classic Editor 1.6.2
Contact Form 7 5.4.2
Jetpack 10.0
XML Sitemaps 4.1.1
----------------------------------------------


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

前略、himajin1985さん

私も原因はわかりません。

しかし、プラグインの「Autoptimize」をCocoonで使用すると不具合が生じることは、過去のこのフォーラムのいくつものトピックからわかっています。

 

「Autoptimize」は削除をおススメします。

 

あと、親テーマが最新ではないので、ダッシュボードの「更新」のところに表示されているCocoonのテーマを選択してアップデートすることをオススメします。

 

それと、プラグインの「WP Multibyte Patch」は日本語環境でWordPressを利用する際は、インストールが必須だそうです。

 

インストールしておくことをオススメします。

 


   
(@himajin1985)
New Member Registered
結合: 3年前
投稿: 3
Topic starter  

リフィトリーさま

 

ありがとうございます。

1.Autoptimiz

2.テーマを最新に更新

3.WP Multibyte Patchのインストール

上記を行いましたが、現在のところAmpエラーは解消されず、同じ箇所が指摘されておりました。

 

でも、抜けているところご指摘いただいて、ありがとうございます!

 


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

@himajin1985 さん

また別件ですが、Autoptimizを削除したことで、ソースコードが見れました。

 

Firefoxでソースコードを見てみると、サイドバー辺りに余分なpタグやaタグが赤く表示されます。(余分なのか、あるいは足りないのかはよく調べていません)

 

たくさんあるようですので、何らかの対処が要るかと思います。

 

それと、AMPページのキャッシュ削除を試してみてもいいのかもしれません。(あまり詳しくないのですが・・)

 

This post was modified 3年前 3回 by リフィトリー

   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

himajin1985さん

余分か不足しているpタグや a タグはサイドバーじゃなくて、モバイル用の下の方に設定したウィジェットかもしれません。

ウィジェットを設定し直せば、解消するかどうかは、ちょっと不明です。


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

himajin1985さん

これは余談ですが、Cocoonでは、プラグインの「Classic Editor」は不要です。

 

Cocoon設定の「エディター」タブの設定の「Gutenbergエディターを有効にする」のチェックをを外して、「変更をまとめて保存」のボタンで確定すると、クラシックエディターに切り替わります。

 

また、Autoptimizeの代わりと言いますか、サイトの高速化を図るときは、以下の記事が参考になるかと思います。

 

Cocoonおすすめのサイト高速化設定

https://wp-cocoon.com/site-speed-up/

 

This post was modified 3年前 by リフィトリー

   
himajin1985 reacted
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

himajin1985さん

このフォーラムでやり取りをしている間は、Cocoonの高速化設定は無効にしておいた方が良いです。

外部から状況を把握しやすくなりますので。


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

himajin1985さん

余分か不足のhtmlタグの件ですが、ウィジェットエリアの「コンテンツ下部」辺りに「 [C]テキスト(モバイル用)」ウィジェットか何かを入れて、その中に記述していませんか?

 

ウィジェットエリアの「フッター(モバイル用)」に、「人気記事」ウィジェットなり、「プロフィール」ウィジェットを入れる方が良いような気がします。


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 5年前
投稿: 6845
 

himajin1985さん

ウィジェットエリアの「コンテンツ下部」に「人気記事」ウィジェットや、「プロフィールウィジェット」を直接入れて、PCで非表示にしておく、という手もあるかもしれません。

 

#content-bottom-in {
    display: none;
}

@media screen and (max-width: 1023px) {
    #content-bottom-in {
        display: block;
    }
}

   
(@ひま人)
New Member
結合: 3年前
投稿: 1
 

リフィトリーさま

色々とありがとうございます!

出先なのですが、戻りましたら上からひとつずつ試させていただきます!


   
(@himajin1985)
New Member Registered
結合: 3年前
投稿: 3
Topic starter  

リフィトリーさま

ご教授いただいたこと、全て試したらエラー解消されました!

とても参考になりました。

この後、お伺いした通り、高速化もさせていただきます ? 


   
共有:

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

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

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

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

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

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

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

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