オキシジェンビルダーにTwitter/Xプロフィールを追加する方法(簡単ガイド)
クリック・ソーシャル

ClickSocialを使ってWordPressから直接ソーシャルメディア投稿をスケジュールする

無料トライアル開始 アングルライト
ホーム ブログ オキシジェンビルダーにTwitter/Xプロフィールを追加する方法(簡単ガイド)

オキシジェンビルダーにTwitter/Xプロフィールを追加する方法(簡単ガイド)

酸素ビルダーにtwitterxのプロフィールを追加する方法

ツイッターのコンテンツをより多くの人に見てもらいたいなら、ウェブサイトに追加するのがいい解決策になる。

より多くのフォロワーとTwitterの交流を得ることに加えて、オキシジェン・ビルダーのウェブサイトに魅力的なコンテンツを追加する素晴らしい方法です。

手動でTwitterのコンテンツを埋め込むのはとても面倒なので、私が普段Oxygen BuilderにTwitterのコンテンツを追加する方法を紹介します。たった5ステップで数分で完了します。

酸素ウェブサイトにTwitterフィードを追加する最も簡単な方法

手動でTwitterプロフィールを追加することは、さまざまなウェブサイトを行き来し、埋め込みコードの束を扱うことを意味する。

その代わりに、プラグインを使ってTwitterのコンテンツを自動的に取得し、Oxygen builderに追加することができます。

プラグインを使用したtwitterフィードの例

数あるTwitterフィード・プラグインの中で、私がTwitter Feed Proを選んだ理由はいくつかある:

  • Twitter Feed Proは、Oxygen Builderやその他の一般的なサイト・ビルダーと完璧に連動します。
  • このプラグインは、あなたのフィードを最新のツイートで自動的に更新します。
  • このツールはスピードのために作られているので、オキシジェンのウェブサイトはこれまでと同じように速く読み込まれます。
  • フィードは自動的にオキシジェンビルダーのウェブサイトのデザインをコピーします。
  • また、ユーザーフレンドリーなライブエディタとともに、大量のカスタマイズオプションが用意されている。
ユーザーレビュー

多くの機能があり、簡単に操作することができます。以下では、OxygenウェブサイトにTwitterプロフィールを追加する手順を説明します。

オキシジェンビルダーにTwitter/Xプロフィールを追加する方法

ステップ1: Twitter Feed Proのインストールと有効化

まず、あなたのウェブサイトにインストールする前に、ここでTwitter Feed Proプラグインを入手することができます。

WordPressのプラグインをインストールし、有効化する方法については、こちらのステップバイステップガイドをご覧ください。

ステップ2:Twitterフィードを作成する

今すぐWordPressのダッシュボードから始めることができます。

Twitterフィード " すべてのフィード メニューを開き、新規追加ボタンをクリックします。

カスタムツイッターフィードを追加

その後、作りたいTwitterフィードの種類を選ぶことができる:

  • ユーザーのタイムライン選択したTwitterプロフィールのツイートを表示
  • ハッシュタグ選択したハッシュタグを含むツイートを表示します。
  • 検索:検索語を選んで検索結果を埋め込む

ここではユーザータイムラインを取り上げるが、フィードタイプでもプロセスは同じだ。

フィードの種類を選択したら、「次へ」をクリックします。

フィードの種類

ステップ3:Twitterプロフィールに接続する

Twitterプロフィールを接続することで、プラグインが関連ツイートを取得し、サイトに表示することができます。これも素早く簡単なプロセスだ。

開始するには、ポップアップの接続 ボタンをクリックします。

ツイッターアカウントをワードプレスに接続

そうすると、プラグインがウェブブラウザ上でTwitter/Xを開きます。

ここから、Authorize appをクリックしてプロフィールを接続します。

ツイッターの読み取り専用アクセスを許可する.jpg

そうすると、あなたのウェブサイトに戻ります。Twitterのプロフィール、ハッシュタグ、検索キーワードを選んでフィードを表示することができます。

この例ではツイッターのハンドルネームを入力します。

ここに情報を入力し、「次へ」をクリックするだけです。

twitterフィードを埋め込む

ステップ4: ツイッターフィードをカスタマイズする

新しく作成されたTwitterプロフィール・フィードは、あなたのOxygenウェブサイトのデザインを自動的にコピーします。ウェブサイトのデザインや配色を慎重に選んだ場合、非常に時間の節約になります。

さらに、テンプレートをインポートしてTwitterフィードのデザインを素早く変更することもできる。

ユニークなレイアウトの7種類のオプションからお選びいただけます。

  • デフォルト
  • 石工カード
  • シンプルなカルーセル
  • シンプルなカード
  • ショーケース・カルーセル
  • 最新ツイート
  • ウィジェット

テンプレートを選んだら、「Next」をクリックする。

フィードテンプレートを選択する

