日本語字幕に切替える方法
YouTube動画プレーヤーは、英語の音声を自動で拾って英語の字幕を表示する機能があります。 更に、この字幕を自動翻訳する機能があり、動画がおうよそ何について言っているのかを理解する手助けになります。
ただ、メニュー階層を幾つか指定する必要があり、翻訳先の選択で日本語は長いリストの最後になるので、日本語に設定するのが手間です。 おまけに、動画ごとにこの指定操作が必要で、かなり大変。 ネットを調べると、この設定をしてくれる拡張機能がある様なのですが、こんなの「Tampermonkey」のスクリプトで出来ると踏んで、作ってみました。
あらかじめの設定は必要
ツールを制作していて、そもそも「英語字幕」を常に表示する設定があるので、これはあらかじめ設定していた方が、ツールの動作がより確実になる事に気付きました。
下は、動画の右下に表示される動画設定のアイコンです。
❶ は「字幕」の表示を「ON/OFF」するスイッチですが、これをONにすると、上図の様に「赤のアンダーライン」が表示されます。（元々字幕を表示しない動画は、このスイッチはグレーアウトして押せません）
このスイッチは手動で「ON」にするか、もし YouTubeのアカウントをお持ちでしたら以下のページで「常にON」にする設定が出来ます。
このページで設定できるのは下の内容です。
「字幕を常に表示する」はデフォルトで「ON」ですが、その下の「自動生成された字幕を含める」も「ON」にすると、先の「赤のアンダーライン」がデフォルトで付く様になります。
日本語字幕に変更する操作
上記の設定で、英字幕を表示できる動画については、英語字幕が常に表示されます。 これを「日本語字幕」に設定変更するのが、このツール「JP-Subtitles」の仕事です。
操作 方法
操作は簡単で、最初の図の ❷「 」のアイコンをクリックするだけです。
通常は、直ぐに動画の画面の左上に下の表示が出ます。
◎ クリックしたタイミングや動画の状況やその他の理由で、数秒の内に上の表示が出ない場合は、もういちど ❷ のボタンを押してみてください。
◎ 動画をリロードして ❷ のボタンを押すと、すんなり切換る場合があります。
◎ 元の英字幕が出ない場合は、先ず英字幕を出す設定を確認してください。
◎ その際、ツールの機能で ❷「 」のアイコンのメニューが素早く消える場合は、「Shift」キーを押したままで、メニューの操作をしてください。
「JP-Subtitles」を利用するには
このツールは Chrome / Edge / Firefox版の拡張機能「Tampermonkey」上で動作します。 以下に、このツールの導入手順を簡単に説明します。
❶「Tampermonkey」を導入します
◎ 使用しているブラウザに拡張機能「Tampermonkey」を導入する事が必要です。
既に「Tampermonkey」を導入している場合は、この手順 ❶ は不要です。
拡張機能の導入については、以下のページに簡単な説明があるので参照ください。
❷「Tampermonkey」にスクリプトを登録します
◎「Tampermonkey」の「＋」マークの「新規スクリプト」タブを開きます。
◎「新規スクリプト」には、最初からテンプレートが記入されています。 これは全て削除して、完全に空白の編集枠に 下のコードをコピー&ペーストします。
〔コピー方法〕 軽量シンプルなツール「PreBox Button 」を使うと
コード枠内を「Ctrl+左Click」➔「Copy code 」を「左Click」
の操作で、掲載コードのコピーが可能になります。
◎ 最後に「ファイル」メニューの「保存」を押すと、ツールが使用可能になります。
〔 JP-Subtitles 〕 ver. 0.1
// ==UserScript==
// @name JP Subtitles
// @namespace http://tampermonkey.net/
// @version 0.1
// @description YouTube動画の日本語字幕をワンタッチで表示する
// @author everyone
// @match https://www.youtube.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=youtube.com
// @grant none
// ==/UserScript==
let able_flag;
let target=document.querySelector('head');
let monitor=new MutationObserver(main);
monitor.observe(target, { childList: true });
main();
function main(){
able();
jp_set();
end(); }
function jp_set(){
let h_v_p_p_m=document.querySelector('.html5-video-player.playing-mode');
let y_s_b=document.querySelector('.ytp-settings-button');
if(y_s_b && h_v_p_p_m){
y_s_b.onclick=function(e){
if(!e.shiftKey && able_flag==1){
push_0();
setTimeout(()=>{
push_1();
hide(); }, 20);
setTimeout(()=>{
push_2();
hide(); }, 200); }
else{
if(able_flag==1){
able_flag=0; }}}}}
function able(){
let y_sb_b=document.querySelector('.ytp-subtitles-button');
if(y_sb_b){
if(y_sb_b.getAttribute('aria-pressed')=='true'){
able_flag=1; }
else{
able_flag=0; }}}
function hide(){
let y_s_m=document.querySelector('.ytp-settings-menu');
if(y_s_m){
y_s_m.style.display='none'; }}
function push_0(){
let y_menu=document.querySelectorAll('.ytp-menuitem');
for(let k=0; k<y_menu.length; k++){
if(y_menu[k].querySelector('.ytp-menuitem-icon')){
if(y_menu[k].textContent.includes('字幕')
&& y_menu[k].querySelector('.ytp-menuitem-label-count')){
if(able_flag==1){
y_menu[k].click(); }}}}}
function push_1(){
let y_m=document.querySelectorAll('.ytp-menuitem');
for(let k=0; k<y_m.length; k++){
if(y_m[k].textContent.includes('自動翻訳')){
if(able_flag==1){
y_m[k].click(); }}}}
function push_2(){
let y_m=document.querySelectorAll('.ytp-menuitem');
for(let k=0; k<y_m.length; k++){
if(y_m[k].textContent.includes('日本語')){
if(able_flag==1){
y_m[k].click(); }}}}
function end(){
let y_m_c=document.querySelectorAll('.ytp-menuitem-content');
for(let k=0; k<y_m_c.length; k++){
if(y_m_c[k].textContent.includes('>> 日本語')){
able_flag=0;
let y_s_m=document.querySelector('.ytp-settings-menu');
if(y_s_m){
y_s_m.style.display='inherit'; }}}}
「JP-Subtitles」最新版について
旧いバージョンの JavaScriptツールは、アメーバのページ構成の変更で動作しない場合があり、導入する場合は最新バージョンをお勧めします。
●「JP-Subtitles」の最新バージョンへのリンクは、以下のページのリンクリストから探せます。
