django right-to-left language with LANGUAGE_BIDI does not work - django

I am building a multi-language site with one of the languages "farsi":
Everything worked fine so far, but the right to left language "farsi/persian" is not aligned right, when beginning a next line of text. That means the next line is not aligned at the right as usual for right-to-left languages.
The translation work.
settings.py
gettext = lambda s: s
#default language should be german
LANGUAGE_CODE = 'de'
#LANGUAGE_CODE = 'en'
#LANGUAGE_CODE = 'fa'
LANGUAGES = (
#('fr', gettext('French')),
('de', gettext('German')),
('en', gettext('English')),
('fa', gettext('Farsi')),
#('pt-br', gettext("Brazil")),
)
language_chooser.html
{% load localeurl_tags %}
{% load i18n %}
{% load tabs %}
{% for lang in LANGUAGES %}
{% ifequal lang.0 LANGUAGE_CODE %}
<li class="active"><a>{{ lang.1 }}</a></li>
{% else %}
<!--
{% if LANGUAGE_BIDI %}
<li>The current language is bidirectional</li>
{% else %}
<li>The current language is <b>not</b> bidirectional</li>
{% endif %}
-->
<li class="{% ifactivetab "en" %}active{% else %}inactive{% endifactivetab %}">{{ lang.1 }}</li>
{% endifequal %}
{% endfor %}
in the base.html I also load:
{% load i18n %}
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_current_language_bidi as LANGUAGE_BIDI %}
My django.po file for "farsi/persian" language looks like:
How can I manage this?
Solution:
After defining a new css class "article_right_aligned_language" with the attribute "text-align:right; direction:rtl" and modifying my base template as follows, it works now !!
<div {% if LANGUAGE_BIDI %} class="article_right_aligned_language" {% else %} class="article" {% endif %}>
{% block site_wrapper %}{% endblock %}
</div>

Text alignment is handled by CSS not Django. Set the text-align property on the container element:
.container.right-aligned-language {
text-align: right;
}
Then you can apply the class right-aligned-language to your container (or body tag for that matter) with a conditional statement in your template.

nowadays you should use in CSS:
direction: rtl
http://www.w3schools.com/cssref/pr_text_direction.asp

Use this instead please:
https://github.com/abbas123456/django-right-to-left
CSS is for style and not content.

Related

Display language icons in Django template

I want to display language icons instead of names in Django template.
My code looks like this:
{% load static i18n %}
{% get_current_language as CURRENT_LANGUAGE %}
{% get_available_languages as AVAILABLE_LANGUAGES %}
{% get_language_info_list for AVAILABLE_LANGUAGES as languages %}
<div id="language">
{% for language in languages %}
<ul>
<li>
<a href="/{{ language.code }}/"
{% if language.code == LANGUAGE_CODE %} class="active"{% endif %}>
{{ language.name|slice:":3" }}
</a>
</li>
</ul>
{% endfor %}
</div>
Is there any possible ways to achieve that goal or I have to try different ways?
solution for that was to change that rows to this:
<a href="/{{ language.code }}/"
{% if language.code == LANGUAGE_CODE %} class="active"{% endif %}>
<img src="/static/images/{{ language.name }}.png" alt="Geo">
</a>
And you have to place icons in static folder with the language names for english -> English and so on.
The harder part is assembling your set of country flag images together somewhere.
The easy part is using your language context to get an <img> reference, for example
<img ... src="somewhere/{{language.name|slice:":3"}}.gif" >
You might want to take a look at the django-countries package. Use it, or use it for ideas.

How to display django-treebeard MP in template as dropdown menu?

