2015-12-02

増田twitterを埋め込む方法: サンプル有り

twitterツイート増田に埋め込む方法を丁寧に書きます

*さっき一部の半角文字増田で書けないと書きましたが数値文字参照にすれば書けました。訂正します!教えてくれた人あんがとー!でもスーパーpre記法ではこのやり方通用しなかったのでシンタックスカラーは無し。

 

twitterから引用する埋め込みHTML要素を持ってくる

twitter.comに行き ツイートの ... ボタンを押す。ツイートサイトに埋め込むを押す。そうすると以下のHTML要素がコピー出来る。ここではサンプルにしても無害そうなifttt公式アカウントツイート引用します。

<blockquote class="twitter-tweet" lang="ja"><p lang="en" dir="ltr">Connect <a href="https://twitter.com/instagram">@Instagram</a> to <a href="https://twitter.com/Dropbox">@Dropbox</a> and automagically save every photo you post for safe keeping <a href="https://t.co/YVrgcSJZAD">https://t.co/YVrgcSJZAD</a> <a href="https://t.co/3vEiFZ3ADW">pic.twitter.com/3vEiFZ3ADW</a></p>&mdash; IFTTT (@IFTTT) <a href="https://twitter.com/IFTTT/status/662023324306837504">2015, 11月 4</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

増田を書く

まあ増田を書く

増田ツイートを埋め込む

先ほどのHTML要素のうち末尾のscript要素は引用する際,埋め込んだtwitter引用からはみ出て表示されるので邪魔です。取りましょう。

末尾のこれを取ります

<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

そうするとこうなります。これを増田にそのまま貼り付けてください。

<blockquote class="twitter-tweet" lang="ja"><p lang="en" dir="ltr">Connect <a href="https://twitter.com/instagram">@Instagram</a> to <a href="https://twitter.com/Dropbox">@Dropbox</a> and automagically save every photo you post for safe keeping <a href="https://t.co/YVrgcSJZAD">https://t.co/YVrgcSJZAD</a> <a href="https://t.co/3vEiFZ3ADW">pic.twitter.com/3vEiFZ3ADW</a></p>&mdash; IFTTT (@IFTTT) <a href="https://twitter.com/IFTTT/status/662023324306837504">2015, 11月 4</a></blockquote>

確認する

確認するボタンツイートが埋め込まれてないのであれ?と思うかもしれませんがそのまま「この内容を登録する」を押してください。

ツイートの埋め込みを確認する

増田タイムラインでも埋め込みツイートは表示されずたんなる引用として表示されます。あれ?となるけど書いた増田記事の本文URLを開いてください。本文を表示した場合のみツイートが埋め込みで表示されます

応用すると以下のようにツイート内にインラインされている動画増田にインライン出来るなど夢が広がりますね。あと増田コードサンプルを書くにはクソですね。

参考

増田Twitter引用法まとめ

増田では半角山括弧が使えない?

増田だとスーパーpre記法内で&をそのまま書けない件

はてな記法一覧 - はてなダイアリーのヘルプ

IFTTT(@IFTTT)さん | Twitter

アメコミ大全集(TM)(@amecomic)さん | Twitter

