今日は、シンプルでありながらとても役に立つ小さなトリックを紹介したい。YouTubeのコミュニティ投稿を開いたとき、プレビューで興味深い画像が切り抜かれて表示されていた経験があるなら、このブックマークレットが画像全体のURLを表示する助けになる。
このアイデアは、動画「How To See The Entire Uncropped Community Tabs Image」から着想を得たものだ。できあがったのは、ごく小さなブラウザ用ブックマークレット。YouTubeの画像URLを表示しているときにクリックすると、切り抜き版の画像アドレスを、切り抜かれていない版へ書き換えてくれる。
仕組み
YouTubeの画像URLには、多くの場合、アドレス末尾付近にサイズや切り抜きに関するパラメータが含まれている。一部のコミュニティ投稿画像では、切り抜き版に -c- という区切りが含まれる。このブックマークレットは、現在のページURLがそのパターンに一致するかを確認し、切り抜き用の接尾部分を削除して、よりきれいな画像URLでブラウザを再読み込みする。
言い換えると、切り抜かれた画像URLをベース画像URLに変換し、ブラウザがフルバージョンを直接リクエストできるようにする。
セットアップ
このブックマークレットは、最近のデスクトップブラウザなら手動でインストールできる。
- ブラウザのブックマークバーを表示する。
- 新しいブックマークを作成する。
- 名前を
YouTube Image Uncropperにする。 - 下のブックマークレットコードを、ブックマークのURLまたは場所の欄に貼り付ける。
- 保存する。
切り抜かれたYouTube画像URLを表示しているときに、そのブックマークをクリックする。URLが想定されるYouTube画像パターンに一致すれば、ページは切り抜かれていない画像で再読み込みされる。
ブックマークレットコード
この行全体をブックマークのURL欄に貼り付ける。
javascript:(()=>{const url=window.location.href;const ytImageRegex=/^(https://yt3.ggpht.com/.*?)-c-.+$/;if(ytImageRegex.test(url)){const uncroppedUrl=url.replace(ytImageRegex,'$1');window.location.href=uncroppedUrl;}else{alert('This bookmarklet works only on YouTube image URLs.');}})();
読みやすいように、同じコードを複数行に整形すると次のようになる。
javascript: (() => {
const url = window.location.href;
const ytImageRegex = /^(https://yt3.ggpht.com/.*?)-c-.+$/;
if (ytImageRegex.test(url)) {
const uncroppedUrl = url.replace(ytImageRegex, '$1');
window.location.href = uncroppedUrl;
} else {
alert('This bookmarklet works only on YouTube image URLs.');
}
})();
簡単な確認
このブックマークレットは意図的に対象を絞っている。https://yt3.ggpht.com/...-c-... に一致するURLにだけ作用する。YouTubeが画像URLの形式を変更した場合は、まず画像アドレスを確認し、ブックマークレットを編集する前に、切り抜きマーカーがまだ存在するかどうかを確かめるとよい。
着想への感謝
着想を与えてくれた「How To See The Entire Uncropped Community Tabs Image」の制作者に感謝したい。役に立つ修正は、ときにURLを注意深く見るだけで見つかるのだと、あらためて思い出させてくれる。
さあ、切り抜きを解除しよう
必要なことはこれだけだ。ブックマークレットを保存し、切り抜かれたYouTubeコミュニティ画像を開き、一度クリックして切り抜かれていない版を試す。シンプルで、素早く、プレビューが本当に見たかった部分を隠しているときに便利だ。
