誰でも利用できますか?スマートフォンサイトも計測できますか?どの機能から使うべきか迷っています。UI/UX・デザインTweet今回はWordPressで構築されたサイトをプラグインを使ってAMP対応する方法についてご説明します。WordPressはサイト制作にあまり詳しくないユーザーでも非常に使いやすい反面、深く仕組みをがわからないためどのように対策して良いのかわからない、という方もいらっしゃるかと思われます。Pagesの略で、モバイル端末でのWebサイト表示の高速化を目指して主にニュース記事、ブログ記事を取り扱うページに対しGoogle、Twitterなどが推し進めているプロジェクトです。通信速度が遅い環境でもWebコンテンツをストレスなく閲覧できるよう、ページの容量を大幅に軽減してモバイルへ配信するのがAMPの仕組みになります。他にもプラグインは存在していますが、これは「公式版」とも言える存在で、面倒な設定は一切必要なくただ有効化するだけで完了するのでおすすめです。Pluginsをインストールします。「設定」→「パーマリンク設定」→「変更を保存」することでパーマリンク構造を更新しておきます。設定は以上で完了です。左側のタブから、「外観」を選択すると「AMP」というメニューが追加されています。こちらを選択することで、AMP化されたページのプレビューを確認する事ができます。左側にはDesign(ヘッダーの文字色、ヘッダーの背景色とリンク、色調)をカスタマイズできるツールがあるので、必要に応じて変更が可能です。AMPページを確認しようカスタムが終われば、実際にAMPページにアクセスしてみましょう。今までのURLがそのままAMP化されるわけではなく、あらたに生成されたURLからアクセスできます。https://www.example.com/blog/というURLのページを確認する場合には、https://www.example.com/blog/amp/https://www.example.com/blog/?amp=1という風に追記してAMPバージョンのページへアクセスします。実際に確認すると?プラグインを導入したページにアクセスし、末尾に「&amp=1」を追記します。Chromeならデベロッパーツールを表示させます。左から2番めのモバイル画面のエミュレターに切り替えるとWordPressの設定画面でのプレビューと同じページになっているはずです。ここで赤字のエラーが表示される場合には、AMPページとしてGoogleに認識されません。正しくAMP化している場合は、下の画像のような稲妻のアイコンが表示されます。あっという間にAMP化が完了しました。Google検索結果でブログの各ページがカルーセル化しているかどうか、(上位表示されるサイトであれば)確認できるはずです。Analyticsでの計測ができない状態になっています。PageFrogというプラグインを追加することで解消できます。AdSense、ロゴやスタイルの設定が可能になるプラグインです。こちらもあらためてご紹介したいと思います。導入検討や他社ツールとの違い・比較について弊社のプロフェッショナルが喜んでサポートいたします。弊社のプロフェッショナルがコンサルティングいたします。今すぐお気軽にご相談ください。今すぐお気軽にご相談ください。10:00~19:00)今すぐお気軽にご相談ください。10:00~19:00)グラッドキューブは「ISMS認証」を取得しています。定めた企業の情報情報セキュリティマネジメントシステムの評価制度です。いますぐ無料でお試しください。トライアル終了後も無料でご利用いただけます。Reserved.サイト内の記事・写真・アーカイブ・ドキュメントなど、すべてのコンテンツの無断複写・転載を禁じます。Reserved.サイト内の記事・写真・アーカイブ・ドキュメントなど、すべてのコンテンツの無断複写・転載を禁じます。