Most websites have social media icons in their footer and often several other links and icons that are global across the entire website. In this video we explore how to enable that with Wagtails settings context processor.
#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.URLField(blank=True, null=True, help_text="Facebook URL")
twitter = models.URLField(blank=True, null=True, help_text="Twitter URL")
youtube = models.URLField(blank=True, null=True, help_text="YouTube Channel URL")
panels = [
MultiFieldPanel([
FieldPanel("facebook"),
FieldPanel("twitter"),
FieldPanel("youtube"),
], heading="Social Media Settings")
]<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
{% 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 %}
</div>
</div>
</div>
