Skip to content

NodeBB customisation

Locked Customisation
332 4 280.0k 1
  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Ok, but I’m not sure this is going to be a good idea. On/Off typically aligns itself to “traffic light” colours, so if anything, it should be green and red (or grey for “offline”).

    That’s a fair point mate, probably just change the offline to red then if possible at all?

    Many thanks mate.

    wrote on last edited by RiekMedia

    @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    
  • @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    
    wrote on last edited by

    @riekmedia said in NodeBB customisation:

    @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    

    Many thanks for the code that has worked. 👍🏻.

    I’ll not be much help technical wise I’m afraid on here but it’s great to see others posting and helping out too 😁.

  • JAC JAC

    @riekmedia said in NodeBB customisation:

    @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    

    Many thanks for the code that has worked. 👍🏻.

    I’ll not be much help technical wise I’m afraid on here but it’s great to see others posting and helping out too 😁.

    wrote on last edited by JAC

    Is there any way to style this widget at all?

    IMG_20211108_210405.jpg

    Image uploaded successfully 👍🏻😉.

  • JAC JAC

    Is there any way to style this widget at all?

    IMG_20211108_210405.jpg

    Image uploaded successfully 👍🏻😉.

    wrote on last edited by

    @jac yes, there is. What do you have in mind ?

  • JAC JAC

    Is there any way to style this widget at all?

    IMG_20211108_210405.jpg

    Image uploaded successfully 👍🏻😉.

    wrote on last edited by

    Unsure if it’s possible but for the title background to be in yellow that’s used throughout the forum and then the main background to be blue with white font?

    I’m unsure if this is poss for individual widgets however if this can be achieved that would look great!

    Many thanks.

  • JAC JAC

    Unsure if it’s possible but for the title background to be in yellow that’s used throughout the forum and then the main background to be blue with white font?

    I’m unsure if this is poss for individual widgets however if this can be achieved that would look great!

    Many thanks.

    wrote on last edited by

    Basically I’m looking to improve and edit things where I can, so little changes here and there that I think will make a difference 😁.

  • JAC JAC

    Unsure if it’s possible but for the title background to be in yellow that’s used throughout the forum and then the main background to be blue with white font?

    I’m unsure if this is poss for individual widgets however if this can be achieved that would look great!

    Many thanks.

    wrote on last edited by

    @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

  • @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    wrote on last edited by

    @phenomlab that definitely sounds great if it is possible 😁.

  • @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    Interested to see how this would look.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    Interested to see how this would look.

    wrote on last edited by

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    
  • @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    

    Wow that looks great!! 😁😁

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    

    Wow that looks great!! 😁😁

    wrote on last edited by

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    

    Wow that looks great!! 😁😁

    Many thanks Mark incredibly happy with the result! 😁

  • JAC JAC

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    

    Wow that looks great!! 😁😁

    Many thanks Mark incredibly happy with the result! 😁

    wrote on last edited by

    @jac Good. Thanks for letting me know.

  • @jac Good. Thanks for letting me know.

    wrote on last edited by

    @phenomlab brilliant mate 👏🏻👏🏻👏🏻. Thanks again.

  • JAC JAC

    @phenomlab brilliant mate 👏🏻👏🏻👏🏻. Thanks again.

    wrote on last edited by JAC

    I wonder if the slider can be customised with CSS?

    Looking to add colour thoughout here and there without overdoing it of course.

  • JAC JAC

    I wonder if the slider can be customised with CSS?

    Looking to add colour thoughout here and there without overdoing it of course.

    wrote on last edited by

    @jac Can can customise anything with CSS…

  • @jac Can can customise anything with CSS…

    wrote on last edited by

    @phenomlab very happy to hear this 😁🙌🏻

  • JAC JAC

    @phenomlab very happy to hear this 😁🙌🏻

    wrote on last edited by

    @jac said in NodeBB customisation:

    @phenomlab very happy to hear this 😁🙌🏻

    Yes, but the key here is to not over egg…

  • @jac said in NodeBB customisation:

    @phenomlab very happy to hear this 😁🙌🏻

    Yes, but the key here is to not over egg…

    wrote on last edited by

    @phenomlab Absolutely, I’m just looking to do subtle changes which I think you have achieved so far, can’t thank you enough for the help given via Sudonix 👏🏻.

  • JAC JAC

    @phenomlab Absolutely, I’m just looking to do subtle changes which I think you have achieved so far, can’t thank you enough for the help given via Sudonix 👏🏻.

    wrote on last edited by

    @jac IMG_20211109_175456.jpg

    Is there any way to chance the colour of these at all?


Related Topics
  • Forum customisation

    Customisation nodebb forum customised
    11
    2
    6 Votes
    11 Posts
    3k Views
    JAC
    Thank you Mark, the changes look fantastic!!
  • NodeBB recent cards customisation

    Solved Customisation nodebb recent cards
    3
    1
    2 Votes
    3 Posts
    1k Views
    JAC
    @phenomlab thank you very much for the assistance Mark, massively appreciated as always. The great thing about this is it’s all documented for other NodeBB users that come looking for solutions . Looks far better .
  • [NodeBB] greeting message

    Solved Customisation css nodebb javascript
    2
    1
    3 Votes
    2 Posts
    2k Views
    phenomlab
    @pwsincd welcome to sudonix, and thanks for the comments. What your looking for is here https://sudonix.com/topic/195/nodebb-welcome-message/3?_=1648295651358
  • [NODEBB] Stats

    Unsolved Customisation plugin stats script
    20
    1
    2 Votes
    20 Posts
    6k Views
    JAC
    @phenomlab said in [NODEBB] Stats: @jac or I land up fixing it I wouldn’t put it past you
  • [NodeBB] username cards

    Solved Customisation nodebb
    8
    5 Votes
    8 Posts
    3k Views
    Sampo2910
    @phenomlab Aha…nice to know. As always thank you for the reply and information.
  • NodeBB Design help

    Solved Customisation
    8
    3
    2 Votes
    8 Posts
    4k Views
    phenomlab
    @riekmedia I’ve applied some new CSS to your site. Can you reload the page and try again ? For the record, this is what I added #footer { background: #2d343e; border-top: 4px solid #2d343e; font-size: 0.9em; margin-top: 70px; padding: 80px 0 0; position: relative; clear: both; bottom: 0; left: 0; right: 0; z-index: 1000; margin-left: -15px; margin-right: -338px; } The /categories page seems a bit messed up, so looking at that currently EDIT - issued some override CSS in the CATEGORIES widget <!--- CSS fix for overspill on /categories page - DO NOT DELETE --> <style> #footer { margin-right: -45px; } </style> That should resolve the /categories issue.
  • How to set a signature in NodeBB?

    Solved Customisation
    4
    2 Votes
    4 Posts
    2k Views
    JAC
    @phenomlab said in How to set a signature in NodeBB?: @jac No issues at all with copying. This is set using the signature for the user you are posting as. In the case of Hostrisk, it’s set like the below [image: 7bf04183-f6e8-4d72-b0eb-c9a05c9cd24b-image.png] You can set the signature by using https://domain.com/user/theuser/edit Mamy thanks Mark, I’ll set this up later .
  • Customising NodeBB

    Locked Customisation nodebb
    3
    0 Votes
    3 Posts
    3k Views
    phenomlab
    Closing this thread as a duplicate of https://sudonix.com/topic/12/nodebb-customisation