wordpressにyoutubeの動画をスライドショーで埋め込む初心者向けカスタマイズ

f:id:buchibuchi4647:20170317054251g:plain

別ブログでwordpressを運営しています。初心者向けにトップページやサイドバーに自分のyoutubeの動画をスライドショーで設置するカスタマイズ方法のまとめです。

youtubeをスライドショーで設置するカスタマイズ

wordpressの自分のホームページやブログのトップページ、またはサイドバーにyoutubeの動画やスライドショーを埋め込みたいと思いませんか。youtube動画をトップページに埋め込むことで読者にyoutubeチャンネルをアピールすることも可能で、またスライドショーを埋め込むことで、オシャレなトップページに変わります。

また、youtubeで動画を投稿したことない人もこの機会に登録することをおすすめします。ブログで動画を公開する場合、youtubeを使って公開するほうがメリットが多いです。たとえば、もし再生回数が多いと動画のみで収益を得ることができるからです。

カスタマイズ方法 

トップページにスライド画像やyoutubeの動画を埋め込むためには2つのプラグインがこ必要になります。

  • page builder by siteorigin
  • master slider

page builder by siteoriginはトップページを自由にレイアウト出来るプラグインです。たとえば、トップページの左側をさらに2分割して関連記事と新着記事をそれぞれ表示することが簡単にできます。このプラグインを使ってトップページにスライドショーや動画を埋め込みます。

注意

ただし、トップページではなくサイドバーに設置を考えている人はpage builder by siteoriginをインストールする必要はありません。また、page builder by siteoriginの基本的な使い方については以下の記事を参考にしてください。

 

english-apple-diy.hatenablog.com

 

master slider

master sliderの解説です。初心者でもスライドショーを簡単に作れるプラグインで、youtubeなどの動画もスライドショーとして設定ができます。もちろん、レスポンシブ対応です。

f:id:buchibuchi4647:20170317054411p:plain

 

プラグインをインストールし、有効化後メニューバーにMaster Sliderのボタンがでてきます。settingsはそのままで上のMaster sliderをクリックします。下側の青いボタンCreate New Sliderをクリックしてください。

 

f:id:buchibuchi4647:20170317054427p:plain

サンプルのスライドショーが表示されます。サムネイルが横や縦または、説明がついているスライドショーなど確認できます。気に入ったスライドショーを選択してCreateボタンをクリックします。もちろん、自分でスライドショーをカスタマイズすることも可能です。

f:id:buchibuchi4647:20170317054448p:plain

既存のサンプル画像がありますが、自分が使用する画像に変更します。ゴミ箱のマークで捨てるをクリック。+のマークで画像の追加です。

f:id:buchibuchi4647:20170317054523p:plain

 

上記の画像は僕のブログで使用しているyoutube動画のサムネイル画像です。こちらをアップロードしてドラッグして先頭にもっていきました。この流れで、他にもアップロードした動画を追加します。追加完了したら、video and link をクリック。

 

f:id:buchibuchi4647:20170317054543p:plain

 

1.Video embed srcへ //www.youtube.com/embed/あなたのyoutubeの動画idを入力

これでスライドショーでは画像だけ読み込み、クリックしてから動画を読み込むためサイトへの負荷が軽減されます。

2.また上の部分にURLはスライドショーで使用します。ここを入力するとクリックしたときに指定したURLに飛ばしてくれます。以上で設定は完了です。

再生されない

スライドショーやyoutube動画を埋め込んでもうまく再生されない、または動かないことがあります。僕も最初は動かず困りました。よくよく調べてみるとjQueryが関係していることがわかりました。わかる人は修正してください。 

トップページに設置する

最後に完成したスライドをトップページに設置します。事前に設定したpagebuilder by siteoriginで設置したい場所にテキストを用意しておきます。スライドショーが完成するとショートコードが割り振られます。これをコピーしてテキストに貼付けたら完成です。最後まで読んでいただきありがとうございました。

当サービスお得情報紹介・5名限定モニター生募集

当サイトのサービスはサイト作成だけでなく修正・カスタム・アクセスアップだけに留まらず、初心者向けに副業・アフィリエイトのノウハウも紹介しております。少しでも購入者が満足できるようなサービス提供を心がけております。

特に購入して終了ではなく。サービス終了後も定期的なやりとりを通じてお客様の相談・依頼をいただくことが一番重要だと思っております。長い付き合いになると思いますが、当サービスを利用して会社の利益アップ・脱ノウハウコレクターとなりませんか?

サービス概要に関してはこちらです。

 

学生・主婦の方から社会人の方まで幅広くご依頼をいただいております。

上記のサービスはいずれも好評です。特にアフィエイトをしている人でなかなか成果の出ない人や初心者で何からすれば良いのかわからない人にはおすすめのサービスとなっております。

サービスご依頼ご希望の方はサイト内に設置「お問い合わせ」フォームより依頼・または下記よりご連絡ください。当サービスはプロフィールにもありますよう「ココナラ」にて500件以上の販売実績と評価4.8以上であるプラチナ会員認定

ココナラ経由ではなく当サービスの「お問い合わせ」よりご依頼いただいた方には貴重な特典・割引価格で提供しております。このチャンスにぜひご検討ください。

ご依頼お待ちしております。

また、2020年にはあるモニター生が私のコンサルサポートを実施してココナラ での販売を開始しました。2020年7月末から8月末までの1ヶ月間での成果ですが。売り上げではなく、実際の収入見込みが22万達成できました。新規アカウントです。この調子で頑張って欲しいです。

上記のモニター生同様、ココナラ を使って副業サポートコンサル希望のモニター生を5名募集しております。

モニター価格は2種類あります。私が徹底的にサポートまたは定期的なアドバイスの2パターンあります。興味のある方は、こちらも合わせてお問い合わせよりご連絡ください。5名限定なので迷ったらとりあえずご連絡ください。

ご依頼・ご質問等はコチラから。内容を確認次第、順次対応させて頂きます。

お名前
必須
メールアドレス
必須
サービス内容
メッセージ本文
 
最新情報をチェックしませんか?