コードなしでWordPressにツイートを埋め込む方法(初心者向けガイド)

公開: 2021-01-11

ツイートをWordPressに埋め込む方法を学ぶには、いくつかの簡単な手順を実行するだけで、より高度な機能が必要な場合はプラグインを使用できます。

このチュートリアルの目的は、ブログのツイートを快適に埋め込んで、自分のアカウントまたはインターネット上の他のユーザーからのライブでインタラクティブなTwitter会話を追加できるようにすることです。

1つのツイートをリソースとして投稿に配置するか、アカウントから常に更新されるフィードを取得するかを選択できます。 方法を学ぶために読み続けてください!

デフォルトのエディターでWordPressにツイートを埋め込む方法

デフォルトのWordPressエディターは、WordPressのページや投稿に要素を組み込むためのドラッグアンドドロップブロックの大規模なコレクションを提供します。

これには、ツイートを埋め込むための専用ブロックが含まれています。

これは、ツイートまたは短いTwitterフィードを投稿またはページに配置するための最も簡単なオプションです。 凝ったカスタマイズやデザインツールはありませんが、ウェブサイトにツイートを即座に表示し、コードやプラグインの埋め込みについて心配する必要がないようにするためのトリックを提供します。

使い方はこちら…

初心者向けガイド:#WordPressに#tweetsを埋め込む方法
クリックしてツイート

1.Twitterブロックを追加します

まず、WordPressダッシュボードに移動して、新しい投稿またはページを作成するか、ツイートを追加する既存のコンテンツを編集します。

ツイートを埋め込むための投稿またはページ

ツイートを追加する領域に移動し、 +アイコンをクリックして新しいブロックを追加します。

ブロックボタンを追加

Twitterブロックを検索/選択して、投稿に追加します。

Twitterブロックを使用してツイートを埋め込む

2.ツイートのURLを貼り付けます

さあ、Twitterに行きましょう。 ツイートのコレクションを含むTwitterフィードでない限り、誰の公開ツイートもWebサイトに公開できます。

したがって、埋め込みたいツイートを見つけて、そのツイートの特定のページにのみ移動します。

ブラウザの検索バーには、ツイートの一意のURLが表示されます。 WebサイトのURLをコンピューターのクリップボードにコピーします。

URLをコピー

WordPressダッシュボードに戻ります。

これで、目的のツイートからのリンクを要求するTwitterURLブロックが表示されます。

空のフィールドに、前にコピーしたツイートを貼り付けます。

[埋め込み]ボタンをクリックして、プロセスを完了します。

URLを貼り付けます

埋め込まれたツイートのライブプレビューがエディターに表示されます。 モバイルフレンドリーとCSSにはいくつかの設定がありますが、それだけです。

ダッシュボードに表示されるツイートを埋め込む

すべてが良好に見えることを確認するには、そのWordPressの投稿またはページのフロントエンドに移動して、公開する前にツイートを確認してください。 ツイートを埋め込むと、リンク、ハッシュタグ、ボタンなどのインタラクティブな要素が提供され、Twitterでツイート全体を表示したり、アカウントにアクセスしたりできます。

新しい投稿記事

ボーナス:完全な「Tweetstorms」を埋め込む

Twitterブロックに付属する追加の要素の1つは、「Tweetstorms」と呼ばれるものを埋め込むためのものです。 ツイートストームは一連の関連する投稿であり、通常は連続して公開されます。

Tweetstormsを公開できますが、Twitterアカウントの所有者である必要があります。

これを行うには、以前に埋め込まれたツイートをクリックして、[展開]オプションを押します。

これにより、複数の投稿が連続して表示されますが、Tweetstormがアカウントからのものであり、最近のものであり、投稿が相互に関連している場合に限ります。 そうしないと、エラーが発生します。

展開する

プラグインを使用してTwitterユーザーまたはハッシュタグフィードをWordPressに埋め込む方法

より高度な機能を備えたツイートを埋め込むために、かなりの数のプラグインがオンラインで利用できます。

たとえば、WebサイトのTwitterアカウントから実行中のフィードが必要な場合や、埋め込み時にツイートがどのように表示されるかをカスタマイズするためのツールが必要な場合があります。

