Web Design

WordPress Jetpack「コメントフォーム」を設置する方法

ワードプレスのプラグイン「ジェットパック」のコメントフォームを設置する方法を紹介します。

Jetpack「コメントフォーム」を設置する方法

ワードプレスのデフォルトのコメント欄を、プラグイン「ジェットパック」のコメントフォームに変更する方法を紹介します。「ジェットパック」のコメントフォームは、デフォルトのコメント欄とは違い「SNS」のアカウントを使ってコメントを投稿する事ができるようになります。コメントフォームのデザインも、通常時は折り畳まれていてシンプルですっきりとした感じになるのでオススメです。下の画像はコメントを入力するときの「コメントフォーム」の状態です。

デフォルトのコメント欄を「ジェットパック」のコメントフォームに変更する方法は、まずワードプレスの管理画面の「プラグイン」から「ジェットパック」をインストールして「有効化」します。すると「ジェットパック」が管理画面のメニューに表示されるので「設定」から「ディスカッション」を選択して「Let visitors use a WordPress.com, Twitter, Facebook, or Google account to comment」と書かれた左のボタンをクリックして青いボタンに変えて設定を保存すれば設置完了です。「紹介からのコメント」でコメントフォームの上に表示される文字を変更したり、「配色」から「ライトカラー」「ダーク」「透明」を選ぶことができます。

ワードプレスのプラグイン「ジェットパック」のコメントフォームを設置する方法は、動画で分かりやすく紹介していますのでチュートリアル動画をご覧下さい。

Jetpack「コメントフォーム」の下に余白できる問題

ジェットパックのコメントフォームは、シンプルで使いやすいのですが問題が1つだけあります。各ブラウザ「Safari」「Chrome」「Firefox」で、新規でコメントフォームが設置されたページを訪れた時に「コメントフォーム」の下に余白スペースができてしまいます。

上の画像のように「コメントフォーム」の下に大きなスペースが空いてしまう現象ですが、初回のアクセスでページを見た場合(キャッシュが無い状態)だとこんな感じになります。ただ一度サイトにアクセスした後は、キャッシュが残っているので「コメントフォーム」の下に余白スペースは無くすっきりとした状態で表示されます。初回でサイトに訪れた人だけ、「コメントフォーム」の下に余白がある状態で表示されてしまいます。

Jetpackの「コメントフォーム」は、デザインがシンプルでコンパクトなところや、各SNS「Twitter」「Facebook」「Google+」のアカウントで認証してコメントができるようになるのが良いポイントですが、キャッシュが無い状態だと「コメントフォーム」の下に余白スペースが空いてしまう問題が非常に残念です。

この記事が気に入ったら
いいね ! しよう

Twitter で
Tags