feat: make ribbon CTA dynamic via admin

Author: zorexsalvo

app/announcements/admin.py

@@ -1,6 +1,6 @@
 from django.contrib import admin
 
-from .models import Announcement
+from .models import Announcement, RibbonCTA
 
 
 @admin.register(Announcement)
@@ -15,3 +15,16 @@ class AnnouncementAdmin(admin.ModelAdmin):
         ("Status", {"fields": ("is_published",)}),
         ("Metadata", {"fields": ("created_at", "updated_at")}),
     )
+
+
+@admin.register(RibbonCTA)
+class RibbonCTAAdmin(admin.ModelAdmin):
+    list_display = ("message", "cta_text", "is_active", "created_at", "updated_at")
+    list_filter = ("is_active", "created_at")
+    search_fields = ("message", "cta_text")
+    readonly_fields = ("created_at", "updated_at")
+    fieldsets = (
+        ("Content", {"fields": ("message", "cta_text", "cta_url")}),
+        ("Status", {"fields": ("is_active",)}),
+        ("Metadata", {"fields": ("created_at", "updated_at")}),
+    )

app/announcements/migrations/0003_ribboncta.py

@@ -0,0 +1,30 @@
+# Generated by Django 5.2.7 on 2026-03-18 02:58
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('announcements', '0002_announcement_modal_size'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='RibbonCTA',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('message', models.CharField(max_length=255)),
+                ('cta_text', models.CharField(default='LEARN MORE', max_length=100)),
+                ('cta_url', models.URLField()),
+                ('is_active', models.BooleanField(default=True)),
+                ('created_at', models.DateTimeField(auto_now_add=True)),
+                ('updated_at', models.DateTimeField(auto_now=True)),
+            ],
+            options={
+                'verbose_name': 'Ribbon CTA',
+                'verbose_name_plural': 'Ribbon CTAs',
+                'ordering': ['-created_at'],
+            },
+        ),
+    ]

app/announcements/models.py

@@ -33,3 +33,25 @@ class Meta:
         ordering = ["-created_at"]
         verbose_name = "Announcement"
         verbose_name_plural = "Announcements"
+
+
+class RibbonCTA(models.Model):
+    message = models.CharField(max_length=255)
+    cta_text = models.CharField(max_length=100, default="LEARN MORE")
+    cta_url = models.URLField()
+    is_active = models.BooleanField(default=True)
+    created_at = models.DateTimeField(auto_now_add=True)
+    updated_at = models.DateTimeField(auto_now=True)
+
+    def __str__(self):
+        return self.message
+
+    @classmethod
+    def get_active(cls):
+        """Get the first active ribbon CTA."""
+        return cls.objects.filter(is_active=True).first()
+
+    class Meta:
+        ordering = ["-created_at"]
+        verbose_name = "Ribbon CTA"
+        verbose_name_plural = "Ribbon CTAs"

app/home/templates/home/components/navbar.html

@@ -21,18 +21,20 @@
 <nav class="absolute w-full z-[999] pointer-events-none">
   <div class="relative flex flex-col pointer-events-auto">
     <!-- Ribbon CTA -->
+    {% if ribbon_cta %}
     <div class="bg-orange-1 py-1.5 flex items-center justify-center gap-2 flex-col sm:flex-row">
       <p class="text-white font-nunito text-sm font-semibold">
-        👋 Registration for PythonAsia 2026 is now open!
+        {{ ribbon_cta.message }}
       </p>
       <div class="w-[20px] h-[2px] bg-white hidden sm:block"></div>
       <div>
-        <a href="https://ti.to/pythonph/pythonasia-2026/" target="_blank" class="text-white font-bantayog text-base flex gap-2 items-center">
-          <p class="">RESERVE YOUR SEATS NOW</p>
+        <a href="{{ ribbon_cta.cta_url }}" target="_blank" class="text-white font-bantayog text-base flex gap-2 items-center">
+          <p class="">{{ ribbon_cta.cta_text }}</p>
           <img src="{% static 'img/vectors/ArrowCircleRight.svg' %}" alt="kliN" class="w-[24px] h-auto" width="24" height="24" />
         </a>
       </div>
     </div>
+    {% endif %}
 
 
     <div class="bg-transparent w-full max-w-[1260px] mx-auto flex pt-8 px-3 md:px-5">

config/context_processors.py

@@ -1,5 +1,8 @@
 def announcement_context(request):
-    """Inject latest published announcement into template context."""
-    from app.announcements.models import Announcement
+    """Inject latest published announcement and active ribbon CTA into template context."""
+    from app.announcements.models import Announcement, RibbonCTA
 
-    return {"latest_announcement": Announcement.get_latest_published()}
+    return {
+        "latest_announcement": Announcement.get_latest_published(),
+        "ribbon_cta": RibbonCTA.get_active(),
+    }