Flaskで管理画面やエラーページを多言語対応させる手順！初心者でもできる翻訳設定

Flaskで管理画面やエラーページを多言語対応させる手順まとめ

先生と生徒の会話形式で理解しよう

生徒

「Flaskで作ったWebサイトの管理画面や、エラーが起きたときに出る画面も、日本語と英語の両方で表示させたいです！」

先生

「それは素晴らしい視点ですね。ユーザーが見るページだけでなく、管理者が見る画面やエラーページもしっかり多言語化することで、世界中の人が使いやすいシステムになります。」

生徒

「エラーページまで翻訳するのは難しそうですが、どうやって設定するんですか？」

先生

「Flask-Babelという拡張機能を使えば、一括で管理できます。具体的な手順を見ていきましょう！」

1. Flask-Babelを使った多言語対応の仕組みとは

Webサイトを多言語に対応させることを、専門用語で「国際化（i18n）」と呼びます。Pythonの人気フレームワークである「Flask（フラスク）」では、この国際化を「Flask-Babel（フラスク・バベル）」という道具を使って行います。

仕組みはとてもシンプルです。プログラムの中に「ここを翻訳したい！」という印をつけておき、別に用意した「翻訳辞書（メッセージカタログ）」から、その時の言語に合わせた言葉を引っ張ってくるだけです。管理画面のように文字が多い場所や、突然表示されるエラーページでも、この仕組みを使えば一瞬で言葉を切り替えることができます。パソコン操作が初めての方でも、翻訳専用の辞書を作るイメージを持てば大丈夫です。

2. 翻訳機能をアプリに導入する準備

まずは、翻訳機能を使うための準備をしましょう。パソコンに専用のツールを入れるために、コマンドプロンプトなどの画面に以下の命令を入力します。これを「インストール」と言います。


pip install Flask-Babel

インストールができたら、Pythonのコードで「これから翻訳機能を使います」と宣言します。以下のコードは、アプリの基礎となる部分です。どの言語を表示するかを判断する「ロケールセレクター」という機能も一緒に作っておきます。ロケールとは、言語や地域の情報のセットのことです。


from flask import Flask, request, render_template
from flask_babel import Babel, _

app = Flask(__name__)
# 翻訳の道具をアプリに紐付けます
babel = Babel(app)

@babel.localeselector
def get_locale():
    # ブラウザの言語設定を確認して、日本語か英語を選びます
    return request.accept_languages.best_match(['ja', 'en'])

@app.route('/')
def home():
    return render_template('index.html')

この _() という不思議な記号が重要です。この括弧の中に書いた言葉が、後で翻訳の対象になります。プログラミング未経験の方は、これを「翻訳してほしい言葉を包む魔法の袋」だと思ってください。

3. 管理画面のメニューやボタンを翻訳する方法

管理画面は、データを登録したり削除したりする大切な場所です。ここにある「保存」や「削除」といったボタンの文字を翻訳できるようにしましょう。通常、Flaskでは「templates（テンプレート）」というフォルダの中にHTMLファイルを作って画面を構成します。そのHTMLファイルの中で翻訳の記号を使います。


<!-- admin.html という管理画面のファイルです -->
<nav>
    <ul>
        <li>{{ _('ダッシュボード') }}</li>
        <li>{{ _('ユーザー管理') }}</li>
        <li>{{ _('設定変更') }}</li>
    </ul>
</nav>

<button>{{ _('変更を保存する') }}</button>

このように、二重の波括弧 {{ }} の中に _('言葉') と書くと、画面が表示される瞬間にシステムが辞書を引いて、日本語なら「ダッシュボード」、英語なら「Dashboard」に自動で書き換えてくれます。一つのファイルを作るだけで、何カ国語にも対応できるので、とても効率的ですね。

4. 突然のエラーページを多言語対応させる

Webサイトを使っていると、ページが見つからないとき（404エラー）や、サーバーで問題が起きたとき（500エラー）に、冷たい英語のメッセージが出ることがありますよね。これを自分の言葉で、しかも多言語で表示できれば、ユーザーは安心します。Flaskでエラーページをカスタマイズする方法も、翻訳の仕組みと一緒に使えます。


@app.errorhandler(404)
def page_not_found(e):
    # エラーメッセージを翻訳対象にして画面に渡します
    error_message = _('お探しのページは見つかりませんでした。')
    return render_template('error.html', message=error_message), 404

このプログラムでは、404エラーが発生したときに error.html という画面を表示するように指示しています。その際、翻訳用の袋に入れたメッセージを一緒に届けているのです。これで、どんなトラブルが起きても、世界中の人に分かりやすい言葉で状況を説明できるようになります。親切なサイト作りには欠かせない設定です。

5. 翻訳辞書（メッセージカタログ）の作成手順

プログラムの中で _() を使って言葉を登録したら、次は「日本語ならこう」「英語ならこう」という対応表を作る作業が必要です。これを「辞書作り」と呼びます。少し専門的な操作になりますが、決まった命令をパソコンに入力するだけで自動的に土台が作られます。

まず、プログラムの中から翻訳したい言葉を全部集める命令を出します。次に、言語ごとのフォルダ（jaなら日本語用、enなら英語用）を作ります。その中に出来たファイルを開いて、実際に翻訳した言葉を書き込んでいきます。最後に、その辞書をコンピュータが読める形式に変換する「コンパイル」という作業を行います。コンパイルとは、人間が書いた文字をコンピュータ専用の言葉に翻訳することです。この作業を忘れると、せっかく書いた翻訳が反映されないので注意しましょう。

6. 多言語化における文字化けと対処法

日本語を扱うプログラミングで、初心者が最も驚くのが「文字化け」です。画面に表示された文字が、わけのわからない記号の羅列になってしまう現象です。これは、コンピュータが文字を読み取るルール（文字コード）が一致していないために起こります。多言語対応をする際は、必ず「UTF-8（ユーティーエフ・エイト）」という世界共通の文字ルールを使うようにしましょう。

辞書ファイルを保存するときに「UTF-8で保存」という設定を選べば、ほとんどの文字化けは防げます。もし文字化けが起きたら、「ルールが間違っているんだな」と考えて、保存し直してみてください。最初は戸惑うかもしれませんが、一度覚えてしまえば難しいことはありません。丁寧な設定が、綺麗な多言語サイトの基本です。

7. 管理者の設定で言語を固定する方法

基本的にはブラウザの言語に合わせるのが親切ですが、管理画面だけは「システム管理者が決めた特定の言語」で表示したい場合もあります。例えば、日本の会社で使う管理画面なら、どこからアクセスしても日本語に固定したいかもしれません。そのような場合は、プログラムの設定を少し変えるだけで実現できます。


@app.route('/admin')
def admin_panel():
    # 管理画面だけは強制的に日本語（ja）として扱う設定例です
    # 実際にはログインユーザーの設定情報を読み取ったりします
    user_lang = 'ja' 
    return render_template('admin.html', lang=user_lang)

このように、特定の場所だけルールを変えることも自由自在です。多言語対応とは、単に言葉を直すだけでなく、「誰が、どこで、どの言葉を必要としているか」を考えて、適切に提供することなのです。これができるようになると、あなたのアプリは一気にプロフェッショナルなものに近づきます。