Page Publishing

Page Publishing

Page Publishing allows Staff/Admin users the ability to convert a topic into a static standalone page with support for custom styling. This is similar to the pattern in use for Terms of Service or the Privacy Policy pages. Note that published pages will respect the visibility rules of the associated topic.

Enable Page Publishing

Activate enable page publishing under Admin > Settings

Enable page publishing when login is required

Activating show_published_pages_login_required under Admin > Settings will allow published pages to be visible even when not logged in.

Publish a Topic

On the first post of a public topic, hitting the ... menu (1) will reveal the wrench (2), which in turn will reveal the post administration menu (3), with a new option:

  1. Go to post #1 and select the ellipsis iconā€¦
    image

  2. Select the wrench icon
    image

  3. Select ā€œPage Publishingā€
    image

This reveals a modal dialog proposing to publish the topic as a page, where you can choose the (pre-filled) slug, just as you would do for a categoryā€™s slug ā€“ itā€™s automatically generated from the post title. You will also get a preview of what your published pageā€™s URL will look like.

Published Topic

A published topic shows a notice under the title that allows access to its publishing settings:

Unpublish a Topic

Selecting Publishing Settings will bring up options that allow you to unpublish the topic

Publishing Public Pages

In your admin settings, there is a show published pages login required setting that you can override to allow your pages to be displayed to everyone even when login_required is enabled on your account.

Public Page Indicators

When Publishing

There is a ā€œpublicā€ checkbox on the Page Publishing modal dialog window to indicate that topic restrictions have been overriden:

On Topics

There will be a ā€œPublicā€ tag under your original topicā€™s name to indicate that the page is public.

Styling of a Published Page

The structure of a published page makes it easy to customize its CSS style:

Beginning of the HTML document of a published page
<body class="published-page">
    <div class="published-page-header">
        <div class="published-page-header-wrapper">
            <a>
                <img class="published-page-logo"/>
            </a>
            <h1 class="published-page-title">Guide for ActivityPub users</h1>
        </div>
    </div>
    <div class="published-page-content-wrapper">
        <div class="published-page-content-header">
            <div class="published-page-author">
                <img  class="avatar" src="/letter_avatar_proxy/v4/letter/n/da6949/90.png">
                <div class="published-page-author-details">
                    <div class="username">nedjo</div>
                    <div class="topic-created-at">February 8</div>
                </div>
            </div>
        </div>

        <div class="published-page-body">
The relevant CSS selectors
CSS Selector Affects
body.published-page the whole page (or simply: .published-page) Note that slug, category and tags will also be appended as css classes
.published-page-header a div containing the page header (similar styling to discourse d-header)
.published-page-header-wrapper a div around the site logo and page title
.published-page-logo The site logo (uses the small version)
.published-page-title The page title
.published-page-content-wrapper a div around the content
.published-page-content-header the title and authorship information
.published-page-title the topic title (h1 tag)
.published-page-author the avatar, name of the author, and topic creation date
.published-page-author .avatar the avatar
.published-page-author-details the username and topic creation date
.published-page-author-details .username the authorā€™s username
.published-page-author-details .topic-created-at the topicā€™s creation date
.published-page-body the page contents

You can go to Admin > Customize > Themes > CSS and play with it.

Additional Notes:

Big special thanks to @hellekin for starting the documentation and providing us with valuable feedback.

Wiki Page

Itā€™s possible to ā€œpublishā€ a wiki page, which means every member, not only Staff, can update it.

Theme Component

Users can look at creating a theme component to supplement the published pages.

113 Likes

I still need to try this out first hand so the following may not be grounded in reality, but:

It strikes me that this permission model sets up a scenario where you always see two copies of the pagesā€™ content ā€“ one in the relevant Discourse category, and one in the published pages themselves. This of course seems duplicative if youā€™re wanting to publish pages for the general population that is similar to, or identical to, your Discourse user base.

OTOH, if pages had the ā€œworld readableā€ flag available, you could then restrict who can see/edit them to a small group, and the only place the content would be available to other Discourse users would be in the published links themselves.

(Iā€™m thinking of a use case of a ā€œdocumentation siteā€ here.)

Otherwise, Iā€™m pretty excited to test things out!

7 Likes

Awesome stuff, and thanks again for listening to your users. I love the ā€˜lets make this better for us allā€™ vibe that Discourse has! Weā€™ll make heavy use of this.

When discussing one use (patching up an install that went a bit awry), another user pointed out a remaining bit of icing that could do with going on the cake:

