thorWordPressGoogleプラグインブログにtwitterを埋め込む方法〜画像付きで解説をします〜2019年8月12日2020年5月22日ブログ運営ブログ運営HOMEブログ運営ブログにtwitterを埋め込む方法〜画像付きで解説をします〜こんにちは、テンテン(@tentenmaru77)です。今回はブログやWebサイトにtwitterのツイートやタイムラインを埋め込む方法について解説をします。ここでは大きく3つに分けて解説をしていきます。1投稿記事にTwitterのツイートを埋め込む方法2フッターやサイドバーにTwitterのタイムラインを埋め込む方法3Twitterのフォローボタンを設置する方法Tentenわかりやすく、はじめに今回解説する3つの事例を以下画像で載せておきます。1投稿記事にツイートを埋め込む事例2フッターやサイドバーにtwitterのタイムライン埋め込む事例3Twitterのフォローボタンを埋め込む事例1投稿記事にTwitterのツイートを埋め込む作業時間:約1〜3分2フッターやサイドバーにタイムライン埋め込む作業時間:約5分ほど3Twitterのフォローボタンを埋め込む作業時間:約3分ほどでは早速、解説に進みます。さいごにブログの投稿記事にtwitterのツイートを埋め込む方法まず、投稿記事にツイートを埋め込む方法についてです。1埋め込みを行いたいツイートを見つけ、赤矢印の箇所をクリックします2「ツイートを埋め込む」を選択します。Code」をクリックします。4「×」をクリックしますツイートのコードはコピー出来たので、後はブログに貼るだけです。投稿記事にツイートを埋め込みます。5WordPressを開き、埋め込みたい記事に対して、「テキスト」をクリックします※「ビジュアル」にコードを張り付けても表示されません。6コピーしたコードの貼り付けを行います。これでtwitterのツイートの埋め込みは完了です。念の為、プレビューで確認してみましょう。『俺のブログ運営』では、サイドバーにタイムラインを埋め込んでいるので、その方法で解説をします。※フッターに入れる場合においても、基本的な作業は同じです。THORを入れておりますので、多少異なる点があるかと思いますが、基本的な作業な同じです。https://publish.twitter.com/こちらから設定を行います。赤枠の箇所に、twitterのタイムラインのURLを入力して、「→」をクリックします。options」をクリックします。3タイムラインのサイズ調整を行います。入力した際、青枠で囲っている箇所が自動的にサイズが変わります。これが実際のサイズとなりますので、好きなように調整してください。ちなみに当ブログでは、Height500px、width350pxで設定しておりますのでご参考までに。4「Update」に進みます。Code」をクリックして、コードをコピーします。これでタイムラインのコードをコピーすることができました。Tenten後は、ウィジェットにタイムラインのコードを埋め込むだけです。頑張りましょう!6WordPressを開き、「外観」→「ウィジェット」に進みます。※今回は、サイドバーにタイムラインを設置していきます。フッターエリアにおいても基本な作業は同じです。THORのテーマを使用している為、若干表示が違う可能性がありますが、基本的な作業は同じです。サイドバーエリアやフッターのエリアなど、好きな場所に設置することができますので、お好みな場所に設置しましょう。7「タイトル」を入力して、「テキスト」に進み、さきほどコピーしたタイムラインのコードをペーストします。タイムラインのプログラミングコードは、必ず「テキスト」にペーストしましょう。最後に忘れずに「保存」してくださいね。最後に、うまく表示されているか「プレビュー」から確認してみてください。最後に、Twitterのフォローボタンを埋め込む方法についてです。Tenten基本的には、先ほどのTwitterのタイムラインを埋め込む方法と同じなので簡単に説明をしていきます。Buttons」を選択します。2好きなフォローボタンを選択します。3フォローボタンのコードをコピーして貼り付けします。貼り付けの方法や場所は、先ほどTwitterのタイムラインを埋め込む方法で解説していますので、ここでは省略します。さいごにブログにTwitterを埋め込む3つの方法は理解できましたでしょうか?下記の記事では、ブログ記事にユーチューブ動画を入れる方法を解説しておりますので、もし良かったらご参考にください。あわせて読みたい記事(画像付)ブログやWebサイトにYouTube(ユーチューブ)を埋め込む方法こんにちは、テンテンです。今回はブログやWebサイトにユーチューブ動画を埋め込む方法を解説していきます。【ブログ記事にユーチュ[...]最後まで読んでいただき、ありがとうございました。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。運営者情報Tenten当ブログでは、ブログ運営していく中でインプットしたことをアウトプットメモしています。THORの使い方、SEOなどについて発信中。ブログ初心者の方にもわかりやすく画像付きで解説しています。俺のブログ運営.お問い合わせシェアメニューTOPへ。