ブラウザ拡張機能、｢Simple Translate｣という翻訳tool、複数のブラウザで同じ様に使う

# ブラウザ拡張機能、｢Simple Translate｣という翻訳tool、複数のブラウザで同じ様に使う
![｢Simple Translate｣](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_ST_0_pic.png)

※翻訳系拡張機能はいくつもあるので注意
※アイコンは ->『Aあ』、![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_ST_0_icon.png) これが目安
※この記事では複数ブラウザとして Chrome、Vivaldi、Opera、Firefox を例にしている

__index as 目次__
1. DeepL翻訳 APIキーを入手(無料)
2. ｢Simple Translate｣設定
   2-1. 設定をカスタム
   2-2. 設定をファイルに保存(後に使用)
3. 使用するブラウザで｢Simple Translate｣をDL
4. 各ブラウザでの同じ設定の適用

## 前文
個人使用での範囲なのでDeepL無料版の文字数制限で、まったくもって問題なし大丈夫、というケースを想定しています。
DeepLの翻訳がより自然でGoogle翻訳よりいいなと思ってるDeepL推奨の立場です。

 
__手順について(｢index as 目次｣の順番についての諸注意)__
- DeepLを使わないなら 1の『DeepL翻訳 APIキーを入手(無料)』は飛ばしてOK。
	- その場合Google翻訳を選択することになる
	- 自然な翻訳文から少し遠ざかる (DeepL推奨なので)
- 1の『DeepL翻訳 APIキーを入手(無料)』と2の『｢Simple Translate｣設定』どちらが先でも構わない
- 複数ブラウザで使う用事がなければ最後の4『各ブラウザでの同じ設定の適用』は飛ばしてOK

__ユースケース__
webページをまるっと翻訳するのではなく、パラグラフ(段落)ごとに翻訳されたものが読めたら充分、というやり方。
ついでに普段ブラウザを複数使うことがあるので、同じ設定で同じ様な翻訳精度＆翻訳文が出ると便利かな 否むしろそうしたい、というヒト向け。

__翻訳文の出し方__
この記事では、ブラウザ上で英語ページの **翻訳したい英文(の範囲)を選択したら、翻訳文出る、という様式**で説明を進めています。この辺はお好みで変更なりなんなりして下さい。
※こういうのは設定で変更できる：翻訳ボタンのアイコンを出すとか、それをクリックしたら、とか

- - -
## 1. DeepL翻訳 APIキーを入手(無料)
｢Simple Translate｣の設定でDeepLを選択すると必要なので入手しておきます。ちなみに翻訳エンジンはDeepLとGoogle翻訳の２択。

https://www.deepl.com/pro-api<!--?cta=header-pro-api<!--DeepL翻訳 API-->

の、[無料で登録する]ボタンをクリック、またはページを少し下にスクロールして2種あるプラン「無料版」｢¥630/月｣のうち無料版の[無料で登録する]ボタンをクリックして無料版APIのキーをゲットします。APIキーとか認証キーとかいうやつです。

カンタンなので図説は無し。本稿のメイン趣旨である以降は図説(ScnSht)付き。

## 2. ｢Simple Translate｣設定
### 2-1. 設定をカスタム
普段メインで使ってるブラウザでいいので、｢Simple Translate｣ の設定をカスタム。

__｢Simple Translate｣設定画面__
こういう画面です。
![｢Simple Translate｣設定画面](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_0.png)

1. ブラウザの拡張機能のアイコンがあるところから
2. ｢Simple Translate｣のアイコン『Aあ』のやつを選んで右クリックメニュー出して
3. ｢オプション｣をクリックしたら、ブラウザに設定画面が出る

__検索エンジン <font color=lightseagreen>↓↓ココ</font>__
DeepLを選んで取得しておいた 認証キーを入力
{cap: 設定：全般 - 検索エンジン}
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_1.png)


__翻訳先の言語、第二言語__
日本語を英語に翻訳する設定。この例ではアメリカ英語にしてる。イギリス英語がいいならイギリス英語に。
{cap: 設定：翻訳先、第二言語}
<img src="https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_2.png"  width="75%">

__テキスト選択時の動作 <font color=lightseagreen>↓↓ココ</font>__
例1) 翻訳したい英文(の範囲)を選択したら、翻訳文出る、という様式
* 3択からは｢翻訳パネルを表示する｣
* ｢翻訳の必要がなければ翻訳ボタンを表示しない｣にはチェックあり
::: note warn
好きにカスタムすべし
自分はコレが使いやすいのでこうしてるだけ
:::
{cap: 設定：webページ - テキスト選択時の動作}
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_3.png)



