選択範囲の英文を1クリックでDeepL翻訳するブックマークレット

英語のサイトで翻訳したい部分を選択して1クリックするだけで、自動でDeepLのサイトに移動し選択範囲の文章を翻訳するブックマークレットを作成しました。

PCで頻繁にDeepL翻訳を利用する方はどうぞ!

 

[DeepLサイトに移動→コピペ] の固定作業を省ける

海外のWebサイトの英語文章の翻訳にはDeepL翻訳が重宝しますが、翻訳したいと思うたびに毎回DeepLのサイトに移動し、翻訳したい文章をコピー&貼り付けするのが面倒です。

そこで、翻訳したい範囲を選択して1クリックするだけで、サイトへの移動翻訳元文章の貼り付けを勝手にやってくれるブックマークレットを作成しました。

1分もかからず導入できるのでぜひご利用ください!

ブックマークレット
ブックマークと同じ見た目で、クリックすると簡易的なプログラムを実行できる。
中身はJavaScript。Webページの操作や移動、自動入力などに使える。

※PCでの利用を想定しています。

 

選択範囲をDeepL翻訳

導入方法 (最短10秒)

以下の「選択範囲を翻訳」ボタンをブラウザのブックマークバーにドラッグ&ドロップするだけで完了。

使うときは追加されたブックマークレットをクリックするだけ。

See the Pen
選択範囲をDeepL翻訳
by Pajoca (@Pajoca)
on CodePen.

CC0
Pajoca (パジョカ) はこのソースコードの全ての著作権および関連する権利をCC0により放棄しています。

※ブックマークバーの表示方法
お使いのブラウザでブックマークバーが表示されていない場合は、以下のショートカットキーを押すことで表示・非表示の切り替えができます。
Ctrl+Shift+B (Chrome/Firefox/Edge)
(ブックマークバーの場所はアドレスバーのすぐ下です)

※ボタン名(選択範囲を翻訳)は導入後、変更しても問題ありません。

 

使い方

選択範囲をDeepL翻訳するブックマークレットの使い方

  1. 翻訳したい範囲を選択
  2. ブックマークレット「選択範囲を翻訳」をクリック

→ 自動でDeepLに移動し、選択範囲の翻訳結果が表示される

 

選択範囲をDeepL翻訳するブックマークレットの使い方

 

適当な英文で試してみたい方は、こちらのリンク先の文書(上画像の論文)を翻訳してみてください。
(ちなみに論文はCC0(パブリックドメイン)です。)

 

仕様 & 更新履歴

仕様 (注意点)

PDFでは利用できない

ブックマークレットの仕様上、PDFなどWebサイトでないドキュメントの選択範囲を取得することができません

そのためPDFでは本ブックマークレットが機能しません。

代わりに、こちらのブックマークレットをご利用ください。

PDFをDeepL翻訳

元の文章から余分な改行を除去した上でDeepL翻訳したい時に、入力ボックスにコピペして1クリックするだけで自動でDeepLのサイトで改行除去済み文章の翻訳を実行するブックマークレットを作成しました。 ブラウザのブックマークバーから1ク[…]

余計な改行を削除してDeepL翻訳するブックマークレットの見た目

従来、PDFの文章をコピーしてDeepLにそのまま貼り付けると行末に余計な改行が混入して正しく文章を翻訳できないことがよくありますが、上記リンクのブックマークレットを利用すれば自動で余計な改行を除いてDeepL翻訳を実行できるので大変便利です。

特に海外の論文やPDF文書を閲覧する機会が多い方は時間を大幅に節約できると思いますので、ぜひご利用ください!

半角スラッシュ( / ) は半角セミコロン( ; ) に置換して翻訳される

このブックマークレットは選択範囲の文章を取得してDeepLにURL経由でテキストを送信している仕様です。

URL中に半角スラッシュが入っていると、そこで翻訳がストップしてしまう問題が元々ありました。

それを回避するため文章中の半角スラッシュは全て半角セミコロンに置換された上で翻訳される仕様にしています。

スラッシュとセミコロンでは見た目が変わってしまいますが、翻訳結果の文章はそこまで大きな差が無かったのでこの記号にしました。

(全角スラッシュ( / ) だと英文が和訳されずに残ってしまう事例が頻発したため置換記号として使えませんでした。)

他社製のDeepL翻訳系ブックマークレットでは半角スラッシュの入った文章に非対応な場合もあるため、私のブックマークレットをお使いください。

非対応の文字がある

半角スラッシュ以外の翻訳ストップ文字には現在対応していません。

ただ今のところそのような文字は、英文で全く見かけない半角バーティカルバー( | )くらいしか見つかっていないので問題ないと判断しそのままにしています。

 

更新履歴

バージョン 更新日時 更新内容
1.0.0 2021/12/18 初版公開。

 

ほかの便利な翻訳ブックマークレット

