アストラ・ワードプレス・サイトにTikTokフィードを埋め込む方法
ホーム ブログ アストラ・ワードプレス・サイトにTikTokフィードを埋め込む方法

アストラ・ワードプレス・サイトにTikTokフィードを埋め込む方法

アストラ・ワードプレス・サイトにTikTokフィードを埋め込む方法

ダイナミックなTikTokフィードを統合して、Astra WordPressウェブサイトを強化したいですか?

人気のウェブサイト・ビルダーであるAstraを使えば、ユーザーは大規模なコーディングをすることなく、魅力的なウェブサイトを作成することができます。TikTokの動画を表示することで、サイトのエンゲージメントを大幅に高めることができますが、手作業で複数のフィードを埋め込むのは複雑で時間のかかる作業です。

多くのカスタムコードを扱わなければならないかもしれないし、その結果、デザインが既存のサイト美学と衝突する可能性もある。

この包括的なガイドでは、Astra WordPressウェブサイトに魅力的なTikTokフィードを追加するための最もシンプルで効率的な方法を説明します。

専用プラグインがこのプロセスをいかに効率化し、シームレスな統合を実現し、TikTokの絶大な人気をビジネスの成長に役立てるかを探ります。

手動TikTok埋め込みがアストラ・ユーザーに物足りない理由

Elementor WordPressサイトにTikTokの動画を手動で統合するには、いくつかの一般的な課題があります:

  • 複雑さと時間:各動画に個別の埋め込みコードを生成するのは手間のかかる作業です。
  • デザインの不一致:埋め込み動画は、TikTokのデフォルトのスタイルを維持することが多く、アストラサイトの入念に作り込まれたデザインと衝突する可能性があります。
  • カスタマイズの欠如:ウェブサイト上でのフィードの表示や動作に関するオプションが限られている。
  • 常に更新が必要です:新しいTikTokビデオが投稿されるたびに、それをサイトに埋め込むためにすべてのプロセスを繰り返す必要があります。

TikTok Feed Proのご紹介:シームレスなElementor統合ソリューション

このようなハードルを乗り越え、ダイナミックなTikTokフィードをAstraウェブサイトで効率的に表示するには、ソーシャルメディアアグリゲーターに特化したプラグインを使用することをお勧めします:TikTok Feed Pro

tiktok feed pro ホームページ

このプラグインは全体のプロセスを簡素化するために特別に設計されており、コーディングの知識がなくてもWordPressとElementorでTikTokフィードを作成、カスタマイズ、埋め込むことができます。

Astraユーザー向けTikTok Feed Proの主な利点と機能:

  • シームレスなデザイン統合:作成されたすべてのフィードは、WordPressテーマのスタイルを自動的に継承するため、TikTok動画はAstraウェブサイトのデザインを完全に補完します。
  • デザイン済みテンプレート:プロ仕様のすぐに使えるテンプレートをワンクリックでインポートして、視覚的に魅力的なフィードをすばやく立ち上げられます。
  • 最適化されたパフォーマンス:軽量なプラグインであるTikTok Feed Proは、多数の動画を埋め込んでも、アストラのウェブサイトが素早く読み込まれるようにします。これはSEOの向上に貢献します。
  • 専用サポート:ご質問やサポートが必要な場合は、専門家によるカスタマーサポートをご利用ください。
  • ビジュアルカスタマイザー:直感的なドラッグ&ドロップのビジュアルカスタマイザーで、デザインやコーディングの経験がなくても、簡単にユニークなTikTok動画フィードを作成できます。
tiktok feed proのカスタマイズ

TikTok Feed Proを活用することで、Astraのユーザーはウェブサイトを魅力的な動画コンテンツのダイナミックなハブに変えることができ、ユーザーの定着率とコンバージョン率を大幅に向上させることができる。

TikTokフィードを追加して、Astra WordPressウェブサイトをスーパーチャージする準備はできましたか?こちらからTikTok Feed Proを入手してください!

TikTokフィードを追加してAstra WordPressサイトを支援する方法