Hey, is there any way to include the ability to make /faq and /about public as well, as they are currently hidden in Login Required sites. We can of course use the existing functionality that youā€™ve just released for /faq by making our own, changing the link in settings, and explicitly linking to it. However, this is not pretty and the existing navigation to it remains hidden. We canā€™t do that at all for /about of course.

9 Likes

Something that would go nice with this feature is to make publications onebox-compatible such that people could easily share the content.

15 Likes

Please excuse my ignorance, as I am very much a beginner in the HTML/CSS spaceā€¦ however, how would we go about applying our theme colour choices to published pages. At its simplest, Iā€™d like to use the dark background/white text to give the published pages the same darkmode experience as accessing our forums.

Is this already in the product, or do I need to play with HTML/CSS? If the latter, could anyone give me some pointers in the right direction? Thanks!

4 Likes

Can you make this a separate feature request please? This is not related to page publishing, as in I wouldnā€™t have to change anything related to page publishing to make it possible. I do agree it would be better if all these ā€œstaticā€ pages could have more or less the same behaviour, but there are multiple solutions here (do nothing? add site settings? migrate these to page publishing?), so we might want to have a dedicated topic for this.

8 Likes

GTM not loaded on published pages? Would be nice.

2 Likes

Hmm that is a really good point.

Just trying to think of a solution hereā€¦ would it work if type="text/javascript" and type="text/discourse-plugin" were treated differently? The API needs the latter, right?

5 Likes

Yes I think we already support having a text/javascript in the theme fields, so there are certainly solutions in this area.

7 Likes

That would be great.

1 Like

So itā€™s currently impossible to have responsive published pages, and this site particularly wants

  1. images made available when sharing to public media, and
  2. responsive/resizing images displayed, especially on mobileā€“oh, mobile could just resize the image with CSSā€“that should work, right?
5 Likes

+1 for having the Discourse header in published pages. Iā€™m missing my website logo, custom header links and beloved hamburger menu :slight_smile:

Another oddity: in posts, my lightboxed images open in a nice popup, whereas in published pages, they open in a new tabā€¦

7 Likes

I think whatā€™s needed is a set of theme components that add such. The last client I had to use this wanted the topic creator removed. I think itā€™s hard to guess what will meet peopleā€™s needs for this!

6 Likes

Are there currently any ongoing efforts for adding ā€œsimpleā€ (non-API) Javascript support to published pages? Or should we forget about this near- to mid-term ?

9 Likes

Can i display external non-Discourse JSON on this page? Because we canā€™t use php code here and discourse strip most of html so i do not know how to do itā€¦

2 Likes

I have a problem with a published page - the button to copy the content of the code block is not visible on a published page. Screenshot: Screenshot by Lightshot. I move the mouse over the block, but the button doesnā€™t appear. When logged in - everything works as usual - ok.

Can anybody repeat the problem? Any solution?

2 Likes

Thank you @riking !

It indeed seems that ā€œregularā€ text/javascript is executing on published pages when itā€™s in the header or footer of a theme component.

7 Likes

Ha! So it seems that thereā€™s a hacky way to make some theme components work with page publishing.

Iā€™m looking into adding some header/footer to the published pages, and theme components seem to be the way to go. But it seems bad to go on and implement something that would potentially break in the near future.

@riking, it looks like the text/javacript type in header or footer working on published pages was unintented. Is it going to be fixed or used to extend published pages?

@syl, author of DiscPage, mentioned the possibility to re-implement the DiscPage plugin using Page Publishing functionality. Do you still have this in mind, @syl? What do you think would be the path of least resistance to integrate both functionality @riking?

7 Likes

Unfortunately, the ā€œPage Publishingā€ feature doesnā€™t meet my needs. For me to use it, I would need published pages:

  1. to be displayed within the normal Discourse layout, i.e. with the standard Discourse header (just like the Terms of Service and the Privacy Policy), and
  2. to be rendered like normal (decorated) topics, i.e. supporting bbcode and plugins.
14 Likes

In the meantime I used the default Discourse customization facility:

  1. Identify the added element, e.g., with a published-page-footer-links CSS class.
  2. Customize CSS to hide this element by default and show it only for published pages
  3. Add the element in the Footer space

2. In CSS, add:

/* Only show footer links on published pages */
.published-page-footer-links { display: none; }
.published-page .published-page-footer-links { display: block;}

3. in Footer, add:

<nav class="published-page-footer-links">
Hi there! This is the footer for published pages!
</nav>
7 Likes