jetpackとAll in One Seo が一緒だとSNSへ自動投稿ができない?

獅子魂で症状がでるのだが、jetpackでfacebookとinstagramへ投稿するときに、All in One Seoがプラグインで有効化しているとSNS側には投稿されなくなる。

両方のプラグインを利用して、インスタにもアイキャッチを送りたい場合は、ALL in One Seo のソーシャルネットワーク→facebookのデフォルトの投稿画像ソースをアイキャッチにするfacebookとinstagramにはこのアイキャッチ画像が投稿されることにする。

↑の状況では、ユーザー権限が管理者でないと、プラグインの問題なのか、instagramへはアイキャッチで登録している画像が流れなかった。管理者権限が必要!?

上記でダメな場合は、しかたがないので、All in one seoのプラグインを停止してheader.phpに下記記載する。facebook側への画像は投稿画像が入る。instaはアイキャッチ。

<title>獅子魂プロジェクト 日本一の獅子舞県・富山 <?php wp_title(); ?></title>

instagaramとfacebookページのアカウントを連携させる

下記の方法でinstaとfacebookを紐づけてから、jetpackで投稿連携の設定ができるようになる。jetpackはwordpressからfacebookページやinstagramへ自動投稿するために設定するが、設定の際にfacebookページとinatagram両方で共有設定がそちらでもされる?かも。そうでない場合は、facebookページとinstaの設定で互いのアカウントを紐づける設定をする。

https://tetemarche.zendesk.com/hc/ja/articles/360026951214-Instagram%E3%82%A2%E3%82%AB%E3%82%A6%E3%83%B3%E3%83%88%E3%81%A8Facebook%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%92%E9%80%A3%E6%90%BA%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95


FacebookページからInstagramへの共有


InstagramアカウントをFacebookページにリンクすると、以下のようなプラスアルファのメリットが得られます。

  • ページとInstagramとの間で投稿と写真をシェアできます。

FacebookページからInstagramアカウントをリンクしたり、リンクを解除したりする方法

  1. Facebookにログインして、InstagramアカウントにリンクするFacebookページに切り替えます
  2. Facebookページで、[管理]をクリックします。
  3. [プロフェッショナルダッシュボード]の左側メニューで、[リンク済みのアカウント]をクリックします。
    • アカウントをリンクするには、[アカウントをリンク]をクリックします。Instagramアカウントのユーザーネームとパスワードを入力し、[ログイン]を選択します。
    • FacebookページからInstagramアカウントのリンクを解除するには、[アカウントのリンクを解除]をクリックし、[解除する]をクリックして解除を確定します。

facebookからinstaへの投稿方法

facebookページからの投稿ではなく、Meta Business Suiteからの投稿となる。facebookページの左側のプランナー→右上の投稿を作成→ メディアと投稿の詳細から画像やテキストを投稿する。insta には画像の投稿が必要。テキストのみは投稿できない。

instaからfacebookページへの投稿

スマホからは、投稿時にシェア先としてfacebookページ先を選ぶことができる。あとは投稿する。



PCからの場合は、投稿したのちに、投稿画像を選択してシェア先からfacebookでシェアを選ぶ。

SNS間の連携について

https://creaone.jp/digital-marketing/sns-marketing/how-to-link-sns-and-service/#gsc.tab=0


Jetpack socila

Jetpack socialは月に30回のみ無料で使える

https://tohaz.com/jetpack-social-free-sharing/

https://rccrawlers.net/blog/jetpack-snap/

無料版は30回シェアに制限して、無制限で使いたい場合は有料版を使ってということですね。

今月は記事を12回投稿して、Facebook と Twitter に共有しているんで SNS への投稿が24回。さらに予約投稿を1回しておいたから26回シェアするところで今回のメールが届いたようです。

お金を払うほど Facebook と Twitter から人は集まっていないので無料範囲内での利用にします。

月が変わって更新

無料分を使い切った翌月、共有が2個増えました。予約投稿で SNS も自動更新できるのは便利です。

Jetpack ソーシャル 自動共有の解除方法

ダッシュボード左メニューの[Jetpack]内[設定]を押します。

上タブ[共有]内[Jetpack ソーシャル連携]の[投稿をソーシャルネットワークに自動共有]スイッチを切ると自動共有が解除できます。

Jetpack ソーシャル 自動共有の解除方法

投稿から自動共有の解除方法

投稿ページ右上の[Jetpack]を押します。

