トップページ > 記事閲覧
【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/16(Fri) 23:04 |
投稿者 | : Yujiro |
参照先 | : |
facebookにHAIKページのURLを投稿すると、そのページの冒頭画像がfacebookページに表示される。
その画像は・・・
1)アイキャッチのバックグランド画像
2)それがない場合はとにかくページで最初に現れる画像
すると、これらの画像はfacebookへの投稿を念頭に置いてデザインされるべき。
ところが、ページデザインと投稿用画像がデザイン的に両立しないことがある。
そこで結論としては Open Graph Protocol タグを #beforescript で強制的に書けば
自由に画像を指定できる。
必要なHAIKページの冒頭に以下を挿入
#beforescript{{
<meta property="og:image" content="facebookに表示したい画像のURL" />
}}
ただし、これを書くことはページのソース上では property="og:image"の二重定義になる。
(HAIK設定>ソーシャル連携>Open Graph Protocol タグを有効にする(ON)のとき)
これだと、自分で書き込んだ#beforescriptの内容が先に来て、規定値のオリジナル状態の物が後に来ることに
なっている。
どうやらfacebook側では先に定義された property="og:image を優先して取るようだ。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2019/05/20(Mon) 00:33 |
投稿者 | : Yujiro |
参照先 | : |
うみほしさん
情報ありがとうございます。
このあたりのこと、諸条件はどうでしょう?
例えば、HAIK側で・・・
テーマ編集の中でのアイキャッチ設定有無
各ページ専用の#eyecatch使用の有無
なお、私が提示している#beforescriptは、どのような画像でもそのURLを書けば
facebookの投稿にその画像をサムネールとして表示できると言うもの。投稿したい該
当ページ内にその画僧が貼り付けられている必要すらありません。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2019/05/19(Sun) 18:06 |
投稿者 | : うみほし |
参照先 | : https://umihoshi.com |
最近Facebookの仕様変更があったようです。
昨日,#beforescriptの記述のないブログのリンクをFacebookに貼り付けたところ,サムネイル画像が選べるようになっていました。
もちろん一発でサムネイルを拾ってくれないことも多いのですが,「画像を選べる」というのは大幅な進歩ですね。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2019/01/09(Wed) 21:31 |
投稿者 | : Yujiro |
参照先 | : |
トントンさん、詳細情報ありがとうございます。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2019/01/09(Wed) 15:49 |
投稿者 | : トントン |
参照先 | : https://kimono.tontonhouse.com/ |
【続き】
流れで投稿してしまいましたが、別のスレッドを立てるべきでしたね。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2019/01/09(Wed) 15:46 |
投稿者 | : トントン |
参照先 | : https://kimono.tontonhouse.com/ |
【続き】
1の"カード種類"は"summary"(QBlogのリスト表示のようなカード)または"summary_large_image"(QBlogのサムネイル表示のようなカード)のどちらかを記入
2の"@ユーザー名"はツイッターのアカウント名
1,2を"設定 > サイト情報の設定 > その他のタグ"に書き込みます。
これで設定完了です。TwitterでURLを書き込むと、自動でTwitterカードが挿入されます。
IFTTTやdlvr.itなどの自動連携ツールを使えば、QBlogの更新を自動でTwitterにカード付きで投稿できるようになりました。
https://twitter.com/kiyomi_tonton
情報ありがとうございます。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2019/01/09(Wed) 15:44 |
投稿者 | : トントン |
参照先 | : https://kimono.tontonhouse.com/ |
Twitterを検証しました。Twitterカードを使用する方法もできましたので、ご報告です。
【必要なheadタグ】
1.<meta name="twitter:card" content="カード種類" />
2.<meta name="twitter:site" content="@ユーザー名" />
3.<meta property="og:url" content="記事のURL" />
4.<meta property="og:title" content="記事のタイトル" />
5.<meta property="og:description" content="ディスクリプション" />
6.<meta property="og:image" content="画像のURL" />
3,4,6は、"設定 > ソーシャル連携 > Open Graph Protocol タグを有効にする”にチェックを入れればOK
5は、"Open Graph Protocol 設定 > サイトの説明”に記載するとディスクリプションが挿入されます。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/12/25(Tue) 02:35 |
投稿者 | : Yujiro |
参照先 | : |
ちょっとTwitterの方の裏技。
Twitterに画像付きページのURLを投稿すると、HAIKのデフォではページの
画像が小さいサムネール形式で表示。
この画像を大きい表示するには、以下の記述を「サイト情報の設定>その他のタグ」に
<meta name="twitter:card" content="summary_large_image" />
これでHAIKのどのページも大きい画像で投稿されます。
ちなみに、個別ページのみに適用したい時は、そのページに#beforescriptで
前述の一行を追加。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/19(Mon) 00:09 |
投稿者 | : Yujiro |
参照先 | : |
うみほしさん
あのfacebookシェアデバッガーはどうもわからん時があります。
HAIKではないのですが、ある無料ブログの画像がシェデバッガーの表示と
実際の投稿がどうしても合わないままということも。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/18(Sun) 17:41 |
投稿者 | : うみほし |
参照先 | : |
Facebookのシェアを試してみました。
シェアデバッガーで改めて情報を取り直すと,サムネイルが指定したとおりになりました!
これでサムネイルを指定したいときにはなんとかなりますね。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/18(Sun) 12:31 |
投稿者 | : Yujiro |
参照先 | : |
HAIK側のページのデザイン、使用している画像と、facebook、TwitterなどのSNSに投稿される画像
になぜこだわるかと言えば。
商用サイトの集客では、SNSに投稿される画像によって反応が全く異なることがわかっているからで
す。
良い反応を示す物はシェア、リツイートが多く起こりバズり易いのです。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/18(Sun) 12:18 |
投稿者 | : Yujiro |
参照先 | : |
Twitterの方も解決。
Twitter専用のOGPをそのページに無理やり書き込むだけ。
facebook、Twitter総合的には以下の通りに
#beforescript{{
<meta property="og:image" content="facebookに表示したい画像のURL" />
<meta name="twitter:image" content="Twitterに表示したい画像のURL" />
}}
1行目がfacebook他一般
2行目がTwitter専用
普通なら1行目のみでOKと思われるが、Twitterの方はなぜか専用行が必要な様子。
ちなみに、Twitterの方では一度投稿したページのサムネールをやり直すには以下のページへ行って画像取り直し。
https://cards-dev.twitter.com/validator
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/18(Sun) 11:31 |
投稿者 | : Yujiro |
参照先 | : |
この方法は今の所Twitterの方はダメなようです。画像なしで投稿されてしまいます。
ううむ、です。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/17(Sat) 21:46 |
投稿者 | : Yujiro |
参照先 | : |
追記
facebookに投稿して一度表示されてしまった画像を他の物に変えたい時、
とりあえずHAIKの方をいじりますが、facebook側でも操作が必要。
それは簡単。
1)facebookの該当記事の「日時」をクリック
2)画面右上に「・・・」のマーク出現、それをクリック。
3)出てきたリストの最下部「シェアした添付ファイルを更新」を選択。
Re: 【雑談】facebook投稿時の画像を差し替える裏技
投稿日 | : 2018/11/16(Fri) 23:08 |
投稿者 | : Yujiro |
参照先 | : |
Twitterの方ではどうなのか、未検証。もしかしたらダメかもなので要注意。