散歩、ときどきブログの自由気ままなサイト

AMP機能をやめたときにやったことまとめ|テーマはCocoon・サーバーはロリポップ

スポンサーリンク

ブログ
この記事は約6分で読めます。

AMPを有効にすることが当たり前のようにいわれ、AMP(アンプ)がどんなものかもよく知らずに有効化していました。

ちょこちょことサーチコンソールでエラーになったりしていたので、AMP(アンプ)に対して嫌気がさしていたところでもありました。

また、AのサイトからBのサイトへリダイレクトさせた際に、AMPが404エラーになっていたことに気付き、「どういうこと??」と思ったところから調べ始めました。

その後、スマホでサイトを巡回してみると、目次のスタイルはないし、見やすいように作った表組がめちゃくちゃ見づらくなってるし、見出しもおかしくなってたりとデザイン的にも「読みたくな~い!」と思えるサイトになっていました。

 

いや、本来簡素化されるって、知ってて当然のことなんだけども…ね。

そもそも「AMP」ってなによ?という疑問から始まり、AMP機能をやめたときに私がやったことを覚書として残しています。

いつか誰かの役に立つ時が来るのならば嬉しいです。

この記事内容は、ちはやが個人的に調べてやったことなので正しいかどうかわかりません。参考程度に読む自己責任でお願いします。

>> すぐにAMPをやめる方法を見る

AMPとは

AMPとは、米グーグル(Google)社が推進する、軽量なモバイル向けWebページの記述形式および配信方式。同社の配信サーバなどを介して携帯端末に高速にコンテンツを届けることができる。
参照:IT用語辞典 e-Words

つまりモバイルで早く見れるようにするよってこと。

当然、早く表示するので簡素なスタイルになってくるのです。

要素へのスタイル指定は通常と同じくできるのですが、style属性の指定ができなくなってくるんですよ。

それは表組で「width:30%」と指定しても、AMPではなくなるので、表組がガタガタになるんです。

ほかにもcssの上限があったりするので、トレンドブログなどテキストが主な記事ならAMPを有効にしていても概ね問題はないと思います。

>> すぐにAMPをやめる方法を見る

AMPをやめた理由

私は表組を多用していたので、上と下にある同じ表組の幅がずれずれになっていくのが許せなくなり、AMPをやめようと思ったのです。

それ以外にもAMPのエラーがちまちまとサーチコンソールに出てくるのもイヤになっていたことがあります。

変更していない記事がいきなりエラーになったり、それをそのまま放置しているといつの間にかエラーではなくなっていたりと、深追いするよりも記事を書きたいと思ったのですっぱりとAMP機能をやめました。(これについてはテーマも関係するかもしれませんが)

また、SEOに影響があるのではないか?とも思いましたが、見づらいサイトの方が訪問してきてくれた人にとって良いことではないなと思い、やめました。

 

AMP機能をやめる方法

使用環境は、テーマ「Cocoon」、サーバー「ロリポップ」

AMP機能をやめるのはCocoonの「Cocoon設定」→「AMP設定」「AMPの有効化」の「AMP機能を有効化する」の✔をはずすことだけです。

✔が入っていなければ、AMPになっていないので作業は必要ありません。

また、ロリポップユーザーはロリポップログイン後、「セキュリティ」の中の「WAF設定」で該当するサイトの「設定状態」を「無効」にしてからじゃないとCocoon設定が変更できないので注意してくださいね。

 

301リダイレクト設定をする

WordPressをインストールしたサーバーの中に「.htaccess」というファイルがあるので、AMPの301リダイレクト設定をしましょう。

そのままにしておけば、ゆっくりとAMPはなくなるようですが、リダイレクトや他のサイトからのリンク等あった場合「404エラー」になります。

どの記事がエラーになるか記事数が多ければ多いほどわかりませんよね?

だから「どの記事が…」なんて悩むよりも先手をうちましょう。

 

↓↓↓ ここからはロリポップサーバーでの説明になります。↓↓↓

 ※ちはやがやった方法なので自己責任でお願いします※ 

前準備

何が起こるかわかりません。万が一のためにバックアップは必ずとってから作業しましょう。

おすすめはプラグイン「BackWPup」です。

BackWPupを使ったことがない人は、ウェブ職TVの「WordPressで必須のセキュリティ対策7選を実演解説」でわかりやすく実演解説しているのでおススメです。

 

FTPに接続する

ロリポップにログインし、「サーバーの管理・設定」の中の「ロリポップ!FTP」を選びます。

 

.htaccessに追記する

赤枠部分に以下を追記します。※(サイトアドレス)は自分のサイトアドレスに変更してください。

必ず、#BEGIN WordPressの前に書き込むこと。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{QUERY_STRING} (^|&)amp=1(&|$)
RewriteRule ^(.*)$ https://(サイトアドレス)/%{REQUEST_URI}? [R=301,L]
</IfModule>
WordPressの管理画面からは確認せずに、シークレットウィンドウ別タブで新しく設定をしたサイトを開いてください。

万が一、うまく機能しないと「501エラー」がでて真っ白になったり何もできなくなります。

私が作業したときも「501エラー」頻発させましたが、ロリポップ!FTPを開いたまま、別タブでサイトの確認をおこなったので、焦ることなく修正できました。

正直、あせりますから、別タブで開いて確認はしましょう。

エラーになってしまっても、追記した部分を削除して保存しなおせば、元に戻ります

それでも戻らなくなってしまったらバックアップから戻しましょう。

 

まとめ

  • Cocoon設定からAMP機能を有効化するの✔を外す
  • サーバーにある「.htaccess」で301リダイレクト設定をする
  • 別タブで動作確認をする
  • 501エラーがでてもあせらないで、追記部分を削除しよう
  • 動作確認がOKになったらロリポップのセキュリティ「WAF設定」を「有効」に戻そう

今回AMPをやめるにあたって、ものすごく調べました。

エックスサーバーのやり方が多く、ロリポップサーバーのものがほぼ見つけることができず、501エラーを頻発させつつ、Cocoon公式のフォーラムも参考にしてやっとできました。

同じようにAMPをやめようと思っているけど、わからない、できないという人の少しでも手助けになれば嬉しいです。

ただし、絶対に正しい方法というわけではありませんので、バックアップをとり、自己責任でお願いいたします。

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