How to add a placeholder in the registration page

Product Support
6

I don’t think it’s possible with just CSS. Although there is a ::placeholder selector, that is used for styling an existing placeholder.

However, it seems you can do it with JavaScript. By adding this to your theme’s </head> tag in the Admin Settings:

<script type="text/discourse-plugin" version="0.11.1">
api.onPageChange(() => {
    document.getElementById('new-account-email').placeholder =
      'Replace with your email placeholder';
    document.getElementById('new-account-username').placeholder =
      'Replace with your username placeholder';
    document.getElementById('new-account-name').placeholder =
      'Replace with your name placeholder';
    document.getElementById('new-account-password').placeholder =
      'Replace with your password placeholder';
  });
</script>