初めてWordPressにVimeoの動画を埋め込もうとしたとき、デフォルトのプレーヤーに引っかかり、見た目を変えたりカスタムサムネイルを追加したりする簡単な方法がありませんでした。Vimeoのリンクを貼り付けて素早く埋め込むか、SeedProdを使って独自のデザイン、自動再生設定、ブランディングを施したライトボックスポップアップを作成するかだ。
このガイドでは、あなたの動画がシャープに見え、訪問者の視線を釘付けにするために、その両方を行う方法を具体的に紹介します。
WordPressにvimeoの動画を埋め込む簡単な手順:
- ステップ1.SeedProdのインストールとアクティベート
- ステップ2.Vimeo Embed用のカスタムページレイアウトを作成する
- ステップ3.ビデオポップアップブロックを追加し、ソースとしてVimeoを選択します。
- ステップ 4.Vimeoプレーヤー設定とライトボックスオプションをカスタマイズする
- ステップ5.埋め込みVimeoでWordPressページを公開する
WordPressにVimeoの動画を埋め込むことはできますか?
はい、WordPressにVimeoの動画を埋め込むことができます。デフォルトでは、WordPressには自動埋め込み機能があり、動画のURLをコピー&ペーストして任意の投稿やページに表示することができます。
しかし、WordPressのデフォルト機能の多くがそうであるように、カスタマイズのオプションは限られています。ビデオプレーヤーのオプションを簡単に編集したり、カスタムサムネイル画像を追加したり、ユーザーがページをスクロールする際にビデオを「スティッキー」にすることはできません。
そこでこのガイドが役に立つ。
簡単なページビルダープラグインを使って、Vimeoの動画ポップアップをWordPressのページに埋め込む方法を紹介します。また、WordPressの自動埋め込み機能をサイト上のどこにでも使えるようにするための手順も紹介します。
なぜWordPressでVimeo動画を使うのか?
Vimeoは、高品質の再生、最小限の圧縮、プロフェッショナルなプレゼンテーションオプションで知られています。あなたのWordPressサイトで動画をシャープに見せ、スムーズにロードしたいのであれば、Vimeoは確かな選択です。
以下は、私が他のプラットフォームよりもVimeoのエンベッドをよく勧めるいくつかの理由です:
- より良いビデオ品質:Vimeoは、邪魔な広告を追加することなく、より高いビットレートと解像度をサポートしています。
- カスタムブランディング:プレーヤーの色を変更したり、Vimeoのロゴを削除したり、独自のコールトゥアクションを追加したりできます。
- 高度なプライバシーコントロール:あなたのドメインに再生を制限したり、ビデオをパスワードで保護します。
- より速いロード時間:動画ホスティングをVimeoのサーバーにオフロードし、サイトを軽量に保ちます。
- クリエイティブ・コントロール:カスタムサムネイル、開始時間、ライトボックスポップアップを使用して、カスタマイズされた視聴体験を実現できます。
Vimeoの動画をWordPressに埋め込むと、視覚的なアピールが向上するだけでなく、訪問者をサイトに長く留まらせることができ、エンゲージメントやSEOにも効果的です。
目次
WordPressにVimeoの動画をライトボックスポップアップで埋め込む方法

