How to create this theme in Site Customization?

Contribute UX

AI-generated summary

The discussion revolves around integrating a custom theme into Discourse’s “Site Customization”. surjithctly shared a style they created for Envato Forums by manipulating the DOM and provided a link to the code. However, the link was broken, and sam pointed it out. surjithctly later provided the correct link.

simon suggested looking into a post about including thumbnail images for ideas on customization. Meanwhile, riking shared a code snippet using observeDOM and suggested hooking into Ember for more efficient customization. surjithctly expressed their inexperience with Ember, which is hindering their ability to implement the suggested changes.

1

I have created this style for Envato Forums. it’s just manipulating the DOM.

Here is how it looks like :

IMAGE LINK (new users can’t put images)

Actual Code to Install : Envato : Old Forum Style for New Forums · GitHub

I’m new to Discourse. I’d love to know how this can be integrated in “Site Customization”

2

Link is broken, do you have a local discourse install or one where you are an admin ?

3

This is his image:

https://discourse-cdn.global.ssl.fastly.net/envato/uploads/default/original/2X/0/0fbcecd5022e0d7fffa58366df1e1235d816e368.png

edit: d’oh

4

Sorry, I mean the gist link is broken.

5

You might get some ideas for how to include a thumbnail image from this post: Reddit Style picture thumbnail on the left - #37 by rewphus

6

Sorry, here is the actual link to the CSS & JS Code

Oops.. cant post more than two link :slight_smile: please see the original post for the updated link :+1:

7 
observeDOM( document.getElementById('main-outlet') ,function(){
     setTimeout(function(){
            $('.topic-list-item').not('.old-forum-loaded').each(function() {
             showAvatars( $(this) );
             hideCustomTags( $(this) );
             });
        },1000)
});

You should be hooking into Ember to do these :smile: That’ll let you filter out the tags before they even go into the DOM.

8

I wish I could. but I’m new to the Ember thing :stuck_out_tongue: