WordPress内にTwitter上の誰かのツイートを貼り付けて情報をまとめる。自分のアカウントのタイムラインをワードプレスのサイドバー等に埋め込んで読者を誘導する…これらの操作はプラグインを使わず簡単に行えます。
本記事では、このTwitterをワードプレス内に埋め込む方法をいくつかまとめています。まずは手順から先にご覧ください。
WordPress内にツイートを埋め込む | ①ツイート右下のメニューを選択 ②ツイートを埋め込むをクリック ③埋め込みコードをコピー ④テキストエディタでペースト |
---|---|
WordPress内にタイムラインを埋め込む | ①Twitter Publishを開く ②アカウントURLを入力 ③サイズ等をカスタマイズ ④埋め込みコードをコピー ⑤ウィジェット設定を開く ⑥テキストウィジェットに埋め込みコードを貼り付け |
WordPressの記事内にTwitterを埋め込む方法
まず最初にワードプレスの単一記事内にツイートを埋め込む手順をお伝えします。
Twitterでブログに張り付けたいツイートを見つけたら、ツイート右上のメニューをクリックします。
メニューを開いたら「ツイートを埋め込む」を選択しましょう。
ページが切り替わったら少し下にスクロールすると、htmlコードが現れます。
「Copy Code」と書かれたボタンを押してコードをコピーしてください。
ワードプレスの記事作成画面に戻ったらビジュアルエディタからテキストエディタに切り替えて、先ほどコピーした埋め込みコードをペーストしてください。
ビジュアルエディタに戻すと上記のような状態で表示されていますが、プレビュー画面で記事を確認してみると正常に埋め込まれているので安心してください。
続いては、アカウントのタイムライン自体をワードプレス内に埋め込む方法を解説します。
自分のアカウントのタイムラインを埋め込む
ブログ内で自分のTwitterアカウントを埋め込んでおけば、あなたに興味を持ってくれたユーザーを誘導できるかもしれません。
ここでは、ワードプレスのサイドバーにTwitterのタイムラインを埋め込む手順を解説します。
タイムラインのソースコードを取得する
まずは、ツイート埋め込みでも登場した「Twitter Publish」にアクセス。
Twitter Publishを開いたら入力欄が現れるので、そちらに自分のTwitterアカウントURL(https//:twitter.com/ユーザーid)をペーストしてください。
here are your display optionsと表示されたら、左の「Embedded Timeline」を選択。
これでソースコードを取得できるのですが、デフォルトの状態だとタイムラインが長すぎてワードプレスの表示が崩れるケースがあるため、続けてカスタマイズを行います。
埋め込みコードの上部の「set customization options」をクリック。
続けてHeight(px)を設定。300~400くらいの範囲で入力するのがベターです。
こちらのカスタマイズで設定する項目はこのHeightだけで問題ありませんが、念のため全て説明しておくと…
Height | 高さ |
---|---|
Width | 横幅 |
How would you like this to look? | 通常表示 or ダークモード |
What language would you like to display this in? | 言語 |
こんな感じですね。一番下の言語に関してはAutomaticから変更する必要はありません。
カスタマイズが完了したら「Update」をクリックしてください。
ソースコードが表示されるので「Copy Code」をクリックしてコピーしましょう。
これで埋め込みコードの取得は完了ですね。続いては、実際にワードプレスに埋め込む手順を解説します。
ウィジェットにコードを挿入しよう
タイムラインをサイドバーに埋め込みたい方が大多数かと思います。
まずは、外観⇒ウィジェットの順に操作してください。
ウィジェットの設定ページを開くと「サイドバー」と記載された項目があるので、そちらにタイムラインを追加していきます。
このサイドバーの中にテキストウィジェットを追加します。
テーマによってはTwitter用ウィジェットなども用意されているかもしれません。
テキストウィジェットを追加したらビジュアルエディタからテキストエディタに切り替えます。
続いて、先ほどコピーした埋め込みコードを貼り付け。最後に保存をクリックして完了です。
WordPressにTwitterを埋め込む手順まとめ
記事内にTwitterのツイートを埋め込む方法は非常に簡単なので、情報をまとめたり、誰かの意見を引用したい場合は上記の手順を参考にしてみてください。
また、タイムラインの埋め込みに関しては、お使いのテーマによって若干操作が異なりますが、基本的な流れはほぼ同じかと思います。
タイムラインの高さを調節しながら自分自身のアカウントを埋め込んでみてください。
【関連記事】
● WordPressにTwitterのツイートとTLを埋め込む方法
● WordPressにインスタグラムを埋め込む方法と著作権について
● Twitterで時間・曜日を指定し予約投稿できる無料アプリを紹介
コメント