AMPAFFINGER5サイトのURL末尾に/を付けてAMP対応させる手順2019年3月6日WordPressテーマ「AFFINGER5(WING)」では、ページ別にAMP対応が行えます。どのサイトでもAMP対応できるわけでもなく、さまざまな条件があります。AMP対応できるサイトの条件の1つとして、「記事末尾にスラッシュ(トレイリングスラッシュ)がある」ことが前提となっています。パーマリンクは「/」で終了する形にして下さい。AffingerAFFINGER5ユーザーのなかには、パーマリンク設定で「カスタム構造」の「/%postname%」を選択してしまい、URL末尾にスラッシュがつかない状態で運営している人もいるでしょう。ボクの運営する別ブログがそうでした。そこでこの記事では、AFFINGER5のサイトURL末尾に/を付けてAMP対応させる手順をご紹介します。実際にこの方法で2ブログを問題なく変更できましたが、重要なファイルを編集するため、バックアップを取ってください。運営状況によってはうまく作動しない可能性もあります。「変更を保存」を選択だけです。「カスタム構造」の「/%postname%」を選択していた場合は、「投稿名(sample-post/)」に変更することで、すべてのページのURL末尾に/が付きます。「/なし」から「/あり」にリダイレクトするパーマリンクを「/なし」から「/あり」に変更したら、「/なし」から「/あり」に向けてリダイレクト(転送)設定する必要があります。理由はここでは割愛します。リダイレクトする方法はいろいろありますが、今回は.htaccessファイルを編集する方法でご紹介します。「.htaccess」を開く先頭にリダイレクトコードを書く変更を保存するだけです。「.htaccess」を開く.htaccessファイルはFTPでサーバーにログインして、「public_html」を開くと見つかります。.htaccess(エイチティーアクセス)とは、Webサーバーの挙動を決定する設定ファイルです。「ロリポップ!」だったら「ロリポップ!FTP」にログイン、「エックスサーバー」だったら「ファイルマネージャ」にログインして、ドメイン選択後に見つかります。不明点は、各レンタルサーバーのマニュアルを参考にしましょう。先頭にリダイレクトコードを書くリダイレクト設定をしたいドメインの.htaccessを見つけたら、ファイルの1行目に以下のリダイレクトコードを書き加えます。ファイル.htaccessファイルの編集に失敗すると、サイトが表示されなくなる可能性があります。バックアップを取りましょう。変更を保存するリダイレクトコードを書き加えたら保存します。この設定で、「https://example.com/blog」に来ていたアクセスを、「https://example.com/blog/」に自動で転送してくれます(すべてのページで)。保存後にサイトが表示されなくなったり、不具合が発生したら、バックアップファイルで復元してください。念のため、自サイトのURLにスラッシュを付けないで検索してみてください。自動でスラッシュが付けられていると思います。「https://example.com/blog」で検索すると、「https://example.com/blog/」に転送されているはずです。トップページでは無効ですので、個別ページで試してください。次の方法でも確認すると良いでしょう。Analyticsの「リアルタイム」をチェックし、ユーザーがスラッシュありのURLで閲覧できている内部リンクの修正AFFINGER5のブログカードなど、内部リンクを自動生成してくれるツールは、パーマリンク設定を変更した時点で、すべての内部リンクも「/あり」に変更されています。手動で設定した内部リンク(たとえばこういう形式のリンク)「メニュー」のカスタムリンクなどは、「/なし」の内部リンクになっている可能性があります。確認して、修正しましょう。ページ別にAMP化する方法URL末尾に/を付けたら、ページ別にAMP対応が可能です(正確には、URL末尾に/がなくてもAMPページが生成されますが、URL末尾に/が付くことで、AFFINGERのガイドラインに沿った形式でAMP対応が可能となりました)。AMP対応するには、WINGマニュアルにある通り「AMP対応する」にチェックを入れるだけです。注意点としては、SUGOIMOKUJIなどの内部リンク(#st-toc-h-2など)は、AMPページでは無効なリンクとなるので、削除するか(https://example.com/blog/#st-toc-h-2)に貼り替えましょう。AMPについて(要ログイン)まとめAFFINGER5(WING)でAMP対応するには、記事末尾にスラッシュ(トレイリングスラッシュ)があることが前提となっています。パーマリンク設定で「カスタム構造」の「/%postname%」を選択してしまい、URL末尾にスラッシュがつかない状態で運営してしまった方は、パーマリンク設定を「投稿名(sample-post/)」に変更してください。パーマリンクが「/なし」から「/あり」に変わったら、.htaccessファイルを編集し、リダイレクト設定をしましょう。無事にリダイレクト設定が済んだら、ページ別にAMP対応ができます。自動広告」を配信する方法をご紹介します。Optimizer」を使い、次世代画像フォーマット「WebP(ウェッピー)」に変換する方法を解説します。WordPressAdSenseの「ページビュー」と「表示回数」の違い2019/4/3AdSenseのレポートでよく見る「ページビュー」と「表示回数」の意味の違いを解説します。Form7」を利用せずに、Googleが提供する「Googleフォーム」を使ったお問い合わせフォームの作り方をご紹介します。プラグインBOKUこのサイトのほか、いろんなブログをWordPressで作っている男。テーマはAFFINGER5を愛用。BOKU関連記事AFFINGER52019/8/9AFFINGE5おすすめヘッダーカードのキャッチコピー表示方法AFFINGER5(WING)のver20190801βより、おすすめヘッダーカードにキャッチコピーを表示できるようになりました。キャッチコピーはどうすれば表示されるのか?設定方法を解説します。AFFINGER52019/8/9AFFINGER5ヘッダー用メニュー(横列)のタイトル属性の設定法AFFINGER5(WING)のver20190801βより、ヘッダー用メニュー(横列)が設定できるようになりました。ヘッダー用メニュー(横列)では、タイトル属性でサブテキストも表示できますが、このタイトル属性が表示されないことがあります。AFFINGER52019/5/17AFFINGER5に「この記事は約何分で読めます」を表示する方法WordPressテーマ「AFFINGER5(WING)」の記事上に、自動的に「この記事は約何分で読めます」と表示させるカスタマイズをご紹介します。AMP2019/3/17AFFINGER5のAMPにスティッキー広告(追尾広告)を表示させる方法WordPressテーマ「AFFINGER5(WING)」のAMPページにスティッキー広告を表示させる方法を解説。AFFINGER52019/3/14AFFINGER5の404ページのカスタマイズ方法とサンプルWordPressテーマ「AFFINGER5(WING)」では、ウィジェットから404ページをカスタマイズ可能です。AMP2019/3/17AFFINGER5(WING)のAMPページカスタマイズまとめWordPressテーマ「AFFINGER5(WING)」のAMPページのカスタマイズ例をまとめました。AMPは機能に制限がありますが、カスタマイズをすれば少しはマシになります。