ブログ

【すぐできる!】wordpress にtwitterを埋め込む方法【初心者向け】

こんにちは!都内在住の子持ちサラリーマン、のんびりコアラです。

今回はWordPressにTwitterを埋め込む方法をご紹介します。

3つあるのでタイプ別に確認してみてください。

こんなやつですね。

  1. 投稿記事に埋め込むタイプ

  2. タイムラインを埋め込むタイプ

  3. プロフィールに埋め込むタイプ

 

それでは順にやり方を解説します!

いずれもかなり簡単にWordPressにTwitterを埋め込むことが出来ますよ~!

投稿記事に埋め込むタイプ

Twitter側の操作

Twitterを開き、貼り付けたいTweetの右上「…」をクリックします。

「</>ツイートを埋め込む」と出てくるので、クリックします。

 

Twitter Publishに移行するので、そのままコードをコピーします。

これでTwitter側の操作は終了です。

WordPress側の操作

WordPress側の操作では、Twitter側でコピーしたコードをそのままテキストに貼り付けるだけです。

投稿記事のテキストをクリックして、Twitterコードをそのまま貼り付け。

反映後の本文↓

かなり簡単ですね^^

サイドバーにTwitterのタイムラインを埋め込むタイプ

Twitter側の操作

まずはTwitter Publishに移動しましょう。

埋め込みたいURLを聞かれるので、ご自身のTwitterアカウントURLを入力します。

その後は案内に従って順々にクリックしていきます。

今回はタイムラインを埋め込みたいので、左側をクリック。

 

コードをコピーします。

これでTwitter側の操作は終了です。

WordPress側の操作

次はWordpress側の操作です。外観⇒ウィジェットを開きます。

 

ウィジェットを開いた後は、テキストをサイドバーの好きな箇所にドラッグ&ドロップします。タイトルを付けて、Twitterコードを貼り付けて保存をすれば完了です。

かなり簡単ですね^^

反映後のサイドバーはこんな感じです。

サイドバーのプロフィールにTwitterを埋め込むタイプ

Twitter側の操作

先ほどと同様、まずはTwitter Publishに移動しましょう。

埋め込みたいURLを聞かれるので、ご自身のTwitterアカウントURLを入力します。

その後は案内に従って順々にクリックしていきます。

今回はTwitterフォローのボタンを埋め込みたいので、右側をクリック。

 

順に出てくるフォローボタンをクリック。

ここでは、コードをコピーする前にオプションを選択します。

右上のオプションボタンを選択し、ユーザーネームを隠し、ボタンを大きくしましょう。

表記も日本語表記に。

 

アイコンが変わったことを確認後、コードをコピーしましょう。

WordPress側の操作

WordPress側の操作は、タイムライン埋め込みの時と同様、ウィジェットより操作します。

今回はあらかじめ用意していたサイドバーのプロフィールにフォローアイコンを埋め込む形としてみます。

タイムライン時と同様、サイドバーのプロフィール箇所に、twitter側にてコピーしたコードを貼り付けます。

今回は、Twitterアイコンをセンターに持ってきたいため、コードの始めに<center>、終わりに</center>を入力しています。

かなり簡単ですね^^

プロフィール欄にTwitterフォローアイコンが追加されました。

纏め

今回はWordpressにTwitterを埋め込む方法3つについて説明しました。

  1. 投稿記事に埋め込むタイプ
  2. タイムラインを埋め込むタイプ
  3. プロフィールに埋め込むタイプ

いずれも操作は簡単ですが、最初はサイドバーなどの操作に慣れるのに時間がかかります。

Wordrepressの操作感に慣れる練習と思って頑張ってみてください!

それでは!

error: Content is protected !!