Do you have original customisations?

[HAWK]

I’m seeing more and more uniquely customised Discourse implementations around and it’s fantastic.

I’d love to build up a list so that people can see what is possible.

If you have customised your community in a way that is unique, please post a link along with a description of what you have done (and how, if you’re willing to share that). Examples might be customised navigation, banner posts, footers, promo spots etc.

Note: Please only contribute to this topic if you have done something unique to your forum – if not then feel free to post in this general directory topic.

[notriddle]

assuming that stuff built with webhooks and the API counts

Janitor’s new blog uses Discourse for most of the real work. A staff-only tag (published) is used to make it show up on the page, comments are backed by Discourse, and, since we’re actually doing a one-way sync, the page loads very fast.

[jerdog]

That’s fantastic @notriddle - I love the idea. So does the below mean that anyone can post a blog topic, but it’s not published until a staff-member tags it?

// Discourse is made up of "topics" that contain one or more "posts".
// The first post in a published[^1] blog[^2] topic is considered the blog post itself.
// The rest are comments on it.
//
// [^1] "published" is a staff-only-tag.
// [^2] "blog" is a category, and is not staff-only.

[notriddle]

Yeah, though creating topics in the category is locked to TL1 because there’s no reason for completely new users to be writing blog posts.

[bts]

Here’s our forum!:

The Cracking the Code Forum

We’re using a pretty vanilla install, i.e. not really any plugins beyond the WP Discourse plugin for SSO with our Wordpress site. But we’ve done some fairly extensive frontend / design tweaks.

Aside from color scheme and some UI adjustments and simplifications I think the most noticeable thing we did is add a visual header banner for each category. We liked how this looked on some other sites we came across e.g. Flarum and found it nice to have extra visual distinction for categories. This is done with custom HTML in the “after header” section plus some fairly complicated CSS targeting…luckily Discourse has category slugs included in class names!

Other tweaks we did include a custom header (won’t go into detail b/c there are other great detailed tutorials on that to be found here!); a bunch of minor things w/ text size and button display; and hiding a few things with “display: none” that seemed inessential for our moderately sized forum, to try to minimize visual clutter.

[erlend_sh]

Aside from color scheme and some UI adjustments and simplifications I think the most noticeable thing we did is add a visual header banner for each category. We liked how this looked on some other sites we came across e.g. Flarum and found it nice to have extra visual distinction for categories. This is done with custom HTML in the “after header” section plus some fairly complicated CSS targeting…luckily Discourse has category slugs included in class names!

This looks awesome! Could you share this as a theme (component)?

How to develop custom themes

Discourse now supports native themes that can be sourced from a remote git repository. Recently we also added support for branches and private repositories. [image] Note that Import and Export from a dcstyle file still exists. [image] An example theme is at: GitHub - SamSaffron/discourse-simple-theme: Sam's simple discourse theme [image] The theme will be synchronized to the git repository used (once a day), any changes made to the repository will be detected clicking the Check for Updates …

Create and share a font theme component

Discourse supports importing themes containing assets from a remote repository. This allows theme authors to share fonts and images. Create a new git repository with the font mkdir discourse-roboto-theme cd discourse-roboto-theme git init . vim about.json For about.json add a skeleton config file { "name" : "Roboto theme component", "about_url" : "", "license_url": "", "assets": { "roboto": "assets/roboto.woff2" } } Add a LICENSE file, I usually use MIT vim LICENSE D…

[subtenko]

Bro this is what I was looking for! Thank you so much for posting this. Im about to head out but I’ll give it a try, should be simple to figure out the HTML thing. CSS part should be easy as you mentioned category slug styles are ready. I’ll just be using background images instead of colors.

I also gotta try to to this for profile pictures (Have them go full width but everything else stay the same)

[bts]

Awesome! Btw just found this other relevant discussion and posted w/ more detail and code examples here:

How difficult would it be to make the Discourse UI more like Flarum?

Thanks @erlend_sh good catch! Didn’t see this topic yet. Yes we spent some time last year on exactly this, trying to get something close to the Flarum-style headers. This is what it looks like on our site: [50%20AM] [18%20AM] [37%20AM] And here’s the gist of the HTML / CSS we came up with for this— CSS: (This is all in “common” — besides this there are also a few minor margin / padding tweaks for desktop vs. mobile I didn’t include below.) /* GENERAL */ body { overflow-x: hidden; } …

(Looks like there are a couple different attempts at this so we may be able to merge them / create a theme component at some point!)

[Stranik]

I really like Discourse and there are a lot of possibilities. For example, only using the following code:

currentUser.get('trust_level');

We can do the following things: personalize users.

The participant receives the following trust levels, fills in the profile, and participates in the discussion. You can write a lot of rules, but few people like to search the site and read all in different places. There was an idea to create a page where you could put everything in one place. This will be information specific to the individual participant.

• As he filled out the profile.
• Why would he get a diploma and what would it look like?
• Why would he pass a bot?
• What else can he do?

The page can look like anything, for example.

The link to this page can come from different places: from the personal first message or from different widgets. Like this.

All in one place.

Google translator. (

[BlackKnob]

Aside from color scheme and some UI adjustments and simplifications I think the most noticeable thing we did is add a visual header banner for each category. We liked how this looked on some other sites we came across e.g. Flarum and found it nice to have extra visual distinction for categories. This is done with custom HTML in the “after header” section plus some fairly complicated CSS targeting…luckily Discourse has category slugs included in class names!

This looks fantastic, a beautiful design. Would love to see your theme published.