有名なブロガーさんみたいに自分のツイートを記事に載せたい！
すっごく簡単にできるよ！
本記事の内容
- ツイートを載せるメリット
- cocoonでツイートを載せる方法
- HTMLコードで載せる方法
こんにちは、リドです。
私は現在、初心者ブロガーで活動しています。
全ての記事ではないですが、自分のツイート記事に入れることがあります。
ツイートと記事を連携することにより双方からユーザーを獲得することを目指しています。
本記事は「cocoonで簡単に埋め込む方法」と「HTMLコードを生成する方法」を解説します。
自分のツイートをブログ記事に埋め込む
多くのブロガーはブログとTwitterを同時に運用しています。
自分のツイート内容から記事を書く場合も出てくるでしょう。
記事にツイートを載せると下記の可能性があります。
- Twitterの宣伝効果
- ツイートをみた人がブログを見る
- ツイートと記事が一致する
など総合的に網羅できます。
では、手順ごとにツイートを記事に埋め込む解説をします。
Cocoonでツイートを埋め込むやり方
Cocoonは15秒でできます。
(＊当ブログはブロックエディタでの説明になります)
ワードプレス側で、
埋め込み > Twitterアイコンを選択。
ツイッター側でツイートのURLを取得。
ワードプレス側で検索ボックスにURLをコピペすれば完成。
Cocoonだと簡単だね！
埋め込み用のHTMLコードを生成する
まず、Twitter側で作業します。
載せたいツイートの右上端にある「下矢印」を選択。
ツイートを埋め込むを選択してください。
すると、HTMLコードを生成するTwitter公式のサイトに飛びます。
自動でコードが生成されているのでクリックすればコピー完了。
「What would you like to embed?」の検索ボックスにTwitterのURLを貼り、HTMLコードを生成するやり方もあります。
他にもオプション機能もあります。
「set customization options.」をクリックする。
How would you like this to look?
（翻訳：ツイートの背景を白か黒か選択）
What language would you like to display this in?
（翻訳：言語の変更）
Hide Conversation
（翻訳：リプを隠す）
Opt-out of tailoring Twitter
（翻訳：フォローボタンの設置）
また、検索ボックスに何も入れずにスクロールすると、下記の画面になります。
Or browse your options below
（翻訳：または以下のオプションを参照してください）
Embedded Tweet
（翻訳：埋め込みツイート）
Embedded Timeline
（翻訳：埋め込みタイムライン）
Select the button you’d like to use
（翻訳：使用するボタンを選択します）
いずれかのオプションを選択し、ツイートのURLを検索ボックスに入れるとHTMLコードが生成されます。
多数のカスタマイズもできますのでお好みでどうぞ。
ワードプレス側でHTMLを埋め込めば表示されます。
Twitterとブログを連携しよう
- cocoonで簡単に埋め込む方法
- HTMlコードを生成する方法
今回の記事は上記の内容を解説しました。
Cocoonでは埋め込み用のブロックがあるので、ツイートのURLで簡単に設置することができます。
カスタムしたHTMLで好みのツイートを貼り付けるやり方もポイント。
色々、試してみてください。
コメント