SliderRevolution 6
今回のプロジェクトで、スライドショーにビデオを埋め込みました。
スライダーで使ったのが多機能なSlider Revolution 6、使われている方も多いと思います。
とにかく多機能です。おおよそスライダーとしてできることは、ほぼほぼ網羅されています。
難点をいうなら、多機能すぎて、慣れるまで、どこで何の設定をするのか把握するのに時間のかかるところでしょうか？
今回は、Slider Revolution 6の多言語対応と、ビデオの埋め込みについて、解説したいともいます。
多言語対応
多言語プラグインのWPMLと連携し、多言語対応のスライドショーに対応します。
スライドを選択した状態で、スライドオプション > WPMLからスライドの言語を選択する簡単仕様です。
一つのスライドショーの中に、例えば日本語と英語の2つの言語を埋め込み、ページの言語に応じて、スライドショーの言語を自動的に切り替えることができます。
全てのスライドについて表示される、グローバルレイヤーには残念ながら対応していない様です。
グローバルレイヤーを使う場合は、それぞれの言語ごとにスライドショーを作る必要があります。
ちょっと残念。
とはいえ、テキストやボタンの配置、トランジションの設定、アクションなど、一方の言語のをそのままコピーして使えるので、作業時間短縮に貢献する、大変便利な機能です。
Youtube ビデオを埋め込む2つの方法
スライドショー内にYouTubeビデオを埋め込み、YouTubeの音声を制御したいというのがクライアントのリクエストでした。
スライドショー内にビデオを埋め込む方法は2つあります。
バックグラウンドとして埋め込むか、レイヤーとして埋め込むかのどちらかです。
バックグラウンドの方が簡単に埋め込めますが、その分設定できる範囲は少なくなっています。
レイヤーとして埋め込むと、制御できる項目が増えますが、その分設定が少し難しくなります。
スライドショー内のYoutubeビデオで音声のコントロール
YouTubeのコントロールを表示する様にすると、音声コントロールはもちろんできる様になるのですが、YouTubeのロゴなども表示されてしまうので、今回は使いませんでした。
スライドショー内にボタンを設置し、ビデオレイヤーのミュートを切り替えられる様にアクションの設定をしました。
Youtubeビデオのサムネール
YouTubeの場合、ビデオ終了時にビデオに埋め込まれているサムネールが表示されます。
これが、次のスライドへのスムーズな移行を妨げることになります。
今回は、ビデオのおしりを切って、ビデオが終了前に、次のスライドへトランジションすることで、この不具合を回避しました。
スマートフォンでの表示
注意が必要なのは、スマートフォンでの表示です。
レイヤーでビデオを埋め込んだ場合、ビデオのタイトル、Youtubeのロゴ、プレイボタンなどが表示され、スライドショーが開始しません。
スマートフォンでもスライドショーを表示したい場合は、レイヤーではなく、バックグラウンドで動画を埋め込む必要があります。
ビデオのタイトル、Youtubeのロゴを非表示にするのは、現在のYoutubeの仕様では簡単でなさそうです。
有料サービスですが、Vimeo Proを使った方が良さそうです。