余計な改行を削除してDeepL翻訳 (PDFなどで便利)

海外の論文やPDF文書を閲覧している際にDeepL翻訳するためにテキストをコピーしてDeepLに貼り付けても、余計な改行が混入して正しく文章を翻訳できないことが多々あります。

そこで、ワンクリックで入力ボックスを表示させ、そこに翻訳したい文章を貼り付けてOK押すと、DeepLに自動で移動して改行を除去した状態で翻訳できるブックマークレットを作成しました。

以下のページで導入手順と使い方を説明しています。

PDFをDeepL翻訳

元の文章から余分な改行を除去した上でDeepL翻訳したい時に、入力ボックスにコピペして1クリックするだけで自動でDeepLのサイトで改行除去済み文章の翻訳を実行するブックマークレットを作成しました。 ブラウザのブックマークバーから1ク[…]

余計な改行を削除してDeepL翻訳するブックマークレットの見た目

 

(没) 選択範囲を改行除去DeepL翻訳 (PDF非対応)

Webサイトで選択した範囲の英文から、改行を除去した上でDeepL翻訳するブックマークレットです。
(つまり、本記事上部で配布している「選択範囲をDeepL翻訳」の改行除去機能付き版です)

PDF非対応なのであまり使い道が無さそうで没扱いですが、たまに普通のサイトでも横幅が広くなりすぎないよう文の途中で改行してしまっているサイトを見かけるのでその時は使えると思います。

See the Pen
選択範囲の改行を除去してDeepL翻訳(PDF非対応)
by Pajoca (@Pajoca)
on CodePen.

CC0
Pajoca (パジョカ) はこのソースコードの全ての著作権および関連する権利をCC0により放棄しています。

更新履歴

バージョン 更新日時 更新内容
1.0.0 2021/12/18 初版公開。

 

ブックマークレット制作依頼受付中

今回のような翻訳用ブックマークレットに限らず、Webサイトの自動入力や特定URLへの条件付き移動など何かしらの便利機能を持ったブックマークレットが欲しい場合はコメント欄や私のTwitterアカウントなどにご投稿ください!

私が作れる範囲で制作致します!

もちろん無料ですが、お作りしたブックマークレットは本サイト(情報の海を泳ぐ)やその他の場所で紹介・配布させていただきますのでご了承ください。
(誰でも自由に利用できるCC0(パブリックドメイン)として公開・配布します。せっかく便利なブックマークレットが作れたなら、みんなで自由に利用できるようにしたい! という趣旨です😸)

 

開発者向け情報

ライセンス (ご自由にお使い頂けます)

本ブックマークレットのソースコードはCC0 1.0(パブリックドメイン)で公開しているため、商用・非商用問わず誰でも自由に複製・改変・再配布できます。

またご利用にあたって申請も連絡もクレジット表記も不要です。

自分好みに改造するなどしてご自由にお使いください。

コメント欄でこのブックマークレットを改造したものなど投稿を受け付けております。

もしよろしければカスタマイズしたブックマークレットをコメント欄で公開して頂けると嬉しいです!

ソースコードの閲覧方法

こちらからコードを閲覧できます↓

リンク①:選択範囲をDeepL翻訳

リンク②:選択範囲の改行を除去してDeepL翻訳(PDF非対応)

HTML/CSS/JavaScriptいずれのコードもCC0(パブリックドメイン)なので自由にお使いいただけます。

※ソースコートの中身については本記事でも下の方で記載・説明しています。

※CodePen側とのライセンス相違について

本ブックマークレットはCodePenというオンラインHTML/CSS/JavaScript共有サービス上で公開しています。

CodePen上で公開したHTML/CSS/JavaScriptは全てMITライセンスとして扱われるサイト仕様になっているのですが、このソースコードは私が自作したものなのでCC0(パブリックドメイン)と私は勝手に宣言しています

MITライセンスで必要な著作権表示やライセンス文書の掲載が無くても私がそれを理由に訴えるようなことは一切ないのでご安心ください

 

ソースコードの説明

javascript:(function(){
  let txt=window.getSelection()+"";
  window.open("https://www.deepl.com/translator#en/ja/"+encodeURIComponent(txt.replace(/\//g, ";")));
})();

流れとしては選択中の文字列を取得し、その文字列をエスケープしてDeepLのURLに付けてDeepLサイトに移動しているだけです。

選択している文字列(のオブジェクト)を getSelection() で取得して空文字を加えて文字列に変換し、 スラッシュをセミコロンに置換した上でencodeURIComponent()でエスケープしてDeepLのURLの後ろに付けています。

URL上で翻訳対象の文字列を渡せるような翻訳サイトであればDeepLに限らず利用可能です。

選択範囲を1クリックでDeepL翻訳するブックマークレットを導入!
記事化前の最新情報はこちらで先にツイートしています。サイト更新告知もこちら。