Discourse Signatures

Ok, for those who want to really make their signatures work better for their group (especially if you want to use the options to have a signature as part of a paid upgrade/subscription), here is code (and reasoning behind it) that I think makes it way better, and can help you drive more upgrades. Took me a ton of tries, but it’s working. Pay attention to where you need to replace “XXXXX” parts.

I wanted to accomplish the following 2 things:

A) I wanted to disable the ability to NOT view signatures. This means that those users who do upgrade know that their signature will be seen by everyone.

B) I wanted ONLY a certain group to have the ability to create a signature.

  1. Go to Admin > Appearance > Themes & components > Components > Install > Create new

  2. Add this code to the < head > tab:

<script>
// Wait for the basic page structure to load first
document.addEventListener("DOMContentLoaded", function() {
    
    // Set up the watcher
    const observer = new MutationObserver(function(mutations) {
        // Find all control labels on the page
        const labels = document.querySelectorAll('label.control-label');
        
        labels.forEach(label => {
            // Look for the specific Signatures label
            if (label.textContent.trim() === 'Enable Signatures') {
                // Find the main container holding both the label and the checkbox and hide it
                const controlGroup = label.closest('.control-group') || label.parentElement;
                if (controlGroup) {
                    controlGroup.style.display = 'none';
                }
            }
        });
    });

    // NOW start watching the body, since we know it exists
    observer.observe(document.body, { childList: true, subtree: true });
});
</script>

3. Add this code to the css tab (replace XXXXX with your group name):

/* Hide the signature section for everyone */
.user-preferences .control-group.signatures,
.user-preferences .signature-preferences,
.user-preferences div[data-setting-name="user_card_badge"] + .control-group {
    display: none !important;
}

/* Only show it if the 'user-is-XXXXX' class is present on the body */
body.user-is-XXXXX .user-preferences .control-group.signatures,
body.user-is-XXXXX .user-preferences .signature-preferences,
body.user-is-XXXXX .user-preferences div[data-setting-name="user_card_badge"] + .control-group {
    display: block !important;
}
  1. Add this code to the < head > tag below the first block above (replace XXXXX with your group name):
<script>
(function() {
  const checkAccess = () => {
    // Discourse stores the current user's groups in this global object
    const user = window.Discourse && window.Discourse.User && window.Discourse.User.current();
    
    if (user && user.groups) {
      // Check if any group name matches "XXXXX"
      const is XXXXX = user.groups.some(g => g.name === 'XXXXX');
      
      if (isXXXXX) {
        document.body.classList.add('user-is-XXXXX');
      }
    }
  };

  // Run immediately
  checkAccess();

  // Run whenever the user navigates between pages
  document.addEventListener('discourse-ready', checkAccess);
  
  // Backup: Run again after 1 second to catch slow loads
  setTimeout(checkAccess, 1000);
})();
</script>
  1. Add this code to the css tab below the first block above (replace XXXXX with your group name):
/* Hide the signature section for everyone */
.user-preferences .control-group.signatures,
.user-preferences .signature-preferences,
.user-preferences div[data-setting-name="user_card_badge"] + .control-group {
    display: none !important;
}

/* Only show it if the 'user-is-XXXXX' class is present on the body */
body.user-is-XXXXX .user-preferences .control-group.signatures,
body.user-is-XXXXX .user-preferences .signature-preferences,
body.user-is-XXXXX .user-preferences div[data-setting-name="user_card_badge"] + .control-group {
    display: block !important;
}

Done.

I am not a developer. All I know is this is working 100% on my site.

Also, to the plugin author – would LOVE the ability to limit the signature character count. I tried so many things but nothing worked.

1 Like