ElementorのウェブサイトにTikTokのフィードを埋め込む方法【簡単
ホーム ブログ ElementorのウェブサイトにTikTokのフィードを埋め込む方法【簡単

ElementorのウェブサイトにTikTokのフィードを埋め込む方法【簡単

elementorにtiktokを埋め込む方法

TikTok Elementorのフィードをサイトに追加する方法をお探しですか?

人気のページビルダーであるElementorを使えば、コーディングなしで簡単に美しいサイトを作ることができる。しかし、あなたのサイトをより魅力的なものにしたいのであれば、TikTokの動画をサイトに表示することができます。

しかし、手作業でTikTokフィードをElementorに埋め込むのは大変です-特にコーディングに慣れていない場合は。

解決策は?TikTokフィードをウェブサイトに埋め込む最も簡単な方法をご紹介します。

まず、TikTokコンテンツをWordPressサイトに追加する最も簡単な方法を見てみましょう。

あるいは、ここをクリックしてチュートリアルに飛ぶこともできる。

Elementor TikTokフィードを埋め込む最も簡単な方法

ElementorにTikTokフィードを手動で追加するのは複雑で時間がかかります。結局のところ、すべてのTikTok埋め込みコードを生成し、ウェブサイトに挿入する必要があります。

さらに、動画はTikTokの公式ルックを保持したままです。つまり、TikTokの動画フィードは、Elementorサイトに選んだデザインと衝突する可能性さえあるということです。

より簡単な方法として、TikTok Feed Proのようなソーシャルメディア・アグリゲーターを使うことができる。

tiktok feed pro ホームページ

TikTok Feed Proは、WordPressでのTikTokフィードの作成、カスタマイズ、埋め込みをかつてないほど簡単にします!

実際、このプラグインにはTikTokフィードを簡単に埋め込むための素晴らしい機能が満載されている:

  • 3ステップのガイドフローに従うだけで、数分で美しいTikTokフィードが完成します。そして、節約した時間をウェブサイトの成長に投資することができます。
  • 作成したすべてのTikTokフィードは、WordPressのテーマを自動的に継承します。そのため、あなたの動画は入念にデザインされたElementorのウェブサイトに完璧にマッチします。
  • 人々の注目を集めるTikTokフィードを簡単に作成するには、デザイン済みのテンプレートをインポートするだけです。
  • このプラグインはとても軽量なので、Elementorのウェブサイトに大量の動画を埋め込むことができ、読み込みもこれまでと同じように高速です。つまり、より良いSEOを獲得し、より多くの人々にリーチできるということです。
  • ビジュアルカスタマイザーを使えば、コーディングやデザインの経験がゼロでも、ユニークなTikTokビデオフィードを作成することができます。
tiktok feed proのカスタマイズ

TikTok Feed Proには専用のカスタマーサポートも付いています。質問がある時やヘルプが必要な時は、いつでもチームに助けを求めることができます。

専門家のアドバイスあなたのサイトにTikTokフィードを追加する準備はできましたか?TikTok Feed Proを今すぐ入手しましょう!

なぜElementor TikTokフィードを表示するのか?

Elementor WordPressサイトにTikTokの動画を埋め込むことで、以下のことが可能になります:

  • あなたのウェブサイトのトラフィックを新しいTikTokフォロワーに変換することによって、あなたのオンラインフォローを高める。
  • TikTokの動画体験談を商品ページに埋め込んで、より多くの売上を獲得しましょう。
  • 関連性の高い動画で人々の注目を集め、ウェブサイトに長く留まらせましょう。
  • 面白いTikTok動画をウェブサイトで紹介して、エンゲージメントを高めましょう。
  • 新鮮なソーシャルメディアコンテンツに関連キーワードを埋め込んで、サイトのSEOを向上させましょう。

"TikTokは最終的に単なるソーシャルメディア・プラットフォームを超えた存在となった。" "コンテンツ、コマース、コミュニティを交差させる革命的な方法である。"

