From 8530d5146ce2f989812701f0da98031a1d551715 Mon Sep 17 00:00:00 2001
From: Zorex Salvo <zorexsalvo@gmail.com>
Date: Thu, 12 Mar 2026 23:00:19 +0800
Subject: [PATCH 1/2] feat: add |btn marker to convert TinyMCE links into
 buttons

---
 app/pages/templatetags/__init__.py         |  0
 app/pages/templatetags/content_filters.py  | 34 ++++++++++++++++++++++
 templates/includes/announcement_modal.html |  3 +-
 3 files changed, 36 insertions(+), 1 deletion(-)
 create mode 100644 app/pages/templatetags/__init__.py
 create mode 100644 app/pages/templatetags/content_filters.py

diff --git a/app/pages/templatetags/__init__.py b/app/pages/templatetags/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/app/pages/templatetags/content_filters.py b/app/pages/templatetags/content_filters.py
new file mode 100644
index 0000000..3a52cab
--- /dev/null
+++ b/app/pages/templatetags/content_filters.py
@@ -0,0 +1,34 @@
+import re
+
+from django import template
+from django.utils.html import mark_safe
+
+register = template.Library()
+
+
+def _replace_btn_link(match):
+    attrs = match.group(1)
+    text = match.group(2)
+
+    if "|btn" not in text:
+        return match.group(0)
+
+    clean_text = text.replace("|btn", "").strip()
+
+    if "class=" in attrs:
+        attrs = re.sub(r'class=["\']([^"\']*)["\']', r'class="\1 btn btn-primary"', attrs)
+    else:
+        attrs += ' class="btn btn-primary"'
+
+    return f"<a {attrs}>{clean_text}</a>"
+
+
+@register.filter
+def render_buttons(value):
+    """Convert links with |btn marker in their text to button-styled links.
+
+    Usage in TinyMCE: set link text to "Click here|btn"
+    Output: <a href="..." class="btn btn-primary">Click here</a>
+    """
+    result = re.sub(r"<a\s+([^>]+)>([^<]*\|btn[^<]*)</a>", _replace_btn_link, value)
+    return mark_safe(result)
diff --git a/templates/includes/announcement_modal.html b/templates/includes/announcement_modal.html
index 4fcdc84..5236529 100644
--- a/templates/includes/announcement_modal.html
+++ b/templates/includes/announcement_modal.html
@@ -2,6 +2,7 @@
 Announcement modal component. Displays the latest published announcement from the database.
 The modal is dismissible and won't show again until browser session is closed or cache is cleared.
 {% endcomment %}
+{% load content_filters %}
 
 {% if latest_announcement %}
 <dialog id="announcement-modal" class="modal" open>
@@ -11,7 +12,7 @@
         </form>
         <h3 class="font-bold text-2xl mb-4">📢 {{ latest_announcement.title }}</h3>
         <div class="py-4 prose prose-sm max-w-none [&_p]:text-lg [&_p]:pb-4 [&_h1]:text-lg [&_h2]:text-xl">
-            {{ latest_announcement.content|safe }}
+            {{ latest_announcement.content|render_buttons }}
         </div>
     </div>
     <form method="dialog" class="modal-backdrop">

From dc0ca34f6010b96a96b5f4035080c31adbde7f25 Mon Sep 17 00:00:00 2001
From: Zorex Salvo <zorexsalvo@gmail.com>
Date: Thu, 12 Mar 2026 23:07:52 +0800
Subject: [PATCH 2/2] feat: apply render_buttons filter to pages detail
 template

---
 app/pages/templates/pages/detail.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/pages/templates/pages/detail.html b/app/pages/templates/pages/detail.html
index 8116079..baf2c96 100644
--- a/app/pages/templates/pages/detail.html
+++ b/app/pages/templates/pages/detail.html
@@ -1,5 +1,5 @@
 {% extends "base.html" %}
-{% load static %}
+{% load static content_filters %}
 {% block content %}
 <main>
   <div class="min-h-screen bg-contain bg-center" style="background-image: url('{% static 'img/bg-conference-at-glance.png' %}');">
@@ -10,7 +10,7 @@
       <article>
         <h1 class="text-5xl my-10 font-bold font-td_pinoy text-orange-2 hyphens-auto">{{ page.title|safe }}</h1>
         <div class="prose prose-lg max-w-none prose-custom">
-          {{ page.content|safe }}
+          {{ page.content|render_buttons }}
         </div>
       </article>
     </div>