テンプレートをインポートした後、ライブエディターを使ってさらにデザインをカスタマイズすることができます。

このエディターからレイアウト、ヘッダー、ボタンデザイン、フォントサイズ、配色などを変更できます。

どのように機能するのか、興味深いオプションをいくつか紹介しよう。

ライブフィードエディタ

まずはツイートのレイアウトを変えてみよう。

左からフィードレイアウトオプションを開いて開始します。

フィードレイアウトオプション

そうすると、左側のパネルにさらなるカスタマイズ・オプションが表示されます。

フィードのレイアウトは3種類から選ぶことができる:

  • リスト:公式サイトのようにTwitterのプロフィールを1列に表示します。
  • メイソンリー行と列を使って大量のツイートを一度に表示する
  • カルーセル:ツイートをインタラクティブなスライドショーとしてサイトに埋め込む

レイアウトを選び、「保存」をクリックして変更を確定します。

フィードレイアウトを選ぶ

行や列の数など、他のレイアウトオプションもここから変更できます。変更が終わったら保存するのを忘れないように。

続行するには、「カスタマイズ」をクリックします。

カスタマイズ・オプションのツイッターに戻る

さて、レイアウトの設定が終わったところで、色をカスタマイズする方法を紹介しよう。

左側のパネルから、配色 オプションを選択します。

配色オプション twitter feed pro

素早く色を変えられるように、好みの配色を選ぶことができる:

  • テーマから継承します: Oxygenウェブサイトの色をコピーする
  • 明るい: 明るい背景に暗いフォント
  • Dark:暗い背景と明るいフォント
  • カスタム: 手動で色を選ぶ

前回同様、色の設定が終わったら、変更を保存することを忘れないでください。

ツイッターで配色を選ぶ

残りのオプションを使ってTwitterフィードを詳細にカスタマイズすることができます。ご覧の通り、ライブエディターはとても使いやすく、すべての変更内容を簡単に記録することができます。

デザインを保存したら、いよいよ最後のステップに進む。

ステップ5:Oxygen BuilderにTwitterプロフィールを埋め込む

上部の埋め込み ボタンをクリックすると、このTwitterフィードの埋め込みを開始できます。

ツイッターフィードを埋め込む

Twitterフィードの埋め込みオプションがポップアップで表示されます。ここからフィードをページ、サイドバー、フッターに追加できます。

Oxygen Builderの場合は、代わりにCopyをクリックすることができます。

twitterフィードのショートコードをコピーする

Twitter フィードが必要な特定の Oxygen Builder ページがあれば、今すぐそれを開くことができます。

代わりに新しいページを使うには、ダッシュボードエリアからページ " 新規追加 メニューを開いてください。

次にテンプレート編集をクリックし、オキシジェン・ビルダーでページを開きます。

酸素ビルダーのページを編集する

このページにコンテンツを追加するには、左上のプラス(+)アイコンをクリックします。

酸素ビルダーに新要素を追加

それをクリックすると、検索バーのある新しいパネルが表示される。

バーに"shortcode "と入力し、下のショートコード ・ブロックをクリックするだけです。

ここで、Full Shortcode フィールドを探し、先ほどのショートコードを貼り付ける

そうすると、Twitter Feed Proが自動的にTwitterプロフィールをこのページに埋め込みます。

酸素にYoutubeショートコードを追加する

このページに他のコンテンツを自由に追加してください。オキシジェン・ビルダーはとても使いやすく、1行もコードを触ることなく多くのことができます。

見栄えに満足したら、それを公開すれば、訪問者はツイートをチェックできる。

diviサイトでのtwitterフィードの例

これで、オキシジェン・ビルダーのウェブサイトにTwitterのプロフィール・フィードができました。関連性のあるツイートを表示することで、訪問者の興味を引きつけ、同時にソーシャルメディアでの存在感を高めることができます。

さらに、このプラグインを使って、ポジティブな製品レビューを埋め込んだり、ユーザーが作成したコンテンツを表示したりすることもできます。このように、Twitter Feed Proはあなたのソーシャルメディアマーケティングツールキットに加えることができます。

Twitter Feed Proはこちらからダウンロードできます

Twitterをもっと活用したい方は、Twitterマーケティングツールのベストリストをご覧ください。

その他のソーシャルメディア・ガイドとチュートリアル

著者アバター
サジャン・シャルマ シニアライター
WordPress、ソーシャルメディアマーケティング、オンラインビジネスについて10年以上執筆。専門分野はインフルエンサーマーケティング、コンテンツキュレーション、デジタルマーケティング戦略など多岐にわたる。

コメントを追加する

コメントをお寄せいただきありがとうございます。すべてのコメントはプライバシーポリシーに従って管理され、すべてのリンクはnofollowであることにご留意ください。名前欄にはキーワードを使用しないでください。個人的で有意義な会話をしましょう。