【Video Control for Instagram】動画にコントロールバーを表示する拡張機能
![「Instagram」のアイコン画像](https://www.naporitansushi.com/wp-content/uploads/2022/11/Instagram-icon2.png)
この記事では、PC版ウェブサイト版「Instagram」のストーリーやリールなどの動画に、コントロールバー(シークバー)を設置してくれるChrome拡張機能「Video Control for Instagram」について書きます。
「YouTube」みたいに、再生地点を変更したり、再生・一時停止、全画面、再生速度の変更、ピクチャーインピクチャー機能を利用できます。
PC版ウェブサイト「Instagram」の動画には、他サイトでは、当たり前のようにあるコントロールバー(シークバー)が実装されていません。
シークバーがないので、動画の総時間に対して、どのくらい再生したのか、どの地点にいるのかが一切分からないようになっています。5秒地点から再生する…といった再生地点の変更もできません。
![PCウェブサイト版「Instagram」のリール動画画像](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_08-1000x716.png)
唯一、マウスクリックでの再生・一時停止と、右下の音量ミュート切り替えができます。「YouTube」や、他の動画サイトと比べて、かなり不便だと思います。
本拡張機能を導入することで、「YouTube」などの動画サイトと同様、進行状況バーを表示してくれます。10秒の動画で、今4秒地点を再生している…といったように、確認できます。再生地点の変更、音量調整、ミュート切り替え、再生速度変更、ピクチャーインピクチャーなども可能になります。
「Instagramのリール動画が見にくい!再生バーが欲しい!」という方、参考にしてみてください。本記事は、拡張機能を導入できるPCブラウザ向けです。スマホアプリ版ではできません。動画も作成しました。
余談ですが、あのバーの正式名称が分かりません。気分によってコントロールバー、シークバー、進行状況バー、再生バーとか呼んでいます(笑)
リリース元:David Schulte(Instagram、YouTube)
記事執筆時のバージョン:0.7(2023年12月6日)
インストール方法
Chromeウェブストアからインストールできます。
Firefoxをご利用の方は、以下のFirefoxアドオンストアからインストールできます。
「Firefoxへ追加」をクリックします。
「Chromeに追加」をクリックします。
![「Video Control for Instagram」拡張機能をインストールする手順画像1](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_03-1000x537.png)
「拡張機能を追加」をクリックします。
![「Video Control for Instagram」拡張機能をインストールする手順画像2](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_01.png)
拡張機能のオーバーフローメニュー内に、拡張機能ボタンが追加されればOKです。
![「Video Control for Instagram」拡張機能をインストールする手順画像3](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_02.png)
使い方
動画を再生する
本拡張機能を導入した状態で、「Instagram」にアクセスします。既に開いていた場合は、一度リロードします。適当に動画を探します。左側サイドバーの「リール動画」を押すと、すぐに確認できます。
![PCウェブサイト版「Instagram」のリール動画にアクセスする手順画像](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_05.png)
僕は、試しに自分が投稿した亀さんのリール動画を見てみます。
![PCウェブサイト版「Instagram」で、ナポリタン寿司が作成したリール動画を開く手順画像](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_07-1000x630.png)
コントロールバーで再生地点の変更
動画を開いたら、拡張機能導入前はなかったコントロールバーが、下部に表示されます。
![「Video Control for Instagram」拡張機能で再生地点を変更する手順画像1](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_09-1000x441.png)
動画を再生すると、バーも同じように右に向かって進行します。好きなバー上をクリックすることで、再生地点を変更できます。適当に飛ばし飛ばしで見ることが可能です。
![「Video Control for Instagram」拡張機能で再生地点を変更する手順画像2](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_10.png)
音量変更・ミュート
音量ボタンにマウスを乗せると、音量調整スライダーが表示されます。
![「Video Control for Instagram」拡張機能で音量調整する手順画像](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_11.png)
再生速度変更・ピクチャーインピクチャー
コントロールバー内の三点ボタン(⋮)をクリックします。再生速度変更、ピクチャーインピクチャーの項目が表示されます。
![「Video Control for Instagram」拡張機能でピクチャーインピクチャーを利用する手順画像1](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_12.png)
ピクチャーインピクチャーにすることで、最前面固定化されて、好きな場所に移動できます。まぁあんまりピクチャーインピクチャーしながら見るような動画は、Instagram上にはないかなという印象です。
![「Video Control for Instagram」拡張機能でピクチャーインピクチャーを利用する手順画像2](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_13-1000x698.png)
動画の右クリックもできるようになる
拡張機能導入前は、動画上で右クリックしても、何も表示されませんでした。拡張機能導入後は、動画上での右クリックで、動画のメニューを表示してくれます。
ループ、すべてのコントロールを表示、動画フレームをコピー、ピクチャーインピクチャーなどの機能にアクセスできます。
![「Video Control for Instagram」拡張機能を導入して右クリックした画像](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_14.png)
ストーリー動画でも利用できる
リール動画だけでなく、ストーリー動画にも反映されます。ストーリーの写真だと表示されませんが、映像だと表示されます。
![「Video Control for Instagram」拡張機能を導入したストーリー動画画像](https://www.naporitansushi.com/wp-content/uploads/2023/11/video-control-for-instagram_06-1000x585.png)
【余談】「YouTube」のショートを通常動画で再生する方法
「Youtube-shorts block(ユーチューブ・ショート・ブロック)」拡張機能を導入することで、ショート動画を開いた時、自動的に通常の動画リンクに置き換えて再生してくれます。
置き換えることで、通常動画と同じようにコントロールバー(シークバー)が表示されます。ショート動画を再生・閲覧しやすくなります。快適です。
詳しくは、下記記事を参考にしてみてください。
感想
以上、PC版ウェブサイト版「Instagram」のストーリーやリールなどの動画に、コントロールバー(シークバー)を設置してくれるChrome拡張機能「Video Control for Instagram」についてでした。
インストールするだけで、他の余計な設定・作業が必要ないので、初心者さんでも導入しやすいかなと思います。
本記事で利用させていただいたアイコン画像:社会-メディアは instagramでは スクエア – ソーシャルメディアとロゴ アイコン