Изменение логотипа веб-страницы для каждого пользователя в django

Как я могу изменить логотип сайта для каждого другого пользователя, входящего в платформу django? Например: Пользователь-A при входе в систему будет видеть другой логотип на сайте, а пользователь-B - другой и так далее.

Найдена эта часть кода

 <link rel="shortcut icon" type="image/png" href="{% static 'favicon.ico' %}"/>

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

class UserLogos(models.Model):
    """
    Model for storing User Logos
    """
    user = models.ForeignKey(
        User,
        on_delete=models.CASCADE,
        verbose_name=_("user"),
        help_text=_("The associated user"),
    )
    photo = models.ImageField(
        _("photo"),
        upload_to="logo_photos",
        help_text=_("Your logo photo"),
        default="logo_photos/default.png",
    )

Затем в своих представлениях просто вызовите этот элемент:

def index(request):
    """
    Index View

    Render the server configured index page
    """
    return render(
        request,
        "index.html",
        {
            "userLogo": models.UserLogos.filter(user=request.user).first()
        },
    )

И, наконец, в вашем html шаблоне:

<img src="{{ userLogo.photo.url }}"/>

Допустим, у нас есть маршрут dynamic_logo_page/, который использует шаблон dynamic_logo_page.html и соответствующее имя представления dynamic_logo_view.

# Inside views.py

def get_logo_url(user_id):
    # TODO: implement logic to get the logo_url based on user_id
    return some_logo_url

def dynamic_logo_view(request):
  if request.user.is_authenticated:
      logo_url = get_logo_url(request.user.id)
      content = {
        "user_id": request.user.id,
        "logo_url": logo_url
      }
        
  return render(request, 'dynamic_logo_page.html', content)


<!-- Inside dynamic_logo_page.html -->
...
{% if user.is_authenticated %}
  <div>Hi {{ user_id }}, here is your personalized logo below:</div>
  <img src="{{ logo_url }}" alt='logo'/>
{% endif %}
...

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

Случайный логотип для каждого пользователя, разный для каждого запроса

Если вы хотите, чтобы логотип был случайным для каждого запроса, вы можете предоставить список логотипов в контексте шаблона, а затем использовать фильтр random filter для случайного выбора логотипа из списка.

<img id="logo" src="{% static logo_options|random %}">

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

Особый логотип для каждого пользователя, одинаковый для каждого запроса

Чтобы иметь один и тот же логотип для пользователя, логотип должен быть определен и сохранен каким-то образом. Этого можно достичь, добавив ImageField к модели User, а затем извлекая это поле в шаблоне.

Существует множество способов расширения модели User, встроенной в Django, смотрите здесь учебник по этому вопросу: https://simpleisbetterthancomplex.com/tutorial/2016/07/22/how-to-extend-django-user-model.html

В зависимости от вашего решения, шаблон может выглядеть примерно так:

<img id="logo" src="{% static user.logo.url %}">

Вот как я решил эту проблему. Вот мой models.py

class Customer(models.Model):
    user = models.OneToOneField(User, null=True, blank =True, on_delete=models.CASCADE)
    date_created = models.DateTimeField(auto_now_add=True, null=True)
    name = models.CharField(max_length=200, null=True)
    first_name = models.CharField(max_length=200, null=True)
    last_name = models.CharField(max_length=200, null=True)
    email = models.CharField(max_length=200, unique=True)
    phone = models.CharField(max_length=200, null=True)
    platformLogo= models.ImageField(upload_to=upload_path, default='logo.png', null=True, blank=False)

Вот функция, в которой будут сохранены логотипы.

def upload_path(instance, filename):
    filename = str(date.today())
    name = instance.user.customer
    name1 = str(name)
    name = name1.replace('@','_')
    return f'{name}/{filename}.jpg'

Мой settings.py

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static")]


MEDIA_URL = '/platformLogo/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'static/platformLogo')

Здесь HTML шаблон

<div class="container-fluid" title="Website">

{% if request.user.is_staff %} 

  <a data-testid="linkElement"
href="https://www.google.com" target="_self" class="xQ_iF"><img src="{% static 'logo.png' %}" alt="google"
style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">

{% else %}

 <a data-testid="linkElement"
 href="https://www.google.com" target="_self" class="xQ_iF"><img src="{% static user.customer.platformLogo.url %}" alt="google"
 style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">
   
{% endif %}

   <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="true" aria-label="Toggle navigation">
  </button>
  </a>
<nav class="navbar navbar-expand-lg">

    <ul class="navbar-nav ml-auto" style = "margin-left: auto;">
    <li class="nav-item active">
    <a class="nav-link" href="{% url 'home' %}"><i class="fa fa-home"></i>&nbsp; Home <span class="sr-only">(current)</span></a>
    </li>

    <li class="nav-item active">
      <a class="nav-link" href="https://www.google.com/support-page"><i class="fa fa-envelope"></i>&nbsp; Support<span class="sr-only">(current)</span></a>
      </li>


    <li class="nav-item dropdown">
    <a  class="nav-link dropdown-toggle" id="navbarDropdownMenuLink-4" data-bs-toggle="dropdown">
    <i class="fa fa-user-circle-o"></i>&nbsp; {{request.user}}</a>
    <div class="dropdown-menu" style="background-color: #
    </div>
    </li>
    </ul>
    </div>

      </div>
  </div>
  </nav>
  </div>

Я нашел еще один альтернативный способ решения этой проблемы. Ниже приведен мой файл models.py.

class Customer(models.Model):
    user = models.OneToOneField(User, null=True, blank =True, on_delete=models.CASCADE)
    date_created = models.DateTimeField(auto_now_add=True, null=True)
    name = models.CharField(max_length=200, null=True)
    first_name = models.CharField(max_length=200, null=True)
    last_name = models.CharField(max_length=200, null=True)
    email = models.CharField(max_length=200, unique=True)
    phone = models.CharField(max_length=200, null=True)
    platformLogoUrl = models.CharField(max_length=500, default='https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Google_2011_logo.png/640px-Google_2011_logo.png', null=True)

HTML шаблон

    <div class="container-fluid" title="Website">

    {% if request.user.is_staff %} 

    <a href="https://www.google.com" <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Google_2011_logo.png/640px-Google_2011_logo.png" alt="google"
    style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">

    {% else %}

    <a data-testid="linkElement"
    href="https://www.google.com"><img src="{{request.user.customer.platformLogoUrl}}" alt="google"
    style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">
   
    {% endif %}

    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
    aria-controls="navbarNavAltMarkup" aria-expanded="true" aria-label="Toggle navigation">
    </button>
    </a>
    <nav class="navbar navbar-expand-lg">

    <ul class="navbar-nav ml-auto" style = "margin-left: auto;">
    <li class="nav-item active">
    <a class="nav-link" href="{% url 'home' %}"><i class="fa fa-home"></i>&nbsp; Home <span class="sr-only">(current)</span></a>
    </li>

    <li class="nav-item active">
      <a class="nav-link" href="https://www.google.com/support-page"><i class="fa fa-envelope"></i>&nbsp; Support<span class="sr-only">(current)</span></a>
      </li>


    <li class="nav-item dropdown">
    <a  class="nav-link dropdown-toggle" id="navbarDropdownMenuLink-4" data-bs-toggle="dropdown">
    <i class="fa fa-user-circle-o"></i>&nbsp; {{request.user}}</a>
    <div class="dropdown-menu" style="background-color: #
    </div>
    </li>
    </ul>
    </div>

      </div>
  </div>
  </nav>
  </div>
Вернуться на верх