カメラマンコラム

Twitterのリンク画像を着せ替えする方法

Twitterにあげたリンク画像って、いったんアップしたら

2度と変更できないもんだって勘違いしていませんか?

Twitterの固定ツイに自分のブログをリンクさせてる方は必見!

今回は、ツイートした文章やいいねはそのままに、

画像だけを着せ替えする方法を紹介します

画像やそこに載せているキャッチコピーを任意のタイミングで変更できたら

リニューアル感も出せてアクセスアップも期待できます

この記事はこんな方にオススメ

★ツイートしたリンク画像を変更したい

★固定ツイに表示してるブログのアイキャッチ画像やキャッチコピーを変更したい

★投稿した記事のアイキャッチ画像がTwitter上で見切れている

★Twitterに投稿したリンク画像がうまく表示されない




 

 

事の発端

ブログ記事をTwitterで紹介する人って多いと思います

僕もそのうちの一人なんですが、アイキャッチ画像に挿入したキャッチコピーが

Twitter上だと無残に見切れてしまい、これが長年(?)の悩みの種になっていました

Twitterのスクショ画面

改善前の見切れたサムネ

見切れる理由はアイキャッチ画像のアスペクト比を4:3にしてるからで

Twitterでは16:9にすればちゃんと表示される事までは分かっていました

・・が、ブログ上での見やすさを考えるとこの設定は変えたくはありません

サイトのサムネ

4:3で見やすく設置されている

 

さて、そこで今回利用したのがこちら!!

Twitterデベロッパーの公式サイトから利用できる

Card Varidator です

CardValidator入力画面

これは、URLリンクした画像がTwitter上できちんと表示されているかを

確認するための検証ツールなんですが、応用すれば着せ替えツールにもなるんです

Card Varidatorは指定したURLにある見出し画像を取りに行く仕組みになっていて

これでTwitterがその画像を認識すると、Twitter上にある同じURLの画像も

自動で切り替わります

僕の場合の手順としては、一時的に4:3画像を16:9で作り直し、

それをCard Varidatorに読み込ませる事でなんなく解決できました

読み込ませたあとはまた4:3に戻しましたが、いったんTwitterが読み込んだ画像は

再度Card Varidatorで読み込ませない限り変わらないので心配ご無用です

 

作業手順

作業的には15分もあればできるのでそれほど難しい作業じゃありません

まずは修正したい記事のアイキャッチ画像をCanvaなどで作り直します

僕の場合はアスペクト比を変更するのが必須だったので16:9で作成です

Canva 画像作成スクショ画面

新たに16:9で作成している

出来上がったら、この画像を記事のアイキャッチ画像として一時的に変更します

 

変更したら、Card Varidatorへ記事のURLを入力して「PreviewCard」をクリックします

CardValidator URL入力

URLを入力する案内

 

読み込みが成功すると、このように右側に結果が表示されます

CardValidator 入力結果

きちんと入力されるとこのような画面が右側にでます

 

 

あとは1~2分待てば反映されるのでTwitter上で確認してみて下さい

 見切れがなくなり、これで悩みも解消です

Twitter修正後のスクショ

見切れがなくなりスッキリ掲載されている

 

Card Varidatorの本来の使い方

今回は応用した方法を紹介しましたが、

本来はTwitter上に正しく画像が表示できているかを確認するためのツールです

Twitterはたまに読み込みに失敗し画像が表示されない事があるので

そんな時の対処ツールにもなります

ご自分ではいつものようにURLを入れたはずなのに

ナゾにテキストで表示されたり画像が表示されなかった場合は

このツールで記事のURLを再度読み込みさせれば解決します

あ、そもそも論ですが、ブログにTwitterカードの設定をしていないと

何をやっても表示されないのでご注意を!

 




  • この記事を書いた人

晴れのち晴れ

在京キー局カメラマン/技術アドバイザー  ドキュメンタリー、バラエティー、各分野で活躍  手がけた著名番組多数  30年に及ぶ豊富な経験から映像ライフを楽しむ知識やアイディア、  海外ロケのスナップ紀行などを 紹介しています

-カメラマンコラム

Copyright© 晴れのち晴れブログ , 2021 All Rights Reserved Powered by AFFINGER5.