Средство выбора CSS с графическим интерфейсом в Django

Я хочу добавить функциональность, позволяющую пользователю выбирать «тему интерфейса»:

Я добавил раскрывающийся список в свой base.html, чтобы пользователь мог изменить тему во всех шаблонах.

Я использую base.html для всех своих html-шаблонов с использованием {% extends 'base.html'%}.

'# Это понадобится всем моим представлениям:

theme = MyThemeModel.objects.filter(user=self.request.user).first().theme

return render(request, 'mytemplate.html', {'theme': theme})

'# base.html

{% if theme = 'theme 1'%}
<link rel = "stylesheet" type = "text/css" href = "{% static 'theme1.css' %}" />
{% else if theme = 'theme 2'%}
<link rel = "stylesheet" type = "text/css" href = "{% static 'theme2.css' %}" />
{% else if theme = 'theme 3'%}
<link rel = "stylesheet" type = "text/css" href = "{% static 'theme3.css' %}" />
{% endif%}

Я думаю об использовании AJAX, чтобы я мог выбрать тему, выбранную пользователем, но тогда мне нужно будет добавить функцию в каждое существующее представление, и я не хочу повторять такую ​​часть кода.

Есть ли более простой способ сделать это?

Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
CSS: FlexBox
CSS: FlexBox
Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.
0
0
26
1

Ответы 1

Вы можете использовать промежуточное ПО Django, чтобы добавлять переменную theme к каждому запросу. Имейте в виду, что текущий способ получения темы пользователя будет добавлять дополнительный запрос к базе данных к каждому запросу.

Вместо этого я бы сохранил тему пользователя в переменной сеанса. Ваше промежуточное программное обеспечение может проверить, установлена ​​ли переменная темы, и только если она не установлена, извлечь ее из базы данных. Ваше промежуточное ПО будет выглядеть так:

if not request.session.theme:
    request.session.theme = MyThemeModel.objects.filter(user=self.request.user).first().theme

Затем вы можете получить доступ к request.session.theme во всех ваших представлениях и шаблонах.

У меня возник бы еще один вопрос: почему вы сохраняете, какой пользователь какую тему использует на вашем MyThemeModel, а не на вашей модели User? Если бы вы сохранили его в своей пользовательской модели, вы могли бы просто использовать request.user.theme, и промежуточное ПО вам вообще не понадобилось.

Промежуточное ПО кажется мне тем, что мне нужно. Я добавил новую модель, потому что не знал, что могу добавить поле в модель пользователя. Это очень поможет! Благодарность!

Paula Young 08.06.2018 17:45

@PaulaYoung Расширение пользовательской модели Django действительно может быть немного сложным. Рад, что смог помочь. Если вас устраивает этот ответ, отметьте его как принятый :)

voodoo-burger 08.06.2018 17:46

Другие вопросы по теме