The Trendy Login theme component, maintained by the Discourse team, replaces the default static login page design with customizable options for backgrounds (images, colors, or gradients) and subheaders that support HTML markup. Users can install the component via the provided repository link and manage support, bug reports, or feature requests in specific Meta categories.
Discussion highlights reveal several common configuration issues and solutions. Muhammed_EKİCİ reported the component not working on the latest Discourse version, but Arkshine confirmed it functions correctly. MarkDoerr and Roi clarified a crucial requirement: the component only affects the static login page, which appears only when the login required site setting is enabled. Without this setting, users encounter a login modal instead, rendering the component inactive.
Regarding styling, Bubbles encountered a layout issue with a large left bar, which Bubbles resolved by adding custom CSS to adjust the .wrap max-width. IrisBetty sought advice on optimizing background images for both desktop and mobile screens. Additionally, wendellverli asked about the source of a video link and a custom title appearing on the page. Moin explained that the video is embedded via the login_subheader setting using an iframe, while Moin clarified that the “Welcome to…” title and logo are derived from the site’s general text settings (login_required.welcome_message) and community logo, which can be customized in the admin panel.
Trendy Login changes the default design of static login page (/login) on login required sites and adds the ability to customize the page content via component settings.
I know this is an old comment, but I’ve just started using this on a test site so I want to check in.
You must enable the login required site setting to get the static login page. Otherwise, as you noted, you can enable the component but you’ll still get the login modal rather than the trendy login.
To get the static login page you must require login. If you don’t and you hit the /login route, you get a login modal instead and this component is ignored.
Hi. This is working beautifully on a pc screen but only uses the left hand third of the image on mobile. Is there something I should to to get the pc image to shrink more widthways - realising that the aspect ratio is different.
Any advice how to use the component for a good look on typical pc screen and mobile much appreciated.
I think in the example something like this has been used: Use this space to include some important information about the site before signing up, and even a video: <iframe width="560" height="315" src="https://www.youtube.com/embed/u7iW9DyFw7M?si=SQImwxaPkPVQgaNt" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
You can get the embedding code from the share option on YouTube.
The other thing that is confusing …is the “Title” – why not embed a custom title in the plugin / component so users can add whatever title they want. I can’t find the source anywhere.
“Welcome to …” is a site text also used when the component is not enabled. You can customize it at /admin/customize/site_texts by searching for login_required.welcome_message.