- ジア・リズヴィ、スタジオ15の創設者、受賞歴のあるドキュメンタリー映画監督

ジア・リズヴィ

ElementorのTikTokフィードをWordPressに埋め込む方法

ElementorサイトにTikTokフィードを埋め込むには、以下のステップバイステップのガイドに従ってください。

始めよう!

ステップ1:TikTok Feed Proプラグインをダウンロードする

まず、TikTok Feed Proプラグインをあなたのウェブサイトにインストールして有効化する前に、こちらから入手してください。

方法がわからない?WordPressプラグインのインストール方法についての初心者ガイドをご覧ください。

ステップ2:新しいTikTokフィードを作成する

プラグインのガイドフローに従えば、簡単に新しいTikTokフィードを作成できます。

始めるには、ダッシュボードからTikTokフィード " すべてのフィード メニューを開き、新規追加ボタンを押してください。

ライブ・フィード・エディターを開く tiktok feed

ステップ3:TikTokアカウントに接続する

TikTokアカウントに接続すると、フィードがTikTok動画を取得し、あなたのサイトに表示することができます。

まず、ソースの追加 ボタンをクリックして開始する。

tiktok feed pro 追加ソース

次に、「TikTokと接続 」ボタンをクリックします。

そうすると、ウェブブラウザでhttps://www.tiktok.com/

Tiktokとつながる

ここから、プラグインにあなたのTikTokアカウントへの読み取り専用 アクセスを与えることができます。TikTok Feed Proはこのアクセス権を使ってあなたの情報を見ることができるだけで、変更を加えることはできません。

Authorize ボタンをクリックするだけで、アクセスが許可されます。

プラグインがあなたのウェブサイトに戻るので、このアカウントをフィードのソースとして確認することができます。

そのためには、アカウントを選択し、「次へ」をクリックするだけです。

Tiktokソースを選択

ステップ4:TikTokビデオフィードをカスタマイズする

TikTok Feed Proは、異なる事前に構築されたテンプレートから選択するように指示します。各テンプレートはユニークなデザインを持っており、あなたは即座にあなたのサイトにインポートすることができます。

続行するには、ここでフィードテンプレートを選択し、[次へ]をクリックします。

フィードテンプレートの選択

次に、プラグインはビジュアルカスタマイザーでフィードを開きます。ここから、左側のオプションを使ってヘッダー、レイアウトボタン、動画要素などを編集できます。

右側には、TikTokフィードのリアルタイムプレビューがあり、簡単かつ正確にカスタマイズできます。

ライブフィードエディター tikto feed pro

それでは、ビジュアルカスタマイザーからTikTokフィードをカスタマイズする方法を見てみましょう。

手始めに、私は通常動画のレイアウトを変更します。そのためには、左側のレイアウトオプションをクリックします。

レイアウトを開く tiktok feed pro

このプラグインを使うと、フィードのレイアウトを4種類から選ぶことができます。それぞれのレイアウトについて説明しましょう:

  • グリッド: 行と列を使用して、一度に大量のTikTok動画を表示します。
  • リスト: TikTokのコンテンツを1列に表示することで、各動画をわかりやすくします。
  • 石組み:動画の元の比率を維持し、複数の列で表示します。
  • カルーセル: 動画のカルーセルスライダーでウェブサイトをよりインタラクティブに
tiktok feed proのレイアウトオプション

レイアウトを選択したら、Saveをクリックして変更を保持します。

次に、カスタマイズをクリックして、再びメインのカスタマイズ・オプションに戻ることができます。

カスタマイズボタン ライブフィードエディタ tiktok feed pro

ここから、TikTokフィードの上に表示されるヘッダーを設定できます。

左側のヘッダーオプションを 選択し、開始します。

tiktokのオープンヘッダーオプション

左上には、ヘッダーを有効 または無効に するオプションがあります。

次に、チェックボックスを使ってヘッダーのさまざまな部分を表示または非表示に することができます:

  • プロフィール写真
  • 名称
  • ユーザー名
  • 説明
  • 統計
  • ボタン

