Topic Footer Buttons

Customization Theme component
,

AI-generated summary

The discussion introduces two official Discourse theme components: Custom Topic Button and Custom Group Topic Button, both designed to add a customizable button at the bottom of topics. The Custom Topic Button allows users to define a button with a URL, label, icon, and dynamic placeholders (e.g., TOPIC_ID, USERNAME). The Custom Group Topic Button adds group-based visibility control for the button. Both components are hosted on GitHub and can be installed via the Theme Creator. The topic includes installation instructions, settings, and links for support, bugs, UX, and feature requests. However, users NateDhaliwal and Arkshine report issues with the preview in the Theme Creator, though the components work on local installations. The components are available on Discourse’s Standard, Business, and Enterprise plans.

1
:discourse2: Summary Custom Topic Button defines a button visible at the bottom of your topic to open a URL of your choice.
Custom Group Topic Button defines a button visible at the bottom of your topic to open a URL of your choice, with added group visibility options.
:eyeglasses: Preview Preview on Discourse Theme Creator
(Custom Topic Button)
:hammer_and_wrench: Repository Link(s) https://github.com/discourse/discourse-custom-topic-button-component

https://github.com/discourse/discourse-topic-group-button-component
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install Custom Topic Button

Install Custom Group Topic Button

Features

Hi, let me introduce you to two new simple theme components which have essentially the same goal but are slightly different:

This component will let you define a button visible at the bottom of your topic to open a URL of your choice.

You can customise label/title/icon/link. Links accept multiple placeholders:

<TOPIC_ID>
<USER_ID>
<USERNAME>
<TOPIC_TITLE>
<TOPIC_SLUG>

which will be replaced accordingly.

Has the same behaviour, except you can define a group to limit the visibility of this button.

These components are very simple right now, we could improve them in the future if we see real usage of them and issues.

Settings

Custom Topic Button

Name Description
custom topic button enabled
custom topic button url
custom topic button title Button description here..
custom topic button label Click Me
custom topic button icon

Custom Group Topic Button

Name Description
topic group button enabled
topic group button url
topic group button title Button description here..
topic group button label Click Me
topic group button allowed group
topic group button icon

:discourse2: Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-15T19:16:42Z

Check documentPerform check on document:
22 Likes
FKB Pro - Social theme
Customizing your site with existing theme components
Custom Topic Button
Custom Topic Button
Custom Topic Button (group)
Looking for a freelancer to implement a custom Discourse theme (based on an existing mockup)
12

I don’t think this works. I tried the api.registerTopicFooterButton myself and it doesn’t work, not even the preview link.
I suspect it’s because of the script tag. The normal way of using javascripts/discourse works.

13

It works for me, I tried the first component as it is:

image
image388×151 2.96 KB

14

Odd. On my phone and my laptop, the Theme Creator preview link leads me to a topic with no such button.

1 Like
15

Oh, you meant on the Theme Creator; it doesn’t work for me either. On a local installation, it works, though.

3 Likes