Twitter等のウィジェットをWordPressに貼り付ける方法

i_t

こんにちは、WEBマーケティングのお手伝いをしているインファクトの加藤です。
今回は、お客様から「Twitter等のウィジェットをWordpressに表示させるにはどうしたらいいの?」というご質問を頂いたので、やり方を紹介します。

目次

  • 気をつけること
  • Twitterのコードを取得する
  • WordPressにコードを貼り付ける
  • 表示を確認
  • まとめ

気をつけること

まず、貼り付ける前に気をつけておくことがあります。
コードを貼り付けるために、Wordpressの「管理者」でログインをすることになります。
「管理者」はWordpress本体やプラグインの更新をすることができる権限を持っています。
更新通知があるからといって、更新ボタンを押すのは絶対にやめましょう。
更新をしたことで不具合が生じる場合があります。

img_09

↑の画像に書かれているボタンは絶対押さないようにしましょう。

Twitterのコードを取得する

それでは、Twitterのコードを取得しましょう。
PCからTwitterにログインをしてください。

ログインをしたら、画面右上の「①自分のアカウントのアイコン」→「②設定」を選択してください。
次に画面左側のメニューに表示されている「③ウィジェット」をクリックしてください。

ウィジェットをクリックしたら「新規作成」をクリックしてください。

What would you like to embed?(何を埋め込みたいですか?)と表示されます。
入力フォームの中にウィジェットで表示したいTwitterのURLを入力してエンターキーをたたいてください。

表示方法が2パターンでてきます。
今回は左のパターンで作成してみます。
左の枠をクリックしてください。

Twitter_Publish

コードとプレビューが出てきます。
「Copy Code」をクリックしてコピーしてください。

WordPressにコードを貼り付ける

img_05コードを取得したら、Wordpressに管理者でログインをしてください。
ログインをしたら、左メニューにある「外観」→「ウィジェット」を選択してください。

img_06この画面からサイドバーにTwitterのウィジェットを追加することができます。
「テキスト」と書かれているボタンをサイドバーに「ドラッグ・アンド・ドロップ」してください。

img_07「テキスト」をサイドバーに持ってきたら、先ほどコピーしたTwitterのコードを貼り付けてください。
貼り付けをしたら「保存」をクリックして完了です。
タイトルは任意のタイトルを入れましょう。

表示を確認

最後にブログの表示を確認しましょう。

img_09無事にサイドバーにTwitterのタイムラインが表示されればOKです!

まとめ

初めての方でも簡単にTwitterのウィジェットを貼り付けることができると思います。
ただ、冒頭で書いたように更新ボタンだけには注意をしましょう!

  • シェア
  • twitter
The following two tabs change content below.
加藤 拓

加藤 拓

企業のメディア化アドバイザー株式会社インファクト
「WEB集客&企業のメディア化アドバイザー」の加藤です。
ホームページからの集客でお困りの方や売上アップのお手伝いをするためにアドバイザーとして「企業のメディア化」の立ち上げをサポートしています。
元々WEB制作スタッフとして仕事をしていたのでHPの構造も知っていますので、コアな部分を踏まえてお手伝いさせて頂きます。これからもお客様のお役に立てるような情報を発信していきます。
  • twitter
  • このエントリーをはてなブックマークに追加
  • Pocket
PAGE TOP
LINE it!