ヘッダーに満足したら、Saveをクリックして次に進みます。

ここから、それぞれのヘッダー要素を詳細にカスタマイズすることもできます。このチュートリアルでは、Profile Picture 要素をカスタマイズします。

そこから、上部のオプションを使ってプロフィール写真のサイズを 設定できます。

余白や パディングを 設定して、写真の配置を変えることもできる。

ヘッダープロファイルのカスタマイズ

最後に、プロフィール写真の見栄えに満足したら、「保存」をクリックします。

ご覧の通り、TikTok Feed Proは動画フィードの見た目を超簡単にカスタマイズできます。残りのオプションを使用すると、ボタンのデザイン、ビデオ要素、フィルタなどを設定することができます。

その後、忘れずに「Save 」をクリックして変更を確定してください。

ステップ5:TikTokフィードをElementorに追加する

最後に、このTikTokフィードをあなたのElementorサイトに埋め込むことができます。ビジュアルカスタマイザーから直接できるのが最大の特徴です。

上部の埋め込み ボタンをクリックすれば、すぐに始められます。

tiktokフィードを埋め込む ライブフィードエディタ

そうすると、あなたのサイトにTikTokフィードを埋め込むすべての方法がポップアップで表示されます。TikTok動画をページ、サイドバー、フッターに追加したり、ショートコードをコピーしたりできます。

とりあえず、「コピー」をクリックして続行してください。

コピーショートコード tiktok feed pro

次に、TikTokビデオフィードを表示するElementorページを作成します。

まず、ダッシュボードからページ " 新規追加 メニューを開き、Elementorで編集をクリックします。

新しいワードプレスページを作成する

TikTokの動画を投稿に表示したいですか?このプラグインにお任せください。

投稿 " 新規追加 メニューを開いてください。そこで「Elementorで編集」ボタンをクリックします。

ワードプレスの新規投稿を作成する

その後、Elementorエディタでページまたは投稿が開かれます。

左側には、新しいコンテンツを追加するために使用できる様々なElementorウィジェットがあります。右側には、ページや投稿のライブプレビューがあります。

エレメンタ・エディタの例

左上の検索バーで「ショートコード」ウィジェットを探してください。

このように、下の検索結果にショートコードウィジェットが 表示されます。

ショートコード・ブロック・エレメントを検索

ドラッグアンドドロップで ショートコードウィジェットを Elementorのページや投稿に配置できます。

elementorにショートコード・ブロックを追加

そうすると、左側のショートコードウィジェットのオプションが開きます。

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

ショットコード・エレメンター・ティクトックを入力

あとはPublishをクリックするだけで、あなたのTikTokフィードがみんなの目に触れるオンラインになります。

ご覧の通り、このプラグインを使えばElementorのTikTokフィードを手間なく埋め込むことができます。このElementorのページや投稿を開くだけで、TikTokの動画がどのように見えるかを確認できます。

下の写真は、私がElementorのランディングページ用に作成したTikTokのビデオフィードです。

elementor tiktokフィードの例

これで完成だ!

これだけで、WordPress ElementorのウェブサイトにTikTokのビデオフィードを埋め込むことができます。TikTok Feed Proを使用すると、簡単な時間を持つことになり、それは全くコーディングを必要としません。

数回クリックするだけで、訪問者を惹きつけ、TikTokのフォロワーを増やし、ビジネスを成長させることができます。

TikTokフィードを埋め込む準備はできましたか?今すぐTikTok Feed Proをあなたのサイトに

あなたのElementorサイトにもっとソーシャルメディアコンテンツが欲しいですか?ソーシャルフィードウィジェットをウェブサイトに埋め込む方法のガイドをご覧ください。

ソーシャルメディア・マーケティングのヒントとチュートリアル

お役に立ちましたか?ソーシャルメディア・マーケティングのヒントやコツをもっと知りたい方は、ツイッターや フェイスブックをフォローしてください。

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

コメントを追加する

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