vdeep

*

vdeepはプログラミング、IT、Web技術、ライフハックの事などなどを管理人okutaniがつぶやくブログです。月間13万PV〜。

ブログ記事にTwitterのツイート&会話のやりとりを載せる方法

      2015/07/15

LINEで送る
Pocket

twitter-chat-in-blog
こんにちは、okutani(@okutani_t)です。 最近、やっとTwitterが使えるようになってきたSNS初心者な僕。

リアルでは友達が少ない僕でも、ありがたいことにTwitterでは多くの人と仲良くさせて頂いております。感謝であります。

それで今回は、TwitterでやりとりしたTweetを記事に載せてるブログをよく見かけるので、「どうやってるのかなー」と調べてみました。そしたらあっけない程かんたんでした。リンクを載せるだけで、1分もかからずできます(`・ω・´)

ではさっそく、その方法をみていきましょう。

スポンサーリンク

Twitterのつぶやきを記事に載せてみよう

では、Twitterのつぶやきをサイトに載せる方法を説明致します。

まずは記事に載せたいツイートを表示しましょう。スマホではなくPCじゃないとダメです(´;ω;`)

twitter-chat-in-blog

なぜ、「お家に帰ろう」とつぶやいたかは謎です…突っ込まないで下さい(´・ω・`)

ツイートに「・・・」となってるボタンがありますね。クリックしてみましょう。

twitter-chat-in-blog2

「ツイートをサイトに埋め込む」という項目を発見!

twitter-chat-in-blog3

このコードをサイトの表示したい場所にコピペするだけでOKです。すごいかんたん…( ´ ▽ ` )

↑貼り付けてみました↑

プラグインとか必要なのかなーとか思ってたので、なんだかかんたんすぎて得した気分

追記:

WordPressを使っている方で「うまく貼り付けできないよー」というお問い合わせがありました。WordPressブログでリンクを貼る場合はビジュアルモードではなくテキストモードで貼り付けましょう。

超かんたんに会話のやりとりを載せられる!

さらにさらに、超簡単に会話のやりとりを載せることができます。素敵です。

Twitter上で行ったやりとりを表示させます。

twitter-chat-in-blog4

なぜ「おっぱい」について会話したかは突っ込まないで下さい。僕にだってプライベートってものがありますので!(`・ω・´)

twitter-chat-in-blog5

先ほどと同じように「ツイートをサイトに埋め込む」を選択。

twitter-chat-in-blog6

こんな感じでTwitterの会話をそのまま丸ごと表示できます!すげぇ…テンション上がっちまったぜ…( ´ ▽ ` )へへへ

ちなみに「元のツイートを含める」のチェックを外すとおっぱいのみのツイートになります。

twitter-chat-in-blog7

これだと意味深なので、ちゃんとした会話のやりとりを表示させたいと思います。

これで、情報の伝達の齟齬を防ぐことができ、「会話が発展した上で発言した内容」だということが分かるため、僕が変態じゃないことが証明されました。

知らなかった人はぜひチャレンジしてみてください( ´ ▽ ` )ノ

まとめ

Twitterのつぶやきは超簡単にブログに使うことができます。

会話の流れが分かるよう貼りたい場合は、会話しているツイートからコードを取得すればOKです。

この記事が気に入ったら
いいね ! しよう

Twitter で
LINEで送る
Pocket

okutani (@okutani_t) のヒトコト
基本的に僕は紳士なので、「おっぱい」だなんてTwitterから話しかけちゃダメですよ。絶対ですからね!!!

 - BLOG, Twitter

スポンサーリンク

PC用AdSense

PC用AdSense

Share
  • このエントリーをはてなブックマークに追加

  こちらの関連記事もどうぞ

オフ会前に絶対やっちゃいけないTwitterの禁断技2つ

こんにちは、okutani(@okutani_t)です。Twitterって楽しい …

Twitterで呟いた記事に自動ではてブをつける → はてブ返しでアクセス数UP!

こんにちは、okutani(@okutani_t)です。ブログを初めてから、よく …

SEO見直したらアクセス数が3倍になった件

ハリネズミの記事を書こうと思ってるだけで、全く書いてないokutani(@oku …

[レスポンシブ対応] CSSでチャット風デザインを実装する

「好きなプログラム言語何?」と聞かれれば、ためらいなく「CSS」と答えるokut …

Ruby+nokogiriを使ってブログの過去記事をTwitterに投稿してみる

こんにちは、okutani(@okutani_t)です。本ブログ『vdeep.n …

自分のアクセスを完全に除外する「Google Analytics オプトアウト アドオン」

休日はMacBookAirでスタバってる(スターバックスでコーヒータイム)、ok …

hタグ下に斜めのストライプボーダーを設置&ボーダー画像の作り方解説

デザインセンスが皆無、見よう見まねでWebデザインやってる僕okutani(@o …

vdeepのトップページへ戻る画像です。風船の形をした島を女の子が掴んでいます。