otoyo / easy-notion-blog

✍️ Let's start your own Notion Blog easily. / Notion Blogを始めましょう!

Home Page:https://easy-notion-blog-otoyo.vercel.app/blog

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

質問:デフォルトogimageの設定

herohoro opened this issue · comments

document-headコンポネントのurlOgImageの値に画像リンクを追記後
null部分を以下のように変更しました。

スクリーンショット 2022-02-10 14 17 49

herohoro@8fa6d3e

deploy直後にツイッターで確認してみましたが反映されずの状態で投稿させていだたいております。
少し待てば反映されますか?
それとも変更の仕方が間違えている部分がありますでしょうか?

以前 #17 (comment) で一度お伝えしたと思いますが Twitter Card Validator で該当ページのURLを入力してプレビューしたでしょうか?
Twitter は og-image をキャッシュするので Card Validator でキャッシュを更新してあげる必要があります。

貼っていただいたコミットのコードは問題なさそうです。

早速のご対応ありがとうございます。
そして過去のIssueリンクまで添付してくださり感謝感謝です。

#17 を改めて見返して気づきました。
今回nullと記載があった部分。前回は'空'でしたが・・・
「urlOgImageがあったら使ってね」っていうメッセージが込められていたんですね。。

Card Validatorはキャッシュを更新してくれる機能がありましたか・・・。
開発画面のようなお試しページだと思い込んでおり、
「テストしないで本番で確認すればいいかな〜」と軽率な行動を取ってしまいました(^_^;)

新規投稿時に入れたサムネを後から変更したい場合にも
このキャッシュ更新機能のCard Validatorを使えば過去ツイートも反映される・・・といった便利ツールだったんですね(; ・`д・´)

デフォルト画像の設定で2度もお騒がせしてしまい申し訳ありませんでしたm(_ )mm( _)m

Next.js は React というフレームワークを拡張して使われていますので、React について学ぶとコードをより深く理解できると思います。
https://ja.reactjs.org/docs/conditional-rendering.html