TikTokのフィードを表示することで、アストラのウェブサイトのエンゲージメントを高め、オンラインプレゼンスを向上させることができます:

  • TikTokのフォロワーを増やす:ウェブサイトのトラフィックを専用のTikTokフォロワーに変換することで、ソーシャルメディアへのリーチを拡大し、より強力なオンラインコミュニティを構築します。
  • 販売とコンバージョンを促進:TikTokの魅力的なビデオ体験談や製品デモを貴社の製品やサービスのページに直接表示することで、信頼を築き、購入を促します。
  • ユーザーエンゲージメントを高める:ダイナミックで新鮮な動画コンテンツで訪問者を魅了し、ウェブサイトの探索に時間をかけさせ、滞在時間を延ばします。
  • SEOランキングを強化します:TikTokからの関連キーワードを含む新鮮なコンテンツは、検索エンジンにあなたのウェブサイトがアクティブであることを示し、SEOランキングを高めるのに役立ちます。
  • ブランドの個性をアピール:ブランドのTikTokプレゼンスを表示することで、ビジネスに人間味を与え、信頼感を醸成し、若い視聴者とつながることができます。

ステップバイステップガイド:アストラ・ワードプレス・ウェブサイトにTikTokフィードを埋め込む方法

以下の詳細な手順に従って、ダイナミックTikTokフィードをAstraウェブサイトにシームレスに統合することができます:

ステップ1:TikTok Feed Proプラグインをダウンロード、インストール、有効化する

まずはこちらからTikTok Feed Proプラグインをダウンロードしてください。

ダウンロードしたら、Astra WordPressウェブサイトにプラグインをインストールし、有効化してください。

(このステップで助けが必要な場合は、WordPressプラグインのインストール方法に関する包括的なガイドをご覧ください)。

ステップ2:プラグインを使ってTikTokフィードを作成する

ウェブサイトのダッシュボードに移動し、左側のTikTokフィード " すべてのフィード メニューを開きます。

フィードの作成を開始するには、先に進み、新規追加ボタンをクリックします。

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

ステップ3:TikTokアカウントをソースとして接続する

TikTok Feed ProがあなたのTikTok動画を取得できるようにするには、TikTokアカウントと安全に接続する必要があります。

ソースの追加 ボタンをクリックして、TikTokへの接続を開始します。

tiktok feed pro 追加ソース

次のページで、「TikTokと接続する」をクリックして次に進みます。