__装飾キーが押されたときに翻訳する__
~~この例では [Alt] が押されてるあいだ翻訳を表示する。~~ いや面倒クサくなったので**キー押されてる間とかやめたんだったワ**。 ｢装飾キーが押されたときに翻訳する｣にチェックない状態。
{cap: 設定：webページ - 装飾キー、第二言語に切り替え}
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_4.png)
~~※別に [Alt] じゃなくても、好きなキー or 押さえやすいキー を選択したらいい。~~ <font color=seagreen>いやコレ[Alt] は設定してるだけ、 ｢装飾キーが押されたときに翻訳する｣に**チェック無しなので、もはや関係ない意味ナイ。**</font>

__翻訳の無効化__
翻訳の無効化：特に言及すること無し、例はこう。
{cap: 設定：翻訳の無効化}
<img src="https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_5.png" width="75%">

__ツールバーポップアップ__
例2) 翻訳文(=｢翻訳パネル｣)出るまでのタイムラグ、この例では180ミリ秒
{cap: 設定：ツールバーポップアップ_その１} 
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_6.png)
 ※初期値は200ミリ秒だか300ミリ秒だったか…(忘れた)…

ページ翻訳：特に言及すること無し
{cap: 設定：ツールバーポップアップ_その2} 
<img src="https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_7.png" width="75%">

__翻訳ボタン__
この例では一応設定してるが、実際はこれより前の項目で __翻訳ボタン表示しない設定にしてるので__  実は意味ない。
{cap: 設定：翻訳ボタン} 
<img src="https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_8.png" width="75%">

__翻訳パネル  <font color=lightseagreen>↓↓ココ</font>__
例3) タテヨコ大きさ：500 x 380 (単位px) 
　　※これより長い場合は翻訳文の領域の｢翻訳パネル｣にスクロールバーが出る
　　お使いのディスプレイの解像度によって自分好みの大きさにしてください。
　　※ちなみに、選択した後 ページをスクロールしたら(当然ながら)この位置関係は変動します
例4) 翻訳パネルの位置：選択範囲の上 (初期値では下)
例5) 翻訳パネルの色：背景色は薄っいブルー、文字色は濃い〜ブルー(てか紺色)
{cap: 設定：翻訳パネル} 
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_9.png)

::: note warn
好きにカスタムすべし
ディスプレイ設定によっては 500 x 380 は小さいし、フォントサイズ 14px というのも人によっては小さく感じるかも...?
:::

### 2-2. 設定をファイルに保存(後に使用)
｢設定をエクスポート｣の項目から。[エクスポート]ボタンをクリックして保存。分かりやすい所に保存。
{cap: 設定：その他}
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_10_1.png)
のちに、他のブラウザで同じ設定を使える様に読インポートしてみ込むので、分かりやすい場所・分かりやすいファイル名で保存する。

## 3. 使用するブラウザで｢Simple Translate｣をDL
❶ **それぞれのブラウザで** 拡張ストアの **該当ページを**開いく

🌀Chrome、Vivaldi、Opera の場合：

https://chrome.google.com/webstore/detail/simple-translate/ibplnjkanclpjokhdolnendpplpjiace

🌀Firefoxの場合：

https://addons.mozilla.org/ja/firefox/addon/simple-translate/ 


❷ ”拡張機能を入れる”的なボタンがあるのでクリックして拡張機能をインストール
1. Chromeの場合：[Chromeに追加する]
2. Vivaldiの場合：[Chromeに追加する]
    1. __もしVivaldiでインストールボタンが見当たらない場合__、Vivaldiの設定いじってて見えなくなってる。
    2. ウェブストアオプションを有効にする：**設定 > プライバシーとセキュリティ > Google拡張機能**、**｢ウェブストア｣** のチェックを入れる。
 {cap: Vivaldi 設定}
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_11.png)
3. Operaの場合：[Operaにインストール]
4. Firefoxの場合：[Firefoxにインストール]

## 4. 各ブラウザでの同じ設定の適用
保存した設定ファイルを各ブラウザでの｢Simple Translate｣で読み込み＆適用させる
1. ブラウザの拡張機能のアイコンがあるところから
2. ｢Simple Translate｣のアイコン『Aあ』のやつを選んで右クリックメニュー出して
3. ｢オプション｣をクリックしたら、ブラウザに設定画面が出る
4. スクロールして下の方、その他 の項目の｢設定をインポート｣から保存した設定ファイルを適用

{cap: 設定：その他}
![](https://blog-imgs-157.fc2.com/g/t/r/gtrinthesky/cap_STsetting_10_2.png)
これをそれぞれのブラウザで行うと、ブラウザが違っても同じ様な挙動で翻訳文を出すことが出来る。




終わり。