超絶簡単!!サルでも分かる、HTMLページにコメント欄を入れる方法

サルでもわかる超絶簡単なコメント欄導入方法

当サイト下部にも導入しているコメント欄の導入方法です。phpの知識が皆無で、サル並みの知能しか持たない私でも出来た超絶簡単な方法です。

HTML Comment Box

phpの知識が皆無な私は、htmlで作ったサイトにコメント欄を入れる事を諦めかけていました。

何故なら私は頭が悪いからです。

もちろんphpを勉強しようなんて気概もなく、「コピペだけでサクッと作れるコメント欄はないかなー」なんて甘い考えだったのです。

そして色々調べました。(調べる努力が出来るなら勉強しろよ!)

実はコピペで簡単に作れるコメント欄はいくつか見つけていたのですが、導入してみるとレイアウトが崩れたりするのです。

せっかくレスポンシブのテンプレ使ってるのに、スマホで見ると右端が切れて表示されてない等(それがこちらWebmasterTOOL.jp

「やっぱりサル並みの知識しかない私にはコメント欄を導入するなど無謀だったのか・・・」と諦めかけた時に発見したのがこちらです。

HTML Comment Box!!

HTML Comment Box

使い方は超絶簡単コピペのみ!

コピペだけで導入できるとは言えちょっとした手順があるので順を追って説明しますね。

海外サイトなので全て英語表記ですが本当に簡単なのでここで諦めないでください!

HTML Comment Boxをグーグルアカウントと同期1

まずは上の画像にある通りLOGIN/JOINのところをクリックします。

HTML Comment Boxをグーグルアカウントと同期2

するとこんな画面になるので、次にSign in with googleをクリックします。

グーグルアカウントと同期させることでログインできるので、グーグルアカウントを持っていない人は作ってください。

HTML Comment Boxセットアップ

次に出てくるのがこの画面です。

ここでは初期設定をするのですが、後からでも編集できるのでスルーでもOKです。

設定が出来たら左下のSAVEで完了です。

ログイン後に右上のACCOUNTボタンを押せばいつでもこの画面を出せます。

これですべての準備は整った!!

これで設定は完了しました!

HTML Comment Box GET THE CODE

左上のGET THE CODEをクリック!!

HTML Comment Boxタグ取得

するとタグが出現するので、それをコピーします。

そして自分のサイトのコメント欄を導入したい位置にペースト!

完 了 !

後はアップロードすればコメント欄が反映されている事でしょう。

スポンサードリンク

英語表記を日本語にしたい!

そのままでも十分使えると思いますが、コメント欄を日本語表記に変えたい!という人も多いかと思います。

そんな時はまず・・・

HTML Comment Box日本語表記に変更1

真ん中ちょい左上のTHEMESボタンを押します。

HTML Comment Box日本語表記に変更2

次に画面を一番下までスクロールしてadvanced optionsをクリックします。

HTML Comment Box日本語表記に変更3

出てきたタグを全てコピーして、自分のサイトのコメント欄を挿入した場所の真上に貼り付けます。

そして貼り付けたタグを編集して日本語を入力すれば、晴れて日本語表記に変更完了です。









え?どこをどう編集すれば良いかわからない?

そりゃそうだ!!ってことで、私のサイトに使っている編集済みの物を置いておきますね。

HTML Comment Box日本語表記に変更4

ちなみに「全ページ、又は複数のページにコメント欄を導入したい!」という場合でも、全て同じタグをコピペするだけです。

なのでインクルードで管理すると編集がぐっと楽になりますよ!

スポンサードリンク

コメントの管理

「コメントを削除したいときはどうすりゃいいんだ!?」

もっともな意見ですね。

コメントの削除は自分のサイト内でもHTML Comment Boxにログインすればできますし、HTML Comment Boxのサイトへ行けば一括管理できるので便利ですよ。

自分のサイトから

ヒャッハーが現れた!

自分のサイトからコメント削除1

まずは冷静にログインしましょう。

自分のサイトからコメント削除2

そしてヒャッハーの弱点である秘孔を突けば削除完了です。

HTML Comment Boxでコメントを一括管理

まずはHTML Comment Boxへ行き右上のボタンをクリックします。
コメントの一括管理1

ログインしていない状態ではLOGIN/JOIN・ログインしている状態ならACCOUNTと変化しますが、押すボタンの位置は同じです。

コメントの一括管理2

そして次にreceivedのボタンを押します。すると次のような画面が表示されます。

コメントの一括管理3

ヒャッハーの群れが現れた!

しかしこんな時でも焦っては行けません。冷静に弱点である秘孔を突いていきましょう。

ヒャッハーの数が多い場合は、奥義である百裂拳を用いて対処すると良いでしょう。

スポンサードリンク

まとめ

いかがでしたでしょうか。

英語表記という事を除けば、かなり簡単にコメント欄をhtmlの自作サイトへ導入することができると思います。

このHTML Comment Boxは基本無料ですが、コメント欄の下に出てくる「by Html Comment Box」のリンクを消すためには、有料の(1$/月)ライセンスを取得する必要があります。

ちなみにHTML Comment Boxで使うタグは自分のサイトのスタイルシートを参照しているので、画像が表示されない場合やレイアウトが崩れるといった場合は自分のサイトのスタイルシートを見直す必要があるでしょう。

関連記事

Comment Box is loading comments...

ページの先頭へ