Following the treebeard docs api example, I created an annotated_list of my tree using get_annotated_list(parent=None, max_depth=None) with parent=<my root node>. I pass this to my template and using the example they attribute in the docs to Alexey Kinyov, I am able to successfully display my tree using
{% for item, info in annotated_list %}
{% if info.open %}
<ul><li>
{% else %}
</li><li>
{% endif %}
{{ item }}
{% for close in info.close %}
</li></ul>
{% endfor %}
{% endfor %}
What I would like though is to be able to give these nested lists dropdown features. Borrowing from this standard example on w3schools, I modified it to work with my annotated_list template variable and ended up with this:
<ul id="myUL">
<li><span class="caret">{{ annotated_list.0.0 }}</span>
{% for item, info in annotated_list|slice:"1:" %}
{% if info.open %}
<ul class="nested"><li>
{% else %}
</li><li>{% if item.get_children_count > 0 %}<span class="caret">
{% endif %}
{% endif %}
{{ item }}
{% if item.get_children_count > 0 %}</span>
{% endif %}
{% for close in info.close %}
</li></ul>
{% endfor %}
{% endfor %}
</li>
</ul>
My code almost works, but does not seem to display node children for left-most nodes and I can't figure out why.
Note: CSS & JS not included in question but needed to make the dropdown menu work (I'm just using the out-of-the-box CSS/JS used in that w3schools example)
The most likely reason is that there is a problem with the tree.
Run Model.find_problems() to confirm.
Model.fix_tree() can fix most of the common problems.
Note that the get_annotated_list_qs() function doesn't really work at all.
You can try this Code:
<ul id="myUL">
{% for item, info in annotated_list %}
{% if item.get_children_count > 0 %}
<li><span class="box">{{item}}</span><ul class="nested">
{% else %}
<li>{{item}}</li>
{% endif %}
{% for close in info.close %}
</ul>
{% endfor %}
{% endfor %}
</ul>
It worked for me.
To add some missing context:
views.py:
def tree(request):
annotated_list = Category.get_annotated_list()
# template_name = 'JsonDefine/tree.html'
context = {
'annotated_list': annotated_list
}
return render(request, 'JsonDefine/tree3.html',context)
urls.py
from django.urls import path
from . import views
app_name = 'MyApp'
urlpatterns = [
path('tree/', views.tree, name='tree'),
]

django TemplateSyntaxError Invalid block tag: 'trans'

After running the runserver command I get the following error:
TemplateSyntaxError at /questions/ Invalid block tag: 'trans'
Does anybody know that what's the reason?
This is my template syntax:
{% extends "two_column_body.html" %}
{#
this template is split into several
blocks that are included here
the blocks are within directory templates/main_page
relative to the skin directory
there is no html markup in this file
#}
<!-- questions.html -->
{% block forejs %}
{% include "main_page/custom_head_javascript.html" %}
{% endblock %}
{% block title %}{% spaceless %}{% trans %}Questions{% endtrans %}{% endspaceless %}{% endblock %}
{% block content %}
{% include "main_page/tab_bar.html" %}
{% include "main_page/headline.html" %}
{# ==== BEGIN: main_page/content.html === #}
<div id="question-list">
{% include "main_page/questions_loop.html" %}
</div>
{# ==== END: main_page/content.html === #}
{% include "main_page/paginator.html" %}
{% endblock %}
{% block sidebar %}
{% include "main_page/sidebar.html" %}
{% endblock %}
{% block endjs %}
<script type="text/javascript">
{# cant cache this #}
askbot['settings']['showSortByRelevance'] = {{ show_sort_by_relevance|as_js_bool }};
askbot['messages']['questionSingular'] = '{{ settings.WORDS_QUESTION_SINGULAR|escapejs }}';
askbot['messages']['answerSingular'] = '{{ settings.WORDS_ANSWER_SINGULAR|escapejs }}';
askbot['messages']['acceptOwnAnswer'] = '{{ settings.WORDS_ACCEPT_OR_UNACCEPT_OWN_ANSWER|escapejs }}';
askbot['messages']['followQuestions'] = '{{ settings.WORDS_FOLLOW_QUESTIONS|escapejs }}';
</script>
{% include "main_page/javascript.html" %}
{% include "main_page/custom_javascript.html" %}
{% endblock %}
<!-- end questions.html -->
{% trans %}Questions{% endtrans %} is not the correct format.
{% load i18n %} should be at the top of your template, or any extended template using translations.
You can use {% trans "Questions." %}
If you're going to use blocks, they need to be in the format below:
{% blocktrans %}{{ value2translate }}{% endblocktrans %}
More info here.
Probably you should use {% blocktrans %}Questions{% endblocktrans %} and you forget to put {% load i18n %} toward the top of your template.
this is because you have not loaded i18n in this template{% load i18n %} you must add this in each of your template.
You must place at the beginning of your extended template code: {% load i18n %} , so you can use the trans Tags:
{% extends 'home/base.html' %}
{% block title %}INICIO{% endblock %}
{% load i18n %}
{% block opcionesMenu %}
<!-- =====START====== -->
{% trans "Inicio" %}
{% trans "Proyectos" %}
{% trans "Diseño Web" %}
{% trans "Marketing" %}
{% trans "Conocenos" %}
{% trans "Contacto" %}
<!-- =====END ====== -->
{% endblock %}

Django URL Translation - Stay on the same page when changing language

I developped a Django app with i18n for urls as well.
That look really nice but when changing the language I would like to stay on the same/previous page.
What is the best way of doing that ?
Basically to get the new url I need to do a reverse on the name of the previous page after having changed the language and do a redirect but how can I know the url name of the previous page?
Edit:
A solution that came from a collegue:
Calculate a next parameter for each language using request.resolver_match.
For each language : activate(language) + reverse('{app_name}:{url_name}', args, kwargs) using request.resolver_match elements
Do you see a better idea?
After change language with django-modeltranslation redirecting to home ?
If you want to redirect to the same page, you can replace this part of code:
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as languages %}
<div class="languages">
<p>{% trans "Language" %}: </p>
<ul class="languages">
{% for language in languages %}
<li>
<a href="/{{ language.code }}/
{% if language.code == LANGUAGE_CODE %} class="selected"{% endif %}>
{{ language.name_local }}
</a>
</li>
{% endfor %}
</ul>
</div>
to:
{% get_current_language as LANGUAGE_CODE %}
{% get_available_languages as LANGUAGES %}
{% get_language_info_list for LANGUAGES as languages %}
<div class="languages">
<p>{% trans "Language" %}: </p>
<ul class="languages">
{% for language in languages %}
<li>
<a href="/{{ language.code }}/{{request.get_full_path|slice:"4:"}}"
{% if language.code == LANGUAGE_CODE %} class="selected"{% endif %}>
{{ language.name_local }}
</a>
</li>
{% endfor %}
</ul>
</div>
Attention please:
<a href="/{{ language.code }}/
replaced to <a href="/{{ language.code }}/{{request.get_full_path|slice:"4:"}}"
Two options for you:
Option 1
If you use the form from the documentation then will take you which brings you back to the page you were on.
Option 2
When changing the language you could use the referrer header, HTTP_REFERER , and redirect back to where you came from
# Change the language
# ... code ...
# Redirect back to where we came from
redirect_to = request.META.get('HTTP_REFERER', reverse('default-redirect-page'))
return HttpResponseRedirect(redirect_to)

Using autopagination in django and formatting issues

I'm using django-paginate and getting weird formatting issues with the {% paginate %} tag. I have attached an image of the problem.
I was just wondering what could be potentially causing this?
In the image below I'm on the first page. Notice that the 1 is cut off and also that the pages are strangely ordered and the previous/next is not really visible.
My template is just this for now:
{% extends "base.html" %}
{% load mptt_tags %}
{% load pagination_tags %}
{% load i18n %}
{% block body %}
{% autopaginate parts 20 %}
{% paginate %}
That's not related to Django, neither to Django-Paginate. It seems that you're using Bootstrap as your front-end framework, and that implies issues such that.
I've implemented a similar approach for this site manoomit.com, creating a custom template for managing pagination within django-paginate.
It looks like that:
{% if is_paginated %}
{% load i18n %}
<div class="pagination pagination-centered">
<ul>
{% if page_obj.has_previous %}
<li>‹‹ {% trans "previous" %}</li>
{% else %}
<li class="disabled">‹‹ {% trans "previous" %}</li>
{% endif %}
{% for page in pages %}
{% if page %}
{% ifequal page page_obj.number %}
<li class="active">{{ page }}</li>
{% else %}
<li>{{ page }}</li>
{% endifequal %}
{% else %}
...
{% endif %}
{% endfor %}
{% if page_obj.has_next %}
<li>{% trans "next" %} ››</li>
{% else %}
<li class="disabled">{% trans "next" %} ››</li>
{% endif %}
</ul>
</div>
{% endif %}