最高のドラッグ&ドロップWordPressウェブサイトビルダーであるSeedProdを使えば、Vimeoビデオの埋め込みは簡単です。100万人以上のユーザーを持つSeedProdを使えば、コードを書かずにWordPressのカスタムテーマやページレイアウトを作成できます。
あらかじめ用意されたテンプレートから始め、ビジュアル・ビルディング・ブロックを使って各ページをカスタマイズし、自分だけのページを作ることができます。
Vimeoビデオポップアップは?ビデオポップアップブロックを使えば簡単に埋め込むことができます。
ドラッグ、ドロップ、ポイント、クリックするだけで、好きな場所にフルスクリーンのVimeoライトボックスポップアップを表示できます。
以下のステップ・バイ・ステップのガイドに従って、その方法を学んでください。
ステップ1.SeedProdのインストールとアクティベート
まず、SeedProdプラグインをインストールして有効化する必要があります。
SeedProdの無料版もご利用いただけますが、ビデオポップアップブロックを含む、より多くのテンプレートやブロックにアクセスするには、SeedProd Proのご利用をお勧めします。
プランを選択し、プラグインをコンピュータにダウンロードした後、以下の手順に従ってWordPressサイトにSeedProdをインストールしてください。また、プラグインのライセンスキーを有効にする方法も説明します。
ステップ2.Vimeo Embed用のカスタムページレイアウトを作成する
プラグインを有効にすると、ドラッグ&ドロップでページビルダーを使用し、WordPressのカスタムレイアウトを作成することができます。
現在使っているWordPressテーマを入れ替えたい場合は、Theme Builderを使ってゼロから新しいテーマを作成することができます。
カスタムヘッダー、フッター、サイドバー、ホームページ、ブログページなど、サイトのあらゆる部分を構築できます。カスタムWordPressテーマの作成方法については、ガイドをご覧ください。
あるいは、ランディングページビルダーを使って個別のページを作ることもできる。
WordPressの管理画面からSeedProd " Landing Pagesに移動し、Add New Landing Pageボタンをクリックします。

次に、レスポンシブランディングページのテンプレートを閲覧して、作成したいページのタイプに近いものを見つけます。より簡単にするために、上部にあるタブをクリックして、キャンペーンのタイプで絞り込みます。

見つけたら、テンプレートにカーソルを合わせ、チェックマークアイコンをクリックして選択します。
ページ名とURLを入力するウィンドウが表示されます。URLはSeedProdが自動的に生成しますが、クリックして新しいURLを入力することで変更できます。

詳細が決まったら、「保存してページの編集を開始する」ボタンをクリックします。
ステップ3.ビデオポップアップブロックを追加し、ソースとしてVimeoを選択します。
選択したテンプレートがドラッグ&ドロップエディターで開きます。ここでは、左側にページのライブプレビュー、右側にブロックとセクション、下部のツールバーにアンドゥ、リドゥ、プレビューのオプションが表示されます。

ライブプレビューでブロックをクリックすると、テンプレートのどの部分でも変更できます。クリックすると、左側のサイドバーにブロックの設定が表示され、コンテンツ、配置、フォントサイズなどを変更できます。

ページに新しいコンテンツを追加するには、左側のサイドバーからブロックを選択し、プレビュー上にドラッグします。そこから、ニーズに合わせてブロックの内容をカスタマイズするだけです。

リアルタイムで変更を確認できます。これにより、サイトのバックエンドとフロントエンドを切り替えて確認する手間が省けます。
ビデオ・ポップアップ・ブロックをページに追加しましょう。

デフォルトでは、このブロックはYouTubeビデオを表示します。ブロック設定で「ソース」ドロップダウンをクリックし、Vimeoオプションを選択することで簡単に変更できます。

注:このブロックでは、WordPressに動画ファイルをアップロードすることもできます。
ステップ 4.Vimeoプレーヤー設定とライトボックスオプションをカスタマイズする
VimeoのURLを貼り付けてください。動画の開始時間を秒単位で設定することもできます。
そのセクションの下にはビデオ設定があり、有効/無効を設定できる:
- オートプレイ
- ミュート
- ループ
- ビデオプレーヤーのコントロール
- プライバシー設定
- イントロタイトル
- イントロポートレート
- イントロ・バイライン
- スティッキービデオ

パレットからカスタムカラーを選択することで、Vimeoプレーヤーのコントロールカラーを変更することもできます。

では、「画像オーバーレイ」タブを開いてみましょう。このオプションを有効にすると、動画のカスタムサムネイル画像を設定できます。

自分の画像を使う」ボタンをクリックし、パソコンやワードプレスのメディアライブラリからサムネイルをアップロードするだけです。
カスタムアイコンを選択し、そのサイズ、色、不透明度を変更することで、ビデオ再生アイコンにも同じことができます。

最後に、ライトボックスを有効にするトグルです。このオプションを有効にすると、ユーザーはフルスクリーンのライトボックスポップアップで動画を見ることができます。

