”「style amp-custom」で指定された作成者のスタイルシートが 50000 バイトの上限を超えています”の対処法

こんにちは。´∀`)ﾉ)) HELLO♪

昨日はこのトラブルで、ブログの更新ができなかった。(ノД`)・゜・。

事のはじめは…✉から

Google Search Consoleから、

AMP ページのエラーを修正してください

と言うメールが来て…

(ﾟДﾟ≡ﾟДﾟ)ｴｯﾅﾆﾅﾆ?

どうしたらいいの？って、ネットで色々調べて、プラグインを外してみたり、通知が来る直前に変更した設定を元に戻したり、ブラウザーのキャッシュを削除したり…。

でも、全く治らない。

ヽ(´Д｀ヽ)(/´Д｀)/ｲﾔｧ～

 

Google Search Consoleでは

ここがダメなのよって教えてくれてるけど、それをどうやって直せば良いか…もう全然わかりません。(ノД`)・゜・。

 

2018年8月1日、ふと思い立ってブログを始めた、超絶初心者な私が、どうやってこの問題を乗り切ったか？

次に同じ問題にぶつかってしまうかもしれない方の助けになれれば、と思いこの記事を投稿します。

サイトの環境を紹介します。

Word Pressで、Cocoonというテーマを使っています。

私がサイトを作るにあたって参考にさせて頂いた方のブログに、無料とは思えないくらい素晴らしいと、おススメのテーマで紹介されていました。

利用中のプラグインは以下のものでした。

• Akismet Anti-Spam 4.0.8
• All In One SEO Pack 2.7.3–これはCocoonではおすすめに入っていないので不具合の原因かもと外してみたりしましたけど変化なし。
• Contact Form 7 5.0.3
• Google XML Sitemaps 4.0.9
• Regenerate Thumbnails 3.0.2
• Wordfence Security 7.1.10
• WP Multibyte Patch 2.8.1

そして、スキンは【Hygiene】–所々に青系とピンク系を基調としたグラデーションを取り入れたスキン。

最後の希望

もう自分では絶対どうにも出来ないヽ(TдT)ノｱｰｳ…

と思ったので、Cocoonのテーマ利用マニュアルに載っていた、フォーラムに投稿して、お力を借りました｡（＞□＜；）ﾀｰｽｰｹｰﾃｰ

会員登録して、不具合報告に投稿したら、翌日には善意の皆さんの書込みが。おぉ(ﾟﾛﾟ屮)屮

一番簡単な改善方法は、スキンを変えることです。

と目からウロコの回答が。このスキンを使い始めてから２週間近く経ってからのエラーだったので、全く思い至りませんでした。(´Д`|||)

Cocoon製作者のわいひらさんも、

身長190cmある人（CSSの量が膨大なテーマ）が体重50kg（CSS50KB）にダイエットするはかなり厳しいといった感じです。

と分かりやすく教えて下さいました。

色々ついてるからそもそも大きすぎなのね。

すごく気に入ってたスキンだったのに【Hygiene】(ノД`)・゜・。

でも自分でCSSを除外してダイエットなんて…(ヾﾉ･∀･`)ﾑﾘﾑﾘ

【Hygiene】は残念ながら諦めることにしました。(ｏ´_｀ｏ)ﾊｧ･･･

そして、私がやった事

• AMPエラーの修正
• サイトのイメージをスキン【Hygiene】に近づけるための作業

この２点について、詳しく説明していきます。

AMPエラーの修正

この作業は極めて簡単でした。 d(ﾟ-^*)

Word PressのテーマCocoonの場合で説明します。

1. Cocoon設定〉スキン〉好みのスキンを選択〉まとめて設定を変更するをρ(‘-‘* ) ﾎﾟﾁｯとするだけです。–それが終わったら、Google AMP テストをして、問題が解決しているか確認します。
2. Word PressのテーマCocoonの場合のGoogle AMP テストを行う方法は、サイトを表示〉エラーのあった記事を選択〉画面下の方に表示されるGoogle AMP テストをρ(‘-‘* ) ﾎﾟﾁｯとするだけです。テストに合格したら3へ。
3. エラーのお知らせを受けたメールからレポートを開く
4. Google Search Console〉ステータス〉AMPのページが表示されるので、エラーの修正を検証をρ(‘-‘* ) ﾎﾟﾁｯとするだけです。–これは時間がかかるようです１２時間経ちましたがまだ検証が終わってません。→追記：2018/8/26夜、Google Search Consoleから『AMPの問題が修正されました』と６日経って連絡が来ました。終わらなくても心配しないでくださいね。

スキンの変更でサイトのイメージを変えても良い場合はここで終了です。

ヽ(´∀｀ )ﾉｵﾂｶﾚｻﾏｰ!!

サイトのイメージをスキン【Hygiene】に近づけるための作業

Word PressのテーマCocoonの場合です。

【Hygiene–所々に青系とピンク系を基調としたグラデーションを取り入れたスキン】のイメージを保つために行った作業です。

• Cocoon設定〉全体〉サイトキーカラー〉ピンク系へ変更—白抜きの文字がちゃんと見えるくらいの濃さに調整
• Cocoon設定〉全体〉サイトキーテキストカラー〉(濃)青系へ変更　※1
• Cocoon設定〉全体〉サイト背景画像〉青系とピンク系のグラデーションがある画像を添付※2
• Cocoon設定〉ヘッダー〉ヘッダー全体色-ヘッダー全体背景色〉(淡)青系へ変更
• Cocoon設定〉ヘッダー〉ヘッダー全体色-ヘッダー全体文字色〉(濃)青系へ変更　※1
• Cocoon設定〉フッター〉フッター全体色-ヘッダー全体背景色〉(中くらいの)青系へ変更
• Cocoon設定〉フッター〉フッター全体色-ヘッダー全体文字色〉(濃)青系へ変更　※1

※色の選択方法は、color-sample.comで選びました。各項目で色を選択〉番号添付〉色を選択

※1は同じ色です。

※2以前ダウンロードした事のある、清水麻里さんというイラストレーターの方のフリー素材のサイト『ふわふわ。り』のuntitled7という画像を使わせて頂きました。

イラスト素材利用報告が必要のようですので、bbs〉イラスト素材利用報告掲示板に必要事項を記入してコメントしました。 (人´∀`)ｧﾘｶﾞﾄｺﾞｻﾞｲﾏｽ♪

http://shimizumari.com/fuwa2li/index.html

作業は簡単ですが、調整が難しい。(´Д`|||)

でも、なんとか【Hygiene】に近づけたと思います。(´ー｀*)ｳﾝｳﾝ

 

 

《END》((*´∀｀*))ノ゛see you♪