これらの機能を備えた無数のプラグインをテストすることをお勧めしますが、主にSmash Balloon Custom Twitter Feedsプラグインをお勧めします。これは、以下のチュートリアルで使用するものです。

1.プラグインをインストールします

開始するには、Smash BalloonTwitterFeedsプラグインをインストールしてアクティブ化します。 それについて質問がある場合は、ここでプラグインをインストールする方法を学びます。

2.プラグインをTwitterアカウントに接続します

WordPressダッシュボードで新しいTwitterフィードタブを選択します。

Twitterフィードタブ

プラグインのセットアップ領域には4つのステップがあります。

1つ目は[構成]タブです。

ボタンをクリックしてTwitterにログインします。これにより、プラグインはTwitterアカウントを使用してフィードをインポートできます。

Twitterにログイン

[アプリの承認]ボタンをクリックして、Smash BalloonTwitterFeedプラグインにTwitterアカウントへのアクセスを許可します。

アプリにツイートを埋め込むことを許可する

これはあなたのTwitterアカウントにリンクするはずです。 そうでない場合は、アクセストークンとアクセストークンシークレットを手動で取得することを選択できます プラグインの指示に従ってください。

アカウントがリンクされたら、変更を保存します。

トークン

3.フィード設定を構成します

[構成]タブを表示したまま、下にスクロールしてフィード設定を変更します。 たとえば、ユーザーアカウントまたはハッシュタグからフィードを取得するように選択できます。

表示するツイートの数や高度なフィードタイプなど、他にも無料のプレミアム設定があります。

フィード設定

4.フィードのレイアウトを構成します

変更を保存して、[カスタマイズ]タブに移動します。

ここに、Twitterフィードのデザインを変更するための設定があります。

タブをカスタマイズしてツイートを埋め込む

レイアウトからツイートに含まれるものまで、すべてを調整できます。 表示したいツイートの数をプラグインに指示することもできます。

レイアウト

5.フィードのデザイン/スタイルを構成します

[スタイル]タブは、色やテキストなどの他の外観の変更用です。

ブランドに合わせて自由に変更してください。

別のタブに移動する前に、設定を保存することを忘れないでください。

スタイル

6.フィードを表示します

最後のステップは、フィードを表示することです。

フィードを表示する方法は2つありますが、このページにリストされているのはショートコード方式だけです。 したがって、指定されたショートコードをクリップボードにコピーします。

ショートコードをコピーする

WordPressで新しいまたは古い投稿またはページに移動します。

フィードを表示するための最初のオプションは、ショートコードをショートコードブロックに貼り付けることです。

ツイートを埋め込むためのショートコード

より簡単な方法は、 TwitterFeedブロックを検索して挿入することです。 このブロックは、Smash BalloonTwitterFeedプラグインからのものです。

ツイートを埋め込むためのTwitterフィードモジュール

設定領域でフィードを既に構成しているため、これ以上カスタマイズする必要はありません。

投稿またはページを公開し、フロントエンドに移動してツイートの動作を確認します。 このチュートリアルでは、ハッシュタグフィードを選択しましたが、自分のアカウントを選択することもできます。

ツイートを埋め込む

今日WordPressにツイートを埋め込む

ツイートを埋め込むのは面倒なことではありません。 代わりに、ネイティブエディタまたはプラグインのいずれかを使用して、上記で概説した方法の1つを利用して、問題なくWordPressにツイートを埋め込みます。

#WordPressに#tweetsを埋め込む簡単な方法(無料)
クリックしてツイート

TwitterをWordPressサイトに統合するための他のアイデアについては、他にも役立つガイドがあります。

  • WordPressとTwitterを統合する9つの方法
  • WordPressからTwitterに投稿する方法
  • Twitterで古いブログ投稿を自動的に共有する方法

WordPressにツイートを埋め込む方法についてまだ質問がありますか? コメントでお問い合わせください!

無料ガイド

スピードアップするための5つの重要なヒント
あなたのWordPressサイト

読み込み時間を50〜80%短縮します
簡単なヒントに従うだけです。

無料ガイドをダウンロード