この操作により、ブラウザ上でTikTokの公式ウェブサイト(https://www.tiktok.com/)に安全にリダイレクトされます。

Tiktokとつながる

TikTokの認証ページでは、要求された権限を確認することができます。

TikTok Feed Proは、あなたの公開プロフィール情報とビデオを閲覧するための読み取り専用アクセス権のみを必要とします。TikTokアカウントに変更を加えることはできませんので、100%安全です。

Authorizeをクリックし、必要な権限を付与する。

WordPressダッシュボードに安全にリダイレクトされます。

リストから新しく接続したTikTokアカウントを選択し、「次へ」をクリックしてフィードソースとして確認します。

Tiktokソースを選択

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

アカウント接続に成功すると、TikTok Feed Proのガイドでフィードのデザインをカスタマイズできます。

始めに、様々なデザイン済みのテンプレートから選ぶことができ、それぞれがユニークな美しさを提供している。

オプションからお好みのテンプレートを選択し、「次へ」をクリックします。

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

このプラグインは、フィードをリアルタイムのビジュアルカスタマイザーで開きます。

左側のパネルには、包括的なカスタマイズオプションが含まれており、右側のパネルには、フィードのライブプレビューが表示され、すぐにフィードバックを得ることができます。

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

ライブ・フィード・エディターがどのように機能するかを理解してもらうために、主なカスタマイズ・オプションを説明しよう。

まず、左からレイアウトオプションをクリックします。

レイアウトを開く tiktok feed pro

このプラグインは、TikTok動画を表示するための4つの異なるレイアウトを提供します:

  • グリッド:複数のTikTokビデオを整理された行と列で表示し、大量のコンテンツを表示するのに最適です。
  • リスト:動画を1つの列で表示するため、各動画が区別され、注目しやすくなります。
  • メイソンリー:動画の元のアスペクト比を維持し、複数の列に並べることで、ダイナミックで視覚的に魅力的な外観を実現します。
  • カルーセル:コンパクトなスペースでユーザーを惹きつけるのに最適です。
tiktok feed proのレイアウトオプション

希望のレイアウトを選択したら、Saveをクリックして変更を適用します。

メインのカスタマイズ・オプションに戻るには、左上のカスタマイズ・ボタンを押す。

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

次の例では、TikTokビデオフィードの上に表示されるヘッダーをカスタマイズしてみましょう。

左から、今度はヘッダーオプションを選択する。

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

上部のオプションでヘッダーを有効または無効にできます。

有効な場合は、チェックボックスを使用して、次のような特定の要素を表示または非表示にします:

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

TikTokフィードヘッダーの設定が完了したら、「保存」をクリックします。

ヘッダーをもっとコントロールしたい場合は、これらの各要素を詳細にカスタマイズできます。

例えば、プロフィール写真をクリックすると、サイズ、パディング、余白を変更するオプションが表示されます。

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

最後に、保存をクリックし、TikTokフィードのプロフィール写真のデザインを確認します。

カスタマイズオプションの追加

TikTok Feed Proには、ボタンデザイン、ビデオ要素、フィルターなどの豊富なオプションがあります。これらの設定を試して、本当にユニークで魅力的なフィードを作成しましょう。

変更後は忘れずに「保存」をクリックして確定してください。

ステップ5:新しいTikTokフィードをAstraに追加する

最後のステップは、新しく作成しカスタマイズしたTikTokフィードをAstraのページや投稿に直接統合することです。

上部にある埋め込み ボタンをクリックすることで開始できます。

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

TikTokフィードの様々な埋め込みオプションのポップアップが表示されます。

Astraとの統合では、コピーをクリックして、固有のショートコードをクリップボードにコピーします。

astraのインスタグラムフィードのショートコードをコピーする。

その後、TikTokフィードを埋め込みたいページや投稿を開きます。

ページが準備できていない場合は、今すぐ作成することができます。

ダッシュボードエリアから、ページ " 新規追加 メニューを開きます。

新しいページで、上部にあるデザイン・ライブラリー・ボタンをクリックします。

アストラ・デザイン・ライブラリを開く

また、WordPressの新規投稿を作成し、同様の作業を行うこともできる。

デザイン・ライブラリを開くと、このページや投稿に挿入できるすべてのパターン、ページ、キットがポップアップで表示されます。

まず、上部のKits ボタンをクリックする。

デザイン・ライブラリのキット・オプションを選択します。

これで、挿入可能なすべてのアストラ・キットを見ることができます。たくさんのオプションがあるので、ゆっくり選んでください。

キットを見つけたら、クリックして次に進みます。

ポップアップのオプションからキットを選択します。

そうすると、全ページやプレビューを確認できるオプションなど、そのキットに関する詳細情報が開きます。

このキットでよろしければ、下のインストール ボタンをクリックしてください。

ページや投稿にウェブサイト・キットを挿入する

そうするだけで、キットはすべてのデザイン要素を含めて、あなたのWordPressページや投稿に挿入されます。

その後、プラス(+)アイコンをクリックして新しいブロックを追加できる。

アストラ・ページに新しいブロックを追加

次に、上部にある検索バーに「shortcode」と入力してブロックを探します。

下の検索結果が表示されたら、ショートコードの ブロックをクリックして挿入します。

astraページにショートコードブロックを追加します。

ガイドの最後の部分は、先ほどコピーしたショートコードを新しいブロックに貼り付けるだけだ。

最後に、「公開 」または「更新」ボタンをクリックして、新しいTikTokフィードをライブにします。

astraのページまたは投稿にショートコードを貼り付けます。

あなたのダイナミックなTikTokビデオフィードが、Astraウェブサイト上でライブになりました!Astraのページや投稿にシームレスに統合されているのを確認できます。

アストラのウェブサイトにおけるTiktokビデオフィードの例

ダイナミックTikTokフィードでAstraサイトをシームレスに強化する

この詳細なガイドに従って、TikTok Feed Proを使って、魅力的なTikTokビデオフィードをAstra WordPressウェブサイトに直接埋め込む方法を学ぶことができました。

このパワフルでユーザーフレンドリーなプラグインは、コーディングの必要性を完全に排除し、簡単なソリューションを提供します:

  • 訪問者のエンゲージメントとサイト滞在時間を向上させます。
  • TikTokのフォロワーを増やし、ソーシャルメディアでのリーチを広げましょう。
  • ダイナミックなコンテンツを紹介することで、ビジネス全体の成長に大きく貢献します。

あなたのオンラインプレゼンスを増幅し、かつてないほど聴衆を惹きつける準備はできていますか?

TikTok Feed Proを今すぐあなたのサイトに

ソーシャルメディア・マーケティングのリソースをもっと見る

多様なソーシャルメディアフィードでアストラサイトをさらに最適化したい、またはマーケティングの知識を深めたいとお考えですか?さらに役立つガイドをご覧ください:

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

コメントを追加する

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