- Twitterで自分のブログ更新したのをお知らせした際、画像をクリックすれば記事のページが開くようにしたい。
- WordPressのプラグイン[All in One SEO]を使えば簡単に設定できるけれど、OGP設定だけ必要でほかのものは使わないから、プラグインは使いたくない。
- プラグインは使いたくないけど、購入したWordPressテーマにOGP設定がついていない。（本記事の使用しているWordPressテーマはSTORK１９を使用しています。）
- 初心者でもどこに何を入れればいいかわかれば簡単にできる。
OGP設定（Twitterカード設定）をすると何が変わる？
OGP設定（Twitterカード設定）前のツイート
長男（小4）シールコンプできたか気になるのに、画像を押しても画像が表示されるだけで記事を読みにいけない。
【呪術廻戦×ビックリマン 呪術廻戦マンチョコの箱買い開封】のあとの水色になってるリンクの部分を押さないと記事ページにいけないよ。
長男えっ。その一部分だけ？
押しにくいし、押していいのかすら迷う文字…。
僕は用心深いから押せないや。
OGP設定（Twitterカード設定）後のツイート
長男母さん、今度は画像押すと記事が読めるようになってるよ。
ふむふむ…。
箱で買ったのに１枚コンプできなかったのか。
OGP設定をするには？
長男ねぇ、母さん。僕にはちっともわからないけど…。
①も②も③も何言ってるの？
ちなみに、ママもしっかりはわかってないよ。
IT苦手、PC苦手だからね。
長男えっ。じゃぁ、どうやってできたの？
とりあえず、
①はママの購入したテーマ「STORK１９」には入ってなかったから×
②はプラグインを入れてみたけど、Twitterカードを使いたかっただけなのにほかにもいろんな機能がついててわからなかったのと、ほかに入れてるプラグインと機能が重複してる警告がでたから使いたくなかったの。
長男じゃぁ残りはよくわからないHTML？を使うの？？
そもそもそれ何？
コロンHyper Text Markup Languageのことだよ。
うん？横文字言われても、何か説明されても理解できない。
とりあえず、HTMLについてもは何の事かわかっていないけど、ある決められたものを記事にいれればいいだけらしいよ。
長男ふ～ん。
実際にやってみる（方法だけ知りたい方はこちらまでとんで下さい。）
<meta property=”og:url” content=”ページのURL“>
<meta property=”og:type” content=”article“>
<meta property=”og:title” content=”記事タイトル“>
<meta property=”og:description” content=”記事の説明文“>
<meta property=”og:site_name” content=”ブログ名“>
<meta property=”og:image” content=”画像のURL“>
<meta name=”twitter:card” content=”summary_large_image“>
<meta name=”twitter:site” content=”@からはじまるTwitterのユーザー名“>
- うえのわからない文字たちをコピーします。
- WordPressの記事を書きます。
- いつも通り、記事を普通に書きます。
- 記事が書き終わったら、その記事にもう一つブロックを追加で「カスタムHTML」を追加します。（本記事は、テーマSTORK１９でブロックエディタ Gutenberg（グーテンベルグ）使用してます。）
- ＋ボタンからブロック追加で、表示に「カスタムHTML」がなければ検索に「HTML」で検索すれば出てきます。
- [HTMLを入力…]のところに、①でコピーした上のわからない文字たちを貼り付けします。
- 最後に黄色マーカーの部分をTwitterカードで表示したい記事の内容や自分の情報に書き換えます。
- 公開を押して記事を完成させます。
- Twitterカードが表示できるか【Twitter Card Validator】で確認します。
- ネット検索で「Twitterカード 確認」や「ツイッタ―カード 確認」で検索するとでてくるので、こちらのサイトで[card URL]のところに記事のURLを入力し。
- [Preview card]のボタンをクリック。
- カードが表示されればOKです。
緑マーカーの部分はカスタマイズできる部分で、上のものはページの種類・下のものはTwitterカードの種類を変更できるんだって。
面倒だから私はこの形で作ってしまえば、もう動かさないけど…。
長男まぁまぁしないといけないことがあるんだね。
③は確認だから必ずしないといけないわけではないみたいなんだけど、③しないと出なかったり、コピーしてはったものの文字が消えてたり書き間違えたりしてうまく表示されなかったりすることがあるから、一応確かめたりしてるよ。
あとがき
長男でも、母さんやっぱりプラグイン使った方が早かったんじゃないの？
いやぁ、なんとなくいらないかなっと思っちゃったんだよ…。
WordPressのテーマもJINにするか悩んでたんだけど、悩んで答えだす前に勢いでSTORK１９買っちゃったから…。
どちらのテーマも１万越えするし、
使い込んでもないうちからJINのほうがいいかもって変えちゃうのもあれだから、
STORK１９もJINもきっと初心者には優しいテーマらしいから、
使い込んでみないとわからないもんね。
うんうん。
*最終的に現在はＳＷＥＬＬに変更してます。
長男母さん、ホントはJINがほしかったの？
なんか自分に言い聞かせてる感があるよ？
ＳＴＯＫ１９も気に入ってるんだよ。
ふんわりした可愛い雰囲気がだせて好き☆
にほんブログ村
コメント（お気軽にどうそ☆）