Facebook いいね!ボタン追加の修正

以前にFacebookの「いいね!」ボタンをサイドバーにウィジェットで追加してたけど、ウィジェット内では<?php the_permalink(); ?>が効かなくて、記事に対しての「いいね!」はダメだったので、「php」に直接書き込んだので、覚書。

まず、いの一番に https://developers.facebook.com/docs/reference/plugins/like/ に飛んで自分用の「いいね!」ボタンを作る。

URL to Like
掲載したい自分のWEBアドレス。

Send Button
Sendボタンを付けるかどうか。

Layout Style
・Standard

・Button_count

・Box_count

Width
ボタン領域の幅(幅が狭いと数字部分が消えます。)

Show Face
ボタンの下に顔写真の表示・非表示

Verb to disolay
おすすめボタンの選択
・like =いいね!
・recommend =おすすめ

Color Scheme
・light

・dark

Font
フォントの選択(英数字のみ)

Get code
全て決定したら、クリックでコードをゲット。

うちは、iframe版で使用してるのでそれを使います。

<iframe style="border: none; overflow: hidden; width: 200px; height: 21px;" src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fnishimura-speed.com%2F&send=false&layout=button_count&width=200&show_faces=true&action=like&colorscheme=light&font&height=21&appId=xxxxxxxxxxxxxxx" height="240" width="320" frameborder="0" scrolling="no"></iframe>

出力された部分の「http%3A%2F%2Fnishimura-speed.com%2F」をWordpressでは「<?php the_permalink(); ?>」に変更。(phpで貼込まれた部分のURLが自動生成されます。)

出力された部分のXXXXXXXXXXXXXXX部分はFacebookの自分のIDです。(Facebook側で自動生成されま。)

上記を修正したものを「sidebar.php」の任意の場所なり、「index.php」の任意の場所にデザインに合わせて貼付けて終わり。

<span style="color: #ff0000;"><code><?php the_permalink(); ?></code></span>

の部分が表示されたページのURLに変わって表示されます。

静的ページの場合、出力された部分「http%3A%2F%2Fnishimura-speed.com%2F」を各ページのURLに手打ちで修正をかけると、各ページ個別で「いいね!」ボタンが配置できます。


この投稿へのコメント

コメントはありません。

コメントを残す

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

この投稿へのトラックバック

トラックバックはありません。

トラックバック URL