A Full Stack Develpor

Wagtail Admin Page에서 settings에 기능을 추가하는 방법에 대해서 다뤄보려고 한다. 

https://www.youtube.com/watch?v=jsan9SclzpI&list=PLMQHMcNi6ocsS8Bfnuy_IDgJ4bHRRrvub&index=14 

위 영상을 따라해서 만들었다. 

1. 새로운 App 생성

python manage.py startapp site_settings

Settings를 따로 관리하기 위해 App을 만들어준다. App을 만들었으니 base.py에 등록한다. 

settings/base.py

INSTALLED_APPS = [

    'site_settings',
]

apps.py와 models.py이외에는 필요가 없으니 나머지 views.py, admin.py, tests.py는 지워준다.(옵션 사항)

2. Model작성

site_settings/models.py

from django.db import models

from wagtail.admin.edit_handlers import FieldPanel, MultiFieldPanel
from wagtail.contrib.settings.models import BaseSetting, register_setting


@register_setting
class SocialMediaSettings(BaseSetting):
    """Social media settings for our custom website."""
    
    facebook = models.CharField(blank=True, null=True, help_text="Facebook URL", max_length=30)
    twitter = models.CharField(blank=True, null=True, help_text="Twitter URL", max_length=30)
    youtube = models.CharField(blank=True, null=True, help_text="YouTube URL", max_length=30)
    
    panels = [
        MultiFieldPanel([
            FieldPanel("facebook"),
            FieldPanel("twitter"),
            FieldPanel("youtube"),
        ], heading="Social Media Settings")
    ]

위와 같이 모델을 작성해준다. 튜토리얼과 같이 SocialMedia를 관리하는 Setting을 만드려고 한다. 모델 작성하는 방법은 기존 모델 작성하는 방법과 같다. 다만 BaseSetting을 상속받아 Setting 페이지 양식으로 작성하고 

데코레이터(=@)를 사용하여 settings에 등록해준다. 

3. 설정 파일 수정

마이그레이션을 진행하고 admin page를 확인해보면 적용이 안되어 있을 것이다. setting을 수정하기 위해서는 setting에 2가지를 추가해줘야한다. 

settings/base.py

INSTALLED_APPS = [
	...
    'wagtail.contrib.forms',
    'wagtail.contrib.redirects',
    'wagtail.contrib.settings', # 추가
]


TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            os.path.join(PROJECT_DIR, 'templates'),
        ],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
                'wagtail.contrib.settings.context_processors.settings', # 추가
            ],
        },
    },
]

1) INSTALLED_APPS에 'wagtail.contrib.settings'를 추가해준다. 

2) TEMPLATES에 wagtail.contrib.settings.context_processors.settings를 추가해준다. 

4. 적용 완료

정상적으로 적용된 것을 확인할 수 있다. Field에 각 사이트의 주소를 적어보자.

5. Templates에서 사용

home/home_page.html

    {% if settings.site_settings.SocialMediasettings.facebook %}
        <a href="{{ settings.site_settings.SocialMediaSettings.facebook }}">
            <i class="fab fa-facebook-f"></i>
        </a>
    {% endif %}
    {% if settings.site_settings.SocialMediasettings.twitter %}
        <a href="{{ settings.site_settings.SocialMediaSettings.twitter }}">
            <i class="fab fa-twitter"></i>
        </a>
    {% endif %}
    {% if settings.site_settings.SocialMediasettings.youtube %}
        <a href="{{ settings.site_settings.SocialMediaSettings.youtube }}">
            <i class="fab fa-youtube"></i>
        </a>
    {% endif %}

사용하는 방법은 settings.App 이름.클래스 이름.필드 이름으로 사용한다.