Apologies if this doesn’t belong in support. Currently, the main /s subscription page simply shows the subscription/payment options. And each subscription/payment option has only a limited amount of text characters you can include. For my purposes, I’d like to make the /s landing page a bit more welcoming and informative rather than just “business only”. Is it possible to add some kind of introductory or informative text to the /s page above the sub/payment options? Or is this something that might be implemented (one day) as an option or is it beyond the scope? Basically, just a user editable text box with standard formatting options above the current options. I’m not entirely familiar with the css editing options of discourse yet, so I’m uncertain what’s possible when it comes to editing pages or plugins or components. So please excuse any ignorance on my part. Any insight would be appreciated. Thank you.

I got it to work on only the subscriptions page and mostly properly formatted with the following. Huge thanks to @pfaffman and @NateDhaliwal for providing the clues necessary for this complete solution to my needs. Note: This works for my needs, but it’s very hacky. Go to Admin Go to themes and components Choose components tab Choose “install” Select “new” from options Paste in the css (below) Alter CSS to meet your needs Save Enable it (if it isn’t already) and make sure it’s enabled for your specific theme(s) (“include this component on these themes”). Tip: Need help fine tuning the CSS? Consult an AI model like Gemini, Claude… feed it the CSS and tell it what you want to do. /* PART 1: The Header (Styled like a native H1) */ body:has(.product-list) .above-main-container-outlet.subscriptions-campaign::before { content: "This is the Headline"; display: block; /* Styling to match 'title-wrapper' headers */ font-family: var(--heading-font-family); font-size: var(--font-up-5); font-weight: bold; line-height: var(--line-height-small); color: #DDDDDD; /* Space between this header and the text below it */ margin-bottom: 8px; } /* PART 2: The Body Text (With spacing below it) */ body:has(.product-list) .above-main-container-outlet.subscriptions-campaign::after { content: "This is the plain text that goes below the header. \A You can still use backslash-A for new lines here."; display: block; /* Styling to match standard body text */ font-family: var(--font-family); font-size: var(--font-0); line-height: var(--line-height-medium); color: #DDDDDD; white-space: pre-wrap; /* This creates the empty space (carriage return) below your text */ margin-bottom: 40px; } [Screenshot_20251206_201315_Firefox]

I think this can be done with CSS. Could you send a screenshot with where you want to add the text? Thanks.

You can see where the plugin outlets are. Then my Custom Components – add button or text at any plugin outlet will let you stick arbitrary text in any plugin outlet.

[imagen] NateDhaliwal: Could you send a screenshot with where you want to add the text? Sure. I envision something like this… Before/After. Note, I had to change the default “Subscriptions” text to “make a payment” because we offer more than subscriptions. Although it appears that the text is also tied to the page title. So in my case, it would make more sense to add a block of text above the existing page title vs. below it. [image]

[imagen] pfaffman: my Custom Components – add button or text at any plugin outlet will let you stick arbitrary text in any plugin outlet This looks great and powerful. Is this something I’m able to take advantage of if I’m hosted? It’s a little light on instructions for new Discourse users – so I’m probably not the ideal candidate for use at present, but I’m trying to get up to speed as quickly as possible and this looks like it would be really handy. I had to follow to the Github page to find reference to this: To find plugin outlets, run enableDevTools() in the javascript console. I appreciate you answering my query. Thank you.

[imagen] ZeroDean: Is this something I’m able to take advantage of if I’m hosted? Yes. It’s a theme component. (At least most plans allow you to install whatever theme components you want). Did you try clicking the big blue button that says “Install this theme component”? [imagen] ZeroDean: It’s a little light on instructions That sounds like a fair criticism! I added a link to Introducing Discourse developer toolbar so you can find where the plugin outlets are. [imagen] ZeroDean: I had to follow to the Github page to find reference to this I even added that link before I read this part of your message! :slight_smile: Oh, but looking at the plugin outlets on /s it doesn’t look like there are any plugin outlets. If you want to stick text above the “Make a payment” heading, you’re in luck! [image] (Pretend “Pay for Services” is “Make a Payment”) You can put it either at top-notices or above-main-container, but I’m afraid that will add the stuff on every page, not just the payment page unless you can figure out some CSS to hide it on all of the other pages. If you’re patient, there’s a reasonable chance you can get https://ask.discourse.com/ to tell you how to do that. OTOH, it would be a fair request to have a plugin outlet added on that page, but that’s another thing to learn.

[imagen] pfaffman: It’s a theme component. Yes. I am at a level where I can install theme components without issue. [imagen] pfaffman: That sounds like a fair criticism! Wasn’t intended as criticism at all. My apologies if it came across that way. Was just an observation as a new user. [imagen] pfaffman: I added a link to Introducing Discourse developer toolbar so you can find where the plugin outlets are. Yes, I’d discovered that link earlier in my searches. The problem is, I don’t know how to run Discourse in a development environment (or access it via the browser console) yet. So my query about being able to take advantage of your component was about that and needing access to the dev toolbar to use it, not the installation of the component itself. Sorry for the confusion. [imagen] pfaffman: If you’re patient, there’s a reasonable chance you can get https://ask.discourse.com/ to tell you how to do that. I wasn’t aware of this resource, thank you. As for placement, I’m content to place the intro text anywhere it will easily fit above the actual “subscription” content so long as it doesn’t show up on every page. I appreciate your thoughtful response.

[imagen] ZeroDean: Wasn’t intended as criticism at all. No, no. I meant to imply, yes. You’re right. The documentation should be improved. That’s why I said it was “fair”! [imagen] ZeroDean: Yes, I’d discovered that link earlier in my searches. The problem is, I don’t know how to run Discourse in a development environment (or access it via the browser console) yet. You don’t have to. Just open the developer tools in your browser (F12 works unless you’re on a Mac; and I have to look it up every time I use a mac even though there is one 8 feet from me then I google “mac open dev tools browser” or something like that) and type enableDevTools() in the console prompt. You can do it right here, right now, on this site.

[imagen] pfaffman: I have to look it up every time I use a mac I never use a Mac, but I remember “J” thanks to [imagen] Preparing for Discourse's upgrade to Ember 5 megaphoneAnnouncements option command J should be easy for you to remember laughing

[imagen] pfaffman: and type enableDevTools() in the console prompt. Ahhh. Browser developer console, not some Discourse dependent console. Things are beginning to make more sense. Thank you. I enabled Custom Components. And enabled devtools in the browser console. And activated the developer toolbar to see plugin-components. And now I understand, you’re saying there is no plugin-component for Subscriptions, so no *easy way to place text on that specific landing page. Got it. *easy as in Step 1. Step 2. Step 3. Success! And not requiring hours of research and CSS education, etc. [image] I read somewhere in my recent Subscriptions searches (sorry I don’t have the link at this exact moment) that it was due for an overhaul anyway. Hopefully my suggestion for an intro/text area will be considered in any future development. I appreciate the help in this thread. Thank you.

There should be a body class that’s only on the subscription page, so you can then use CSS to hide the thing you add on every page except the subscription one. Yes, subscriptions has class="above-main-container-outlet subscriptions-campaign ember-view", so you do something like hide the class of the thing you add and then un-hide it if it’s in a subscriptions-campaign. Something like that.

¿Insertar texto de introducción en la página /s?

Desarrollador

NateDhaliwal (Nate Dhaliwal) 8 Diciembre, 2025 11:02 18

@ZeroDean ¡La PR ha sido fusionada! ¡Espero que eso ayude!

Tema		Respuestas	Vistas
Banner text customization for Subscriptions plugin Product Support subscriptions	7	1724	14 Marzo 2022
Customizing Subscription Plugin pages Development subscriptions	5	821	11 Mayo 2021
Add project description to login page Product Support	10	1752	19 Mayo 2021
Topic Template Placeholder Text theme component Theme component	60	7711	21 Agosto 2026
Page Publishing Site Management how-to , page-publishing , content	65	28381	23 Enero 2026

¿Insertar texto de introducción en la página /s?

Temas relacionados