記事への反応 -
  • 増田だとスーパーpre記法内で&をそのまま書けない件

    &amp;amp;に変換されてしまう。書ける? &amp;amp; ちなみに、はてダだと書ける。

    • 増田にtwitterを埋め込む方法: 見づらいサンプル有り

      twitterを増田に埋め込む方法を丁寧に描きます。 注意:増田は<>&などが文字実体参照に変換されてしまいます(&なら&amp;などに変換される)。スーパーpre記法も使えません。HTML要素...

      • 増田講座

        トラックバック 増田では「トラックバック=返信」という扱いになっている。 Twitterにおける「@username」に近いかもしれない。 記事中のどこかに記事のURLを入れておけば、その記事に対...

        • http://anond.hatelabo.jp/20151210122244

          馬名 出生年 獲得賞金 オルフェーヴル 2008年 13億4408万円 ディープインパクト 2002年 14億5455万円 わー表出来たーすごーい!!!

        • anond:20170803152232

          どうやら、これらしい 増田講座

        • anond:20180520192402

          ヒント 増田講座 https://anond.hatelabo.jp/20151210122244

        • 増田の仕様で3000文字以上は投稿できないみたい?

          投稿した記事の最後の方が消えてたので、1つの記事を分割して、2つの記事に分けました。 増田は文字数が制限されていて、あまり長い文章を投稿すると、途中で切れてしまうみたい...

        • anond:20190319162051

          再現は諦めたのか &#60;&#62;に関しては下記を読めば化けずに書ける https://anond.hatelabo.jp/20151210122244 バックスラッシュの再現はフォントの問題だと思うけど俺には分からん、全角\で誤魔化...

          • anond:20190319162601

            こめんとありがとうございます。 化けてたので、画像にしましたー そう言われてみれば、半角になってたなぁと😺

        • 増田講座

          http://anond.hatelabo.jp/20071105082423 増田の使い方について、適当に書いてみることにするよ。 主観が入りまくってるからあんまり参考にはならないかもしれないけど。 とりあえず自由 自由...

          • http://anond.hatelabo.jp/20071105113746

            なかなか良いことが書いてあるので晒しアゲ、とかいう機能はないけどブックマーク代わり

          • はてな匿名日記二日目

            レスが0だったらどうしようとちょっとドキドキしてたんですが、はい。 無事、レスがついておりました。ぱちぱち。 ちなみにこれでレス0だったら 「匿名日記初心者に向けてのサクラ...

            • http://anond.hatelabo.jp/20071106200134

              It was a wrong number that started itまで読んだ。 20代、ということに驚きを隠せないでいる。素晴らしい文才(皮肉抜きで

            • http://anond.hatelabo.jp/20071106200134

              じっくる読む、だけ読んだ。 あんまりにも長すぎるからスクロールしつつ風景として見てたのに違和感に感じた俺はよく気がつく子。

            • http://anond.hatelabo.jp/20071106204257

              http://anond.hatelabo.jp/20071106200134 いつもは長文だと読まずに飛ばしちゃう俺だけど これは読めた!ふしぎ!

            • http://anond.hatelabo.jp/20071106200134

              まあ、いまの増田はたしかにチャット状態になってるよな。でも長文もけっこう多いんだぜ。チャット状態を楽しんでる奴らは、内心では「長文うぜー」って思ってるかもしれない。長文...

            • http://anond.hatelabo.jp/20071106200134

              いや、悪かったな。「朝つまんねぇ」が此個で引っ掛かるとは。 昨夜これ読んで反省した。あの日は休みで増田暦もまだ日の浅い俺は「今日は朝から覗けるゾ!」と昂揚気味だったんだ。...

            • おいしい香草焼きの作り方

              http://anond.hatelabo.jp/20071106200134 風呂行ってくる。・・・まで読んだ。 おいしい鳥の香草焼きの作り方 お肉大好き…でもカロリーが…という貴方のための料理。作り方は簡単、30分ぐらい...

              • http://anond.hatelabo.jp/20071107142959

                ありがとうチリの人。今回も面白なるほどの素敵な解説だー オーブントースターなら手軽にできていいな 胸肉は安いんだけど鳥はむ作るか親子丼ぐらいしか知らなかったんでやってみる...

              • 作ってみた

                おいしい香草焼きの作り方 http://anond.hatelabo.jp/20071107142959 おいしかったよー! 鳥はむみたいにほんのちょっとはちみつも加えてみた。 あと、オーブントースターでやるとヒーター部分に...

            • 匿名日記四日目

              今日は5時起きと言ってたがめざまし鳴って5時半にセットし二度寝した。 日記らしい文章で始めてみたんだが、三日目の日記・・・・ トラックバックできてなかったみたい・・・・ うっ...

              • 匿名日記さんへ

                http://anond.hatelabo.jp/20071108223512 自分独自のタグをつけてはいただけませんでしょうか。お願いします。

              • http://anond.hatelabo.jp/20071108223512

                五日目マダー?(AAry

                • 匿名日記五日目

                  よし、五日目。 ニコニコ見てたら遅くなった・・・・ 3日ぶりくらいにニコニコ見にいったのだが、 そこで俺は何故かR18のタグを押してしまっていたわけで・・・・ エロ動画サイトなん...

          • 興味があった記事特集4

            さてさて、興味があった記事を順次まとめていくコーナーも4弾です。(まぁ単純に私のブックマークをここにまとめてるだけなんだが…)面白い記事を厳選して集めているのでかなり参考に...

          • http://anond.hatelabo.jp/20071105113746

            以前のエントリーの増田講座を貼っとこう。書いたのは俺じゃない。結構同意してる。 http://anond.hatelabo.jp/20071105113746 俺的には思いつきの断片を書いてるなあ。ブログのように。ときどき...

          • 人生のスピード感

            増田使い方テスト 今日はいい天気 20代後半から40代までの人生のスピード感は異常と聞いた それを抑えるために結婚や子供を持つとかするのかな と思う今日この頃 http://anond.hatelabo.jp/...

            • 幸福感

              http://anond.hatelabo.jp/20080821090434 増田使い方テスト2 明日もいい天気 幸福感の得方は人それぞれ 腹いっぱい食べれれば感じる人 人を愛し愛されれば感じる人 ただ、最近はどうやったら...

          • http://anond.hatelabo.jp/20090116132608

            http://anond.hatelabo.jp/20090116132119 増田は「掲示板」じゃなくて「日記」だ。ひとつの場所にみんなが書き込んでいるのではなく、みんなが書き込んだものを一つにまとめているのに過ぎな...

          • 増田いいね

            http://anond.hatelabo.jp/20071105113746 自分には増田が一番合ってる。 Webは匿名だからいいと思ってた。 けど、最近は匿名の意味が違う気がする。そもそもブログのユーザID、mixiのID、2chのID、...

          • http://anond.hatelabo.jp/20090620181809

            これは、はてなのユーザビリティ不足ですね。一般人がはてな匿名ダイアリー(増田) に来ても確かに意味が分らないと思う。 ↓読むと少しは楽しみ方がわかるかと思います。 増田...

          • http://anond.hatelabo.jp/20071105113746

          • スクロールして固まらないですよ

            http://anond.hatelabo.jp/20111014190528 PCの問題ではないでしょうか? 悪いかなとも一瞬思いましたが、パソコンの性能の問題のような気がします。 ヘルプにも、ここにも↓載ってないけど...

          • http://anond.hatelabo.jp/20120704025539

            横だけで、長文でも日記でもチラシの裏に書く落書きでも、何でもOKなのが増田だろ? だいたいこのサイト、匿名「ダイアリー」ですよ。 いくらなんでも増田の言い分は野暮だわ。...

          • http://anond.hatelabo.jp/20160311124205

            ガイドライン的なもの ↓ 増田講座

      • http://anond.hatelabo.jp/20151210194905

        これツイッター埋め込みできてるの? メンテで無力化されたの? http://anond.hatelabo.jp/20151202154129

      • anond:20180402181606

        anond:20151202154129 これだった。

      • anond:20180922211952

        https://anond.hatelabo.jp/20151202154129 ほらよ

      • anond:20190609101845

        2015-12-02 増田にtwitterを埋め込む方法: サンプル有り https://anond.hatelabo.jp/20151202154129 これか。できたわ

    • 増田にtwitterを埋め込む方法: 見づらいサンプル有り

      twitterを増田に埋め込む方法を丁寧に描きます。 注意:増田は<>&などが文字実体参照に変換されてしまいます(&なら&amp;などに変換される)。スーパーpre記法も使えません。HTML要素...

記事への反応(ブックマークコメント)

アーカイブ ヘルプ
ログイン ユーザー登録
ようこそ ゲスト さん