如何为Django Admin创建i18n切换器?

bqf10yzr  于 2023-06-25  发布在  Go
关注(0)|答案(1)|浏览(140)

我可以在Django的set_language重定向视图下面创建i18n switcher用于英语和法语,这就是我在Django中设置翻译(英语和法语)的方式。* 我使用Django 4.2.1

# "core/settings.py"

from django.contrib import admin
from django.urls import path, include
from django.conf.urls.i18n import i18n_patterns

urlpatterns = i18n_patterns(
    path('admin/', admin.site.urls),
    path("my_app1/", include('my_app1.urls')),
)

urlpatterns += [
    path("i18n/", include("django.conf.urls.i18n"))
]
# "templates/index.html"

{% load i18n %}

<form action="{% url 'set_language' %}" method="post">{% csrf_token %}
    <input name="next" type="hidden" value="{{ redirect_to }}">
    <select name="language">
        {% get_current_language as LANGUAGE_CODE %}
        {% get_available_languages as LANGUAGES %}
        {% get_language_info_list for LANGUAGES as languages %}
        {% for language in languages %}
            <option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %} selected{% endif %}>
                {{ language.name_local }} ({{ language.code }})
            </option>
        {% endfor %}
    </select>
    <input type="submit" value="Go">
</form>

{% translate "Hello" %} {% trans "World" %}

然后,我可以将法语转换为英语,如下所示:

而且,我可以将英语转换为法语,如下所示:

但是,我不知道如何为Django Admin创建它。
那么,如何为Django Admin创建i18n切换器

jyztefdp

jyztefdp1#

首先,根据我的回答设置翻译(英语和法语)。
然后,您需要在core/static/core/admin/css/中创建custom_admin.css,并在core/static/core/admin/images/中准备usa_flag.pngfrance_flag.png,并在core/templatetags/中创建__init__.py(空文件)和i18n_switcher.py,并将base.html从虚拟环境中的django/contrib/admin/templates/admin/base.html复制到templates/admin/,如下所示:

django-project
 |-core
 |  |-settings.py
 |  |-urls.py
 |  |-static
 |  |  └-core
 |  |     └-admin
 |  |        |-css
 |  |        |  └-custom_admin.css # Here
 |  |        └-images
 |  |           |-usa_flag.png # Here
 |  |           └-france_flag.png # Here
 |  └-templatetags
 |     |-__init__.py # Here
 |     └-i18n_switcher.py # Here
 |-my_app1
 |  |-views.py
 |  |-urls.py
 |  |-models.py
 |  |_admin.py
 |  └-apps.py
 |-my_app2
 |-templates
 |  |-admin
 |  |  └-base.html # Here
 |  └-index.html
 └-locale
    └-fr
       └-LC_MESSAGES
          |-django.po
          └-django.mo

然后,将下面的代码放入custom_admin.css

# "core/static/core/admin/css/custom_admin.css"

img.i18n_flag {
    width: 16px;
    vertical-align: text-top;
}

然后,将下面的代码放入i18n_switcher.py

# "core/templatetags/i18n_switcher.py"

from django import template
from django.conf import settings

register = template.Library()

@register.simple_tag
def switch_i18n(full_path, prefix_lang):
    lang_codes = [list[0] for list in settings.LANGUAGES]

    if prefix_lang not in lang_codes:
        raise Exception('%s is not a supported language code' % prefix_lang)
 
    parts = full_path.split('/')

    parts[1] = prefix_lang
    
    return '/'.join(parts)

然后,在<link ... "admin/css/base.css" %}{% endblock %}">之后添加<link ... 'core/admin/css/custom_admin.css' %}"/>,并在{% block userlinks %}之后添加<a ...><img ... 'core/admin/images/usa_flag.png' %}"/></a> /<a ...><img ... 'core/admin/images/france_flag.png' %}"/></a> /,如下所示:

# "templates/admin/base.html"

...
<head>
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" href="{% block stylesheet %}{% static "admin/css/base.css" %}{% endblock %}">
# ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ Here ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
<link rel="stylesheet" type="text/css" href="{% static 'core/admin/css/custom_admin.css' %}"/>
... 
<!-- Container -->
<div id="container">
   ...
            {% block userlinks %}
                # ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ Here ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ 
                <a href="{% switch_i18n request.get_full_path 'en' %}">
                    <img class="i18n_flag" src="{% static 'core/admin/images/usa_flag.png' %}"/>
                </a> /
                # ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ Here ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ 
                <a href="{% switch_i18n request.get_full_path 'fr' %}">
                    <img class="i18n_flag" src="{% static 'core/admin/images/france_flag.png' %}"/>
                </a> /
                ...

现在,您可以通过点击美国国旗将法语切换为英语,如下图所示:

点击【法国国旗】,可以将英语转换为法语,如下图所示:

实际上,您可以在<div id="container">之后添加代码<form ...></form>,如下图所示,在Django Admin中创建英语和法语的i18n切换器

# "templates/admin/base.html"

...
<!-- Container -->
<div id="container">
    # ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ Here ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓
    <form action="{% url 'set_language' %}" method="post">{% csrf_token %}
        <input name="next" type="hidden" value="{{ redirect_to }}">
        <select name="language">
            {% get_current_language as LANGUAGE_CODE %}
            {% get_available_languages as LANGUAGES %}
            {% get_language_info_list for LANGUAGES as languages %}
            {% for language in languages %}
                <option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %} selected{% endif %}>
                    {{ language.name_local }} ({{ language.code }})
                </option>
            {% endfor %}
        </select>
        <input type="submit" value="Go">
    </form>

然后,您可以将法语切换为英语,如下所示:

您可以将英语转换为法语,如下所示:

第一种解决方案更好。

相关问题