こんにちは😀ブログ開設3日目の広瀬ユキです。
ここでは、初心者でもできるワードプレスへのTwitterの埋め込み方を書きます。
もくじ
Twitterにログイン
まず、Twitterにログインします。
自分のTwitterのURLを調べる
次に、自分のTwitterのURLを調べます。自分のTwitterを開いたら、検索バーにURLが記載されているので、それをコピーします。
表示されなければ、『https://twitter.com/』の後ろに、Twitterの＠マークの後ろを付けたものが、自分のTwitterのURLになります。
https://twitter.com/yuki_hirose_
https://twitter.com/ ➕ yuki_hirose_
このように『＠』の後ろを付け加えると、自分のTwitterのURLになります。
埋め込みコードを作成する
専用サイトにアクセス
HTMLコードを作成する
- Embedded Timeline
こちらはニュースのように流れる仕様です。 - Twitter Buttons
小さいボタンです。
サイズを変えたい場合
表示するサイズが大きすぎたり、長すぎる場合、表示サイズをカスタマイズすることができます。
Step.1
「set customization options.」を押します。
Step.2
タテとヨコのサイズを入力します。
今回は、タテHeight420(px) × ヨコWidth320(px)で設定しました。
他に、背景の色(Light or Dark)、アンダーバーの色、言語も変更可能です。
Step.3
「Update」を押し、コードをコピーします。
- 当ブログは、Height340(px)×Width330(px)でTwitterを埋め込んであります。
- Twitterを埋め込むときに、HTMLの編集画面でタテとヨコの数字を変えて、サイズを変更することもできます。
- Twitterを中央寄せしたい場合は、以下のように入力するとできます。
<div style="text-align:center">取得したTwitterのHTMLコード</div>
WordPressをカスタマイズする
カスタマイズの手順
当ブログは、WordPress有料テーマJINを使用しています。ウェジットの追加方法は、各テーマのマニュアルをご参照ください。
完成です‼‼‼
きちんと表示されているか、パソコンおよびスマートフォンで確認してみてください。
編集後記
今回はサイドバーに設置するバージョンで書きましたが、他の場所にも設置できるので、自由にサイトをアレンジしてみてください。なお、今回紹介した『ウィジェット』の『カスタムHTML』はワードプレスの新しい機能のようですね🙂
☆クリックで応援お願いします☆