How to add custom CSS code in the backend level and create new docker image

Support
1

I want to update the custom CSS code in the discourse. I have installed discourse docker image and I want to create new docker image with my CSS code as well.
I want to add one custom CSS file into the Light theme under the Common. I know the process of adding the CSS file in the front end side, but this is for code level I want to add the CSS file then I want to create new docker image.

2

Add the code in a plugin.

3 Likes
3

Thanks a lot for the response, I have tried to create the plugin with custom CSS file, for that in my GitHub I have added plugin.rb(no ruby code inside) and I have mentioned the path in app.yml file. But I can’t able to see the plugin in web portal but I can able to see in plugin folder. which means my GitHub and app.yml are working fine my only problem is plugin is not appearing in web portal.
Could you please me on this, Thanks in advance.

5

Does your plugin work in a development environment? That’s where to start. There are howto topics for plugin development.

I can’t offer much help here on that. If your have a budget, my contact info is in my profile. Otherwise, you can post more info about your plugin and what the problem is in dev (or possibly rename and move this one).

3 Likes
6

You only want to add the css, there’s no other code?

I created a while back a little plugin with some css (ignore the javascript folder), it will show you how to register the scss file and the path to the css code

https://github.com/iunctis/iunctis-theme

5 Likes
7

Thanks a lot for the help, Yes now I can able to see the changes of themes but when I am clicking the plugin button I am getting “Error while trying to load” and in console "Error: Can’t hydrate plugin without an id". I have tried to find the fix but no luck. Could you please help me out for this issue.

8

Whcih plugin did you use?

1 Like
9

I was suggesting to write one. There is a suggested model above.

10

Thanks for the response. I have created own plugin, the plugin and setting.yml code is below.

plugin.rb

# name: my-theme
# about: CSS theme
# version: 0.1
# authors: Muthukkumar

register_asset 'stylesheets/common.scss'

setting.yml

plugins:
  awesomeness_enabled:
    default: true
    client: true
  awesomeness_max_volume:
    default: 10
    client: true

With this code the css file are working fine like I can able to see the different themes but when I click the plugin button I am getting the error “Error while trying to load”.
console:

[object Error]: {description: "Can't hydrate plugin without an id", message: "Can't hydrate plugin without an id", stack: "Error: Can't hydrate plugin without an id at _hydrate (http://mydomain.cloudapp.azure.com/assets/application-191c740da68414e64ef64eca7583598eb54021aa742309160a164d8f601e141f.js:9:541) at Anonymous function (http://mydomain.cloudapp.azure.com/assets/application-191c740da68414e64ef64eca7583598eb54021aa742309160a164d8f601e141f.js:8:31086) at Array.prototype.map (native code) at _resultSet (http://mydomain.cloudapp.azure.com/assets/application-191c740da68414e64ef64eca7583598eb54021aa742309160a164d8f601e141f.js:8:31063)

And the logo also not getting changed. Could you please help me on that I have tried to find the solution but no luck.

Many thanks in advance.

11

Hi Thanks for the response, I have tried howto, with help of that I created the plugin with that the css changes are working fine but the problem is when I am clicking plugin I am getting the error and the logo also not getting loaded.

12

Hi its working fine with the custom plugin. Thanks a lot for the support.

1 Like