Jetpack メニューが開くので[この投稿を共有]を開いて[公開時に共有]スイッチを切ると自動共有が解除できます。

個別スイッチから SNS ごとの投稿を選択することも可能です。


Buffer

https://buffer.com/

ブラウザの管理画面からおこなう。無料プランは3つのSNSまで紐づけ可能。

https://ferret-plus.com/7933

New ChannelからSNSアカウントを紐づける

Publishing→Create postから投稿。各SNSのアカウントを選択して一括投稿可能。

記事を作って、各チャンネルから share Now ボタンをおすとそのチャンネルのSNS先へpostされる。

インスタとfacebook twitterの自動投稿連携

instagramから一括でtwitterとfacebookへ同時には投稿できない。

instagram→ twitter +facebook  ×
instagram → twitter ×
instagram → facebook 〇

twitter

イーロンマスクに買収されてからtwitterが他のアプリとの連携を停止しているので出来ないようだ

facebook

3:30~

※携帯からのみのうようだ PCでは出来ない

instagramのプロフィール画面から右上のバーガーメニュー→設定→アカウント→

他のアプリへのシェア→facebookを選ぶ→既存ページをリンク→リンクするfacebookページを選ぶ

【投稿時】
投稿する時にシェア先として上記で選んだfacebookページを選ぶことが出来るので選ぶとfacebookページ側にも投稿される。

facebook, instagram 広告

キャンペーン: 目的 (ランディングページに誘導 認知等)

広告セット: 予算やターゲットや期間を決める

広告: 広告をアップ設定する

ビジネスマネージャー

facebookピクセルとドメイン認証

https://meta.adregion.co.jp/facebook-ads/pixel-setting/

https://ppc-master.jp/labo/2018/12/fb_pixel.html

ビジネスアカウントの管理画面→広告マネージャー→バーガーメニューのビジネス設定→データーソース→ピクセル

ドメイン認承

ビジネスアカウントの管理画面→広告マネージャー→バーガーメニューのビジネス設定→ブランドセーフティ→ドメイン

インプレッション
ブラウザに表示された広告の回数

リーチ
投稿を見た人の数

 

ipadやiphoneでfacebookページの埋め込みやwordpressのfeedが表示されなくなった

https://ja.wordpress.org/support/topic/facebook%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AE%E5%9F%8B%E3%82%81%E8%BE%BC%E3%81%BF-2/

PCブラウザでは表示される。デバイスモード変えても表示されるがipadとiphoneのsarafiがios15アップデートでダメ見たい。

Facebookページをサイトに埋め込んでるけど、最近になってiPhoneとiPadのSafariで表示されないことに気がついた。 古い端末引っ張り出して確認したら、今まで通り正常に表示される。 iOS15とiPadOS15の不具合ってことかね。

この辺りの情報が怪しくて、iOS15でSafariが大幅にアップデートされたと言ことも関連しているかと思われます。

iOS15からSafariのプライバシー保護機能が変わったため事象がでているようです。

設定 → Safari → IPアドレスを非公開 → オフ

で改善しませんか?

トラッカーに非公開 では表示しないようです。

↑これだった。この設定をデバイスですると表示される。

因みに他の人が提案しているfremeでなくjavascriptで埋めたらどうなるかという提案があったがそれ試した人からのほうこくではタイムライン自体が表示されないとのこと。

facebook ページプラグインが表示されない

chromeで急に表示されなくなった。別のブラウザは表示されている。

原因はchromeに追加したプラグイン拡張が原因みたいだ。

https://ameblo.jp/m8dc/entry-12452142484.html

////////////////////////////

結局のところ今回の原因は何だったかと言うと、先日試しに追加したChromeブラウザのセキュリティ系の

拡張機能(アドオン)

で、

見えてなかったのは私だけ!

と言う落ちでございます orz …もし同じ拡張機能を使っている環境の人がいたら見えてないかも知れないけれど、マイノリティだと思うし対策の予算もないので、今回は 拡張機能外せば解決!と言うことで (´ω`)ノ

metamaskを外して、キャッシュクリアしたら表示された。その後metamaskをonでも表示もどっている

wordpress admin以外のユーザーではfacebookに連携ができない。わからん

石浦家具のishiura-information

 

admin以外のユーザーでもwordpress.comのアカウントでこの投稿を共有箇所から設定処理すればfacebookとも連携はとれた!そして管理者権限ではなく、編集者権限でも大丈夫。

admin以外のユーザーではfacebookへはpostが流れない。アカウントを別ユーザーでログインしてやろうとすると facebook共有箇所がでない。この投稿を共有箇所でアカウントに接続とでるが、wordpressCOMに接続になってしまう。わからない。多分jetpackを設定する何かと関連あるんだろうがわからない。

adminで対応してもらう。

 

 

※jetpackはwordpress.comが提供しているプラグインだからwordpress.comのアカウントが必要となる。あらかじめ紐づけても良いメアド準備すること。

 

JetpackでWordPressとSNSを連携!FacebookやTwitterに自動投稿する方法

facebookページ 管理者追加

石浦家具で行った。

 

相手のアカウントでログインしようとするとアクセスする場所が通常と違うロケーションなのでハックと間違えられるので、俺のアカウントを該当acebookページの管理者として加えてもらうようにする

 

該当アカウントに下記をお願いするか、新規でこちらでfacebookページ作る際には俺も共同管理するように設定する

 

facebookページの左サイドに 設定→ページの管理権限→新しいページの管理権限を割り当てに ask@cm-creation.net を追加

ask@cm-creation.netでfacebookログインするとお知らせに承認要求がきているので承認する

 

Facebookページに管理者を追加したい人へ!手順をご紹介!

【これで大丈夫!】 どうやってもfacebookにアイキャッチでogpが出力されない時! wordpress facebook

現段階では jetpackを使い、このやりかたでやっていく。

All in One SEOのソーシャルメディア機能は使わない!(facebookのogpが上手くいかないから。)

 

e-genjin-infoにて実装中

ishiura-informationにて実装中

 

プラグイン「All in One SEO」の設定とかでog:imageの設定をしてるとうまく反映されないので注意(マジで) All in one seoのソーシャルメディア機能ははずしておく

 

https://qiita.com/sola-msr/items/e73204bed06e9ab1da3a


下記の手順で行うと大丈夫。

まず、All in One SEOは使わないので、facebook for developersでアプリを作ったりアプリIDやユーザーIDを調べる必要がない。

 

※facebookページのページ名変更とtwitterのアカウント名変更は事前にしておいた方が良いとおもう。

①functions.phpへの記載

 

functions.php

//facebookとtwitterのOGP用

// URLからドメイン部分を削除したURLを返す
function delete_domain_from_url( $url ) {
if ( preg_match( ‘/^http(s)?:\/\/[^\/\s]+(.*)$/’, $url, $match ) ) {
$url = $match[2];
}
return $url;
}

 

②header.phpへの記述

header.php

head内に表記

<!–facebook用のOGP アイキャッチで表示–>
<?php if ( is_single() && has_post_thumbnail() ) : ?>
<!– 記事に設定されているアイキャッチ画像のOGP –>
<meta property=”og:image” content=”<?php echo home_url() . delete_domain_from_url(wp_get_attachment_image_src( get_post_thumbnail_id(), ‘full’ )[0]); ?>”>
<?php else : ?>
<!– デフォルトOGP –>
<meta property=”og:image” content=”https://e-genjin.jp/image/ogp.png“>
<?php endif; ?>

<!–twitter用のOGP アイキャッチで表示–>
<?php if ( is_single() && has_post_thumbnail() ) : ?>
<!– 記事に設定されているアイキャッチ画像のOGP –>
<meta name=”twitter:image” content=”<?php echo home_url() . delete_domain_from_url(wp_get_attachment_image_src( get_post_thumbnail_id(), ‘full’ )[0]); ?>”>
<?php else : ?>
<meta name=”twitter:image” content=”https://e-genjin.jp/image/ogp.png“>
<?php endif; ?>

※青い箇所はアイキャッチや投稿画像がない場合にデフォルトopg画像

<meta name=”twitter:card” content=”summary_large_image” />

<meta property=”og:title” content=”エネル原人 インフォメーション” />

※緑の箇所はtwitter用のカード設定とタイトル設定。これ表記するとアイキャッチがtwitterでも表示されるから必ず表記すること。なので↓の打ち消し線の状況を回避できる。

しかし、twitterにはデフォルトOGPが入らない。だからかならず投稿画像は入れてもらうようにした方がよい

※facebookへやアイキャッチからogpが挿入されたが、twitterには表示されなかった。twitterは投稿画像をアップするとそれがogpになった。facebookには投稿画像はogpにはならなかった。

 

 

以上これで下記の状態になる。↓

③表示結果

投稿画像→ twitterのみ
アイキャッチ→ facebookとtwitter
投稿画像なし アイキャッチなし → facebook  twitterにデフォルトOGP表示

 

 

【2020年版】Twitterカードとは?使い方と設定方法まとめ

 

 

 

OGPのサイズ

 

クライアントへのOGPのアイキャッチアップ方法のマニュアルはnew-ishiura/ドキュメント/インフォメーション編集方法.aiに記載

 

jetpackとの連携設定

 

SSL(https)化してないWordPressからFacebookに自動投稿したいなら「Jetpack」を使おう!

注意

admin以外のユーザーではfacebookへはpostが流れない。アカウントを別ユーザーでログインしてやろうとすると facebook共有箇所がでない。この投稿を共有かしょでアカウントに接続とでるが、wordpressCOMに接続になってしまう。わからない。多分ジェットパックを設定する何かと関連あるんだろうがわからない。

adminで対応してもらう。

 

埋め込んだfacebookページやgoogleカレンダーが表示されない理由

WebサイトやページプラグインでFacebookページが表示されない時は「公開範囲」を確認しよう

 

facebook 

 

FacebookページをWebサイトでも表示するには、Facebookページで次の3つのうち1つでも制限をかけていると表示されなくなります。

  • 公開範囲
  • 国別制限
  • 年齢制限

 

 

google カレンダー

 

Webサイトに埋め込むときの注意点

Webサイトの埋め込みコードは、パソコンのGoogleカレンダーでしか設定できません。スマホアプリには埋め込みコードを生成する機能はありません。また、Webサイトに公開させるカレンダーのアクセス権限が「一般公開」でないとWebサイトに埋め込みコードを貼り付けてもGoogleカレンダーは表示されないので注意しましょう。他のWebサイトに表示させるときは「Webサイト公開用カレンダーを作成」の手順2で「カレンダー作成」をクリックした後に「設定」をクリックして「カレンダーを一般公開する」に必ずチェックを入れるようにしてください

 

https://next.rikunabi.com/journal/20180401_s24/

Facebookページの適正カバー画像サイズ

https://kaori-creative.com/proper-cover-img-size-of-facebookgroup

【2019年】Facebookページの適正カバー画像サイズはこちら!

 

画像サイズ:幅820px 縦360px
縦横はPCとスマホサイズで大きい方を採用。
その画像の中に幅640px 縦320px の中に切れては困る大事な要素を入れる

 

 

Facebookページのプロフィールアイコン画像サイズ

  • PC表示:170×170ピクセル
  • スマートフォン:128×128ピクセル

instagram広告

facebookの広告マネージャーから設定する。instaはfbに買収されたので同じプラットフォームで設定。配信先をinstaに設定箇所ある。

instaに広告投稿するにはfacebookページのアカウントが必要。

スマホのinstaからも広告設定はできるようだが、漏れがあるので、PC版のfacebookの広告マネジャーからの方が良い

 

 

初心者でも簡単に出来る!Instagram広告の出し方を分かりやすくご紹介!

 

これさえ見れば大丈夫!Instagram広告のサイズ一覧

 

instagramのビジネスアカウントの作り方

https://ferret-plus.com/10740

facebook へのogp マスターテーマはnakao を使用すること(多分これで解決!)

チャンスメーカーのブログのcm-blogのogpがうまくいかず、(twitterは大丈夫だが、facebookには吐き出せないでいた。)index.phpやfunctions.php に備忘録で表記させている参照サイトのコード書いたり、他のテーマのkawaratをアップして チャンスメーカーのブログのogpをfacebookで表示させようと3日間トライしたがどれもだめ。

all in one でソーシャル設定してもだめ。(チャンスメーカーのinformationにあるall in one seoの記載はあっている。)

cm-blogのindex.phpにogpの関連記述してソースみたら出力されているが、facebookデバックをかけるとキービジュアルがでてしまう。設定したOGPの画像がでない!


下記でのテーマではきちんと表示された。

オリジナルテーマの nakao

nakaoをinformationにアップしてテーマをnakaoにしたらogpは大丈夫だった。やはりテーマファイルに関連したトラブルだった。twenty系でもogpは表示された。facebook側へもOK。

※cm-blogをnakaoにあわせて修正は大変なので、現在は直さずにいる。

all in one seo  と jetpack は必須。jetpackないとtwenty系でもogpは出せてもfacebookやtwitterには投稿できない

これからはブログを作るときのマスターには nakao コピーしてを利用していくこと!因みにnakao自体はphpにはopg用のコードを記載はなし、functions.phpにも記載ない。


facebookのアプリを作るときのサイトURLはブログのURLではなく、サイト自身のURL。

 


All in one seo のソーシャルメディア部分

※all in one seoはずしたらどうなるかわからんが、このように設定してるのでOGPがこのようになるんだとおもう。twenty系はそうなる。nakaoも。→all in one seoによって設定が反映されることを確認できた。

 

↑ ※OG:Imageソースを選択で コンテンツ内の最初の画像にしたら、アイキャッチでなくて、投稿箇所で初めに挿入した画像がogpとして表示されたことを確認できた。

 

wordpress の ogpの書き方

【WordPress】OGPとTwitterカードをプラグイン無しで設定する方法

※コピペ時うまくいかないときはダブるコーテーションがここからコピペするときに勝手に変換されて全角になっているかも注意

 

 

今回は、WordPressでプラグインを使わずにOGP設定をする方法とサンプルコードを紹介します。

1. OGPとは?

OGPとは、ページがシェアされたときに、アイキャッチ画像やタイトル、要約文などを魅力的に表示してくれる設定のことです。

OGPタグを設定した場合

例えば、OGPタグがちゃんと設定されていると、facebookでシェアされたときに、このようにカード形式でリンクを表示してくれます。

これならクリックしたくなりますよね。
TwitterカードもOGP設定と同じです。

 設定なし何も設定していないと…

こちらはTwitterカードの設定をしていない場合です。

 設定ありTwitterカードとは

こちらは、Twitterカードを設定している場合です。Twitterをやっている方ならきっと見たことがあるはず。

なお、Twitterカードについては別の記事でイチから詳しく解説しています。詳しい仕組みに興味のある方はぜひチェックしてみてください。

OGP/Twitterカードで設定するべきタグ

 をつけたタグが特に重要なものになります。

<meta property="og:url" content="ページのURL" />
<meta property="og:title" content="ページのタイトル" />
<meta property="og:type" content="ページのタイプ">
<meta property="og:description" content="記事の抜粋" />
<meta property="og:image" content="画像のURL" />
<meta name="twitter:card" content="カード種類" />
<meta name="twitter:site" content="@Twitterユーザー名" />

<meta property="og:site_name" content="サイト名" />
<meta property="og:locale" content="ja_JP" />
<meta property="fb:app_id" content="appIDを入力">

↑ ページがシェアされたときに、これらの情報をfacebookやtwitterのシステムが読みに来るわけですね。
og:type(ページタイプ)では、トップページなら「website」、記事ページなら「article」と入力します。
twitter:cardではカードの種類を実質2種類から選ぶことができます。画像が大きく表示されるように「summary_large_image」と入力するのがおすすめです(詳しくは先ほどリンクを載せたTwitterカードの解説を読んでみてください)。

 

2. OGPタグが設定されているかどうかを調べる

WordPressのテーマによっては、OGPタグがあらかじめ設定されています。また「All in One SEO Pack」などのプラグインを使って設定することもできます。
というわけで、まずは自分のブログにOGPタグが設定されているかどうかを調べましょう。こちらの手順はパソコンで行う必要があります。

手順1:記事ページを開く

記事ページを開く

まず記事ページを開きましょう。どのページでも構いません。

手順2:右クリック

ページ内のどこでも良いので、右クリックします。

手順3:「ページのソースを表示」をクリック

ほとんどのブラウザでは、右クリックしたときのメニューに「ページのソースを表示」というものがあるので、こちらをクリックします。

手順4:「og:」で検索

すると、そのページを構成しているHTMLタグがずらっと表示されます。拒否反応が出てくる方もいるかもしれませんが、グッと耐えてください(笑)

HTMLが表示される

ここで、Ctrl+Fのショートコードを実行します(Macなら+F)。これでページ内の文字列を検索できるようになります。

ogp設定

↑ まずは「og:」と検索してみましょう。<meta property="og:◯◯というようなコードが見つかれば、OGP設定が書かれています(正しいかどうかは別として…)。

逆に「og:」でヒットしなければ、OGP設定はされていないので下の手順で設定を行いましょう。

3. WordPressでプラグイン無しでOGP設定をする方法

今回はプラグインを使わずに、OGP設定をする方法を紹介します。設定するのは「トップページ」と「投稿ページ/固定ページ」のみになります。

 

 

/*********************
OGPタグ/Twitterカード設定を出力
*********************/
function my_meta_ogp() {
  if( is_front_page() || is_home() || is_singular() ){
    global $post;
    $ogp_title = '';
    $ogp_descr = '';
    $ogp_url = '';
    $ogp_img = '';
    $insert = '';

    if( is_singular() ) { //記事&固定ページ
       setup_postdata($post);
       $ogp_title = $post->post_title;
       $ogp_descr = mb_substr(get_the_excerpt(), 0, 100);
       $ogp_url = get_permalink();
       wp_reset_postdata();
    } elseif ( is_front_page() || is_home() ) { //トップページ
       $ogp_title = get_bloginfo('name');
       $ogp_descr = get_bloginfo('description');
       $ogp_url = home_url();
    }

    //og:type
    $ogp_type = ( is_front_page() || is_home() ) ? 'website' : 'article';

    //og:image
    if ( is_singular() && has_post_thumbnail() ) {
       $ps_thumb = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full');
       $ogp_img = $ps_thumb[0];
    } else {
     $ogp_img = 'TOPページ&アイキャッチ画像がないときに使われる画像のURL';
    }

    //出力するOGPタグをまとめる
    $insert .= '<meta property="og:title" content="'.esc_attr($ogp_title).'" />' . "\n";
    $insert .= '<meta property="og:description" content="'.esc_attr($ogp_descr).'" />' . "\n";
    $insert .= '<meta property="og:type" content="'.$ogp_type.'" />' . "\n";
    $insert .= '<meta property="og:url" content="'.esc_url($ogp_url).'" />' . "\n";
    $insert .= '<meta property="og:image" content="'.esc_url($ogp_img).'" />' . "\n";
    $insert .= '<meta property="og:site_name" content="'.esc_attr(get_bloginfo('name')).'" />' . "\n";
    $insert .= '<meta name="twitter:card" content="summary_large_image" />' . "\n";
    $insert .= '<meta name="twitter:site" content="ツイッターのアカウント名" />' . "\n";
    $insert .= '<meta property="og:locale" content="ja_JP" />' . "\n";

    //facebookのapp_id(設定する場合)
    $insert .= '<meta property="fb:app_id" content="ここにappIDを入力">' . "\n";
    //app_idを設定しない場合ここまで消す

    echo $insert;
  }
} //END my_meta_ogp

add_action('wp_head','my_meta_ogp');//headにOGPを出力

 

 

これでOGPタグがHTMLのheadタグ内に出力されるようになります。ただし、3箇所だけ書き換えを行う必要があります。オレンジの下線が引かれている部分です。

書き換え1:TOPページ&アイキャッチ画像がないときに使われる画像のURL

トップページがシェアされたときや、記事ページにアイキャッチ画像が登録されていなかったときに使われる画像のURLをこちらに貼り付けます。

サルワカくんの顔(通常)
サルワカくん

管理画面の「メディア」から画像をアップロードし、その画像の「URL」を貼り付ければOKです。

書き換え2:ツイッターのアカウント名(twitter:site)

<meta name="twitter:site" content="~" />content=""内にTwitterのアカウント名(ユーザー名)を入力します。
個人のツイッターアカウントでOKです。このとき@も含めるようにしましょう。
content="@saruwakakun"という感じですね。

書き換え3:アプリID(fb:app_id)

facebook向けのOGP設定として「fb:app_id」を指定するのが望ましいとされています(Facebookさん自身は「必須」と言っています)。これは、facebookでシェアされたときのクリックやインプレッションなどの解析ツールを使うために必要になります。
なのですが、このapp_idを取得するのが結構面倒なんですよね…。余裕のある方は「Facebook App IDの取得方法」を参考に取得してみてください。
取得したapp_idは、上述のコードの<meta property="fb:app_id" content="~">content=""内に入力してくださいませ。

OGPタグがうまく設定できたかどうかチェックしよう

facebookとTwitterそれぞれで、ちゃんと設定ができているかを確認しておきましょう。

↑facebookの確認はこちらから。調べたいページのURLを入力して「デバッグ」をクリックするだけ。うまく設定できていれば、以下のようにプレビューなどが表示されます。

facebookのogpデバッグ

うまく反映されないときは「もう一度スクレイピング」をクリックしてみてください。facebookさんが再度そのページを読みに行ってくれます。

↑次にTwitterです。こちらも同じようにURLを入力して「Preview Card」をクリックするだけでOKです。

OGPで表示される画像サイズチェックには・・・

「アイキャッチ画像サイズチェッカー」というものを使えば、Twitterやfacebookでシェアされたときにアイキャッチ画像がどのように表示されるのかをまとめてチェックすることができます。
ぜひご活用ください。