気が散るのを抑え、聴衆を惹きつけることに集中するための優れた方法だ。
ステップ5.埋め込みVimeoでWordPressページを公開する
動画の埋め込みオプションに満足したら、画面右上の「保存」をクリックし、「公開」オプションを選択します。

これで、ページをプレビューして、埋め込んだVimeoビデオが動いているのを見ることができます。

ビデオをクリックすると、ビデオポップアップが開きます。

WordPressのサイドバーにVimeoの動画を追加したいですか?WordPressでカスタムサイドバーを作成する方法についてはこちらのガイドをご覧ください。上記と同じ手順でビデオポップアップブロックを追加してください。
カスタマイズやフォーマットのヒントについては、WordPressでランディングページを作成する方法についてのガイドをご覧ください。
プラグインを使わずにWordPressにVimeoの動画を埋め込む方法
ブログ記事など、シンプルで飾り気のない動画をウェブサイトに追加したい場合があります。ほとんどのページビルダーはページでしか動作しないため、WordPress の埋め込み機能を使用するのが最も簡単なオプションです。
自動埋め込み機能を使うか、WordPressの埋め込みブロックを使うかです。
自動エンベッド機能の使い方はこちら:
方法1:Vimeo動画のURLをWordPressエディターに貼り付ける
まず、WordPressの投稿またはページを作成または編集します。そして、VimeoビデオのURLをコンテンツエディターに貼り付けます。

WordPressは自動的にVimeoのビデオを埋め込み、数秒で表示します。
方法2:WordPressのVimeo埋め込みブロックを使う
または、プラスアイコンをクリックして新しいブロックを追加し、Vimeo Embedブロックをクリックすることもできます。

次に、動画のリンクを貼り付け、埋め込みボタンをクリックします。

投稿やページを公開した後、プレビューして変更内容を確認することができます。

Vimeoビデオを埋め込む FAQ
Vimeoのビデオにリンクするには?
Vimeoビデオにリンクするには、共有ボタンをクリックし、ビデオのURLをコピーしてください。その後、そのURLをウェブサイトに貼り付けることができます。
埋め込みビデオURLとは何ですか?
埋め込み動画URLとは、ウェブサイトに直接追加された動画とソーシャルメディアの動画共有サイトからの動画のことです。例えば、WordPressサイトに埋め込まれた動画URLとVimeo.comのソースの比較です。
WordPressにVimeoショーケースを埋め込むことはできますか?
WordPressのサイドバーにVimeoの動画を表示したい場合は、WordPressのVimeo埋め込みブロックを使用できます。または、動画埋め込みコードをコピーしてHTMLブロックに貼り付けてください。
iFrameを使わずにVimeoのビデオを埋め込むには?
iFrameを使わずにVimeoの動画を埋め込むには、動画のウェブページにアクセスし、共有ボタンをクリックします。ポップアップボックスで、「+show options」テキストをクリックし、一番下までスクロールしてサイズを「Responsive」に変更します。これで、HTMLコードからiFrameが削除されます。

そこからコードをコピーして、ウェブサイトのHTMLウィジェットに貼り付ける。
今すぐWordPressにVimeoの動画を埋め込む
このガイドが、WordPressにVimeoの動画を埋め込む方法を学ぶのにお役に立てば幸いです。ウェルカムメッセージとして、ウェビナーのイントロとして、あるいは新製品の発売を宣伝するために、このガイドの手順は必要なすべてをカバーしています。
その他のビデオヘルプについては、以下のチュートリアルやショーケースもお勧めです:
- WordPressにYouTube動画を埋め込む方法
- WordPressで動画をオンライン販売する方法
- WordPress 動画プラグイン 8選
- WordPressにFacebookの動画を埋め込む方法
- WordPressで動画ランディングページを作成する方法
お読みいただきありがとうございました!あなたのご意見をぜひお聞かせください。YouTube、X、Facebookで、あなたのビジネスを成長させるために役立つアドバイスやコンテンツを提供していますので、お気軽に会話にご参加ください。
