【コピペでOK】Facebookシェアボタン(画像付き)を超簡単にブログに設置する方法

いまやブログとFacebookって切っても切れないモノあると思っててですね。

両者ともいいとこ悪いとこがあって、なんかそれをお互いで補完し合いあっているというかなんというか。

例えばブログの更新通知をFacebookにアップしてブログに来てもらうとか、逆にブログの読者をFacebookやFBページに誘導するとか、いろいろな面で使い勝手がいいと感じてます。

今回ブログを新しくしたついでに、記事の一番下に「Facebookシェアボタン」を設置してみました。

設置したといっても個別記事に直貼りしてるだけなんですけどね。

Facebookシェアボタン02※記事の一番下に貼ってみました。

このボタンはタグをそのまま記事ページに貼ってるだけなので、テーマいじってゴニョゴニョとかすることもなくソースコードをコピペするだけで設置可能です。

ご自分で用意するのは「記事URL」と「ボタンに使う画像」だけなんでとっても楽チンですよ。

【コピペでOK】Facebookシェアボタン(画像付き)を超簡単にブログに設置する方法

今回作ったFacebookシェアボタンのコード

記事に貼ってるソースコードはこんな感じ。

<center><a href="http://www.facebook.com/sharer.php?u=https://matsuoyuki.jp/2016/01/29/wordpress-facebook-share-button/" rel="nofollow" target="_blank"><img src="https://matsuoyuki.jp/wp-content/uploads/2016/01/4a86d309e15eef1858604c392be1750c.png" alt="Facebookシェアボタン" /></a></center>

上のコードをそのままコピペすると下のようなシェアボタンになります。

Facebookシェアボタン

※クリックするとFacebookシェア画面に変移します。

ボタンのデザインはMacのKeynoteで作ってみましたよ。

Facebookシェアボタン03

ベースとなるソースコード

ベースとなるソースコードをコピーして編集

<center><a href="http://www.facebook.com/sharer.php?u=【記事のURL】" rel="nofollow" target="_blank"><img src="【画像のURL】" alt="Facebookシェアボタン" /></a></center>

ベースとなるソースコードはこちら。

二箇所ある「【〇〇のURL】」を任意のURLに変更してくださいな。

「画像のURL」ってなんなん?

http://〇〇.com/wp-content/uploads/2016/01/4a86d309e15eef1858604c392be1750c.png

写真を記事内に入れ込むと自動的に付与されるURLがあるんですけど、Wordpressだと上のがそれ。

▼「画像のURL」は、メディアライブラリーから任意の画像を開いてここの場所にあります。
Facebookシェアボタン04

URLをコピーしてソースコードに貼ってください。

まとめ

毎回記事に貼る手間はかかるけど、コードをコピペさえしておけばシェアボタンを簡単に設置することができます。

注意することは、【記事URL】だけは毎回変更しなくちゃダメですよ。

WordPressであれば記事の編集画面の一番上、その他のブログサービスではどうなんだろう?

やはり一度記事を公開してから生成されたURLをコピペすればいいのかしら。

Facebookシェアボタン




オーダー似顔絵受付中!

クールな「ポートレート調似顔絵プラン」とポップな「コミック調似顔絵プラン」をご用意しました。
また、2種類の似顔絵プランがセットになった「2パック似顔絵プラン」がお得です!

ポートレート調

似顔絵プラン

¥6,000

追加=¥4,000/人

表情に多少のアレンジを加えますが

基本的には素材そのままの似顔絵です

クールな印象

バストアップ

コミック調

似顔絵プラン

¥6,000

追加=¥4,000/人

全体的に大幅なアレンジを加え

二頭身のキャラクターにします

ポップな印象

全身

2パック

似顔絵プラン

¥10,800

追加=¥7,200/人

ポートレート調とコミック調の

2つのプランをパックにしたものです

単体で2種類オーダーするより10%お得


コメントを残す

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

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

ABOUTこの記事をかいた人

家族とイラストとブログが大好きな東京在住3人子持ちガテン系のお父さん。
心から好きなことを楽しみながら生きていくことを決めた マツオユキの公式ブログです。
詳しいプロフィールはこちらからどうぞ!