By: JoshSemans
「Wordpressにツイッターのツイートを貼り付けるのはとても簡単」といってはばからなかった@web_shufuです。ですが、Centeringしようとして見事に躓いたたので手順をメモします。
Tweetを左寄せで埋め込む-1
まず、twitterに行って、埋め込みたいtweetの「開く」または「画像を表示する」を右クリックしてURLをコピーします。
後は以下のような形式のURLをwordpress編集画面に貼り付けるだけです。
https://twitter.com/web_shufu/status/313156504402395136
結構綺麗に整形されたtweetが左寄せで表示されます。
本日更新記事： 事業用ではない、生活用口座の取引明細も仕訳帳に改造する http://t.co/qPJ6biM00u
— ウェブシュフ（一応は勉強アカ。社労士してます。） (@web_shufu) March 13, 2015
この方法はとても簡単です。でも中央揃えや右寄せが出来ません。
Tweetを左寄せで埋め込む-2
ところで、Tweetを左寄せで埋め込む方法にはもうひとつあります。
まず、埋め込みたいtweetの「その他」をクリック、その後「ツイートをサイトに埋め込む」をクリックします。
すると、コードが表示されるのでコピーします。
コード
コピーしたコードはこんな感じです。wordpress編集画面で、Tweetを埋め込みたい場所にコード貼り付けます。
<blockquote class="twitter-tweet" lang="ja"><p>本日更新記事： 事業用ではない、生活用口座の取引明細も仕訳帳に改造する <a href="http://t.co/qPJ6biM00u">http://t.co/qPJ6biM00u</a></p>— ウェブシュフ (@web_shufu) <a href="https://twitter.com/web_shufu/status/576365845728903168">2015, 3月 13</a></blockquote>
表示
すると以下のようにTweetが左寄せで表示されます。
本日更新記事： 事業用ではない、生活用口座の取引明細も仕訳帳に改造する http://t.co/qPJ6biM00u
— ウェブシュフ (@web_shufu) 2015, 3月 13
最初に紹介した方法と全く同じ表示になりますが、この方法はワードプレス以外でも使えるオーソドックスな方法です。
これに少し手を加えるとセンタリングや右寄せが出来ます。
Tweetを中央に埋め込む
上のコードのclass=”twitter-tweet”をclass=”twitter-tweet tw-align-center”に変えると、Tweetが中央によります。
本日更新記事： 事業用ではない、生活用口座の取引明細も仕訳帳に改造する http://t.co/qPJ6biM00u
— ウェブシュフ (@web_shufu) 2015, 3月 13
Tweetを右寄せで埋め込む
また、tw-align-centerをtw-align-rightに変えると、Tweetが右寄せになります。
本日更新記事： 事業用ではない、生活用口座の取引明細も仕訳帳に改造する http://t.co/qPJ6biM00u
— ウェブシュフ (@web_shufu) 2015, 3月 13