Facebookシンプルないいねボックスをサイト(WordPress)へ埋め込む方法

facebook-いいねボックス




LINEで送る
Share on LinkedIn
Pocket

facebook簡単ないいねボックスの作り方

この様な、Facebookのシンプルないいねボックスを作る方法と、ホームページに貼る方法をご紹介します。

 

この画像の場合、いいねボックスではなくて「いいねボタン」と呼ばれるものになります。

 

シンプルないいねボックスが欲しいなと思って色々試していたら満足いく形になりましたので今回は画像の様なシンプルないいねボックスの作り方ということでご紹介させていただきます。このまま読み進めて作業すれば、Facebookのイイネボタンの作り方もマスターできます。

 

(正式ないいねボックスの作り方についてはこちらをご覧ください。)

 

 

 

Facebookのシンプルないいねボックスの作り方とホームページに貼る方法

動画と併せてご覧いただくことで作業を進めていただけると思います。

 

 

 

こちらFacebookのLike Button pluginにアクセスします。

Like Buttonのページにアクセスします。

 

 

facebookページにシンプルないいねボックスを実装する方法

 

①Like Buttonを選択します。

Social PluginsからLike Buttonを選択します。

 

 

URLを入力します。

Facebookボタンを貼りたい自分のウェブサイトやFacebookページのURLを選択してください

 

 

③standardを選択します。

Layoutをstandardに選択します。

ここで、いいねボタンのみに設定することも可能です。

 

 

④チェックボックスを入れておきます。

Show Frend’s Facesにチェックを入れると、「イイね」してくれた人の顔が表示されます。

 

 

 

⑤チェックボックスを入れておきます。

Include Share Buttonにチェックを入れておくことで「シェア」ボタンが表示されます。

 

 

⑥ここまで出来たら「Get Code」をクリック!

①〜⑤までを設定したら「Get Code」をクリックして貼り付けるためのコードを表示させます。

 

 

⑦2. Place the code for your plugin wherever you want the plugin to appear on your page.の方のコードをコピーします。

facebook-laike-button-creat-howto

 

 

⑧コピーできたら貼り付けたいウェブサイトへ移動します。

先ほどのイイねボタンのコードをコピーできたら、貼り付けたいサイトの編集画面へ移動して、HTML編集で貼り付けたい場所へペーストします。

 

 

 

WordPressの貼り付ける方法

WordPress管理画面 > 外観 > テーマの編集

 

・テーマの編集へ移動したら、単一記事の投稿(single.php)や固定ページのテンプレート(page.php)を開いて、好きな場所にコードを貼り付けて「ファイルを更新」をクリック。

(それか、記事の投稿画面からテキストエディタに切り替えて貼り付けても表示させることができます。)

 

ここまで出来たら、いいねボタンが反映されているか確認してみましょう。

 

 

 

LINEで送る
Share on LinkedIn
Pocket

よく読まれている記事




facebook-いいねボックス

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

ABOUTこの記事をかいた人

嶋耕作

ライター、自主制作アニメも作ったりしている。自身が主催してきたイベント企画で培った集客運営等のノウハウを使ってサイトやYouTubeなどメディア運営のサポートを行っている。