Skip to content

NodeBB customisation

Locked Customisation
332 4 209.0k 1
  • @jac did you add any additional CSS other than what I provided ? I’m surprised this is impacted as the classes are completely different.

    @phenomlab said in NodeBB customisation:

    @jac did you add any additional CSS other than what I provided ? I’m surprised this is impacted as the classes are completely different.

    No mate I didn’t.

  • @phenomlab said in NodeBB customisation:

    @jac did you add any additional CSS other than what I provided ? I’m surprised this is impacted as the classes are completely different.

    No mate I didn’t.

    @jac I see why. Fixed

    9031d733-2b3c-4a66-ab80-ee9161f81c97-image.png

    I’ve changed the CSS on your site already, so nothing for you to do 🙂

  • @jac I see why. Fixed

    9031d733-2b3c-4a66-ab80-ee9161f81c97-image.png

    I’ve changed the CSS on your site already, so nothing for you to do 🙂

    @phenomlab said in NodeBB customisation:

    @jac I see why. Fixed

    9031d733-2b3c-4a66-ab80-ee9161f81c97-image.png

    I’ve changed the CSS on your site already, so nothing for you to do 🙂

    Amazing mate, thank you so much for doing this!!

  • @phenomlab said in NodeBB customisation:

    @jac I see why. Fixed

    9031d733-2b3c-4a66-ab80-ee9161f81c97-image.png

    I’ve changed the CSS on your site already, so nothing for you to do 🙂

    Amazing mate, thank you so much for doing this!!

    Was thinking about customising breadcrumbs is this something that is possible? / Where the title is and customise that with some colours?

    IMG_20211011_193140.jpg

    Many thanks as always!

  • Was thinking about customising breadcrumbs is this something that is possible? / Where the title is and customise that with some colours?

    IMG_20211011_193140.jpg

    Many thanks as always!

    @jac there aren’t any breadcrumbs in that screenshot ?

  • @jac there aren’t any breadcrumbs in that screenshot ?

    @phenomlab said in NodeBB customisation:

    @jac there aren’t any breadcrumbs in that screenshot ?

    🙈🙈 Ignore me mate. Sorry, I read they can be added in, don’t worry about that.

    I was thinking some styling to where the title sits?

  • @phenomlab said in NodeBB customisation:

    @jac there aren’t any breadcrumbs in that screenshot ?

    🙈🙈 Ignore me mate. Sorry, I read they can be added in, don’t worry about that.

    I was thinking some styling to where the title sits?

    @jac what are you looking for ?

  • @jac what are you looking for ?

    @phenomlab said in NodeBB customisation:

    @jac what are you looking for ?

    I’m not on the laptop currently so am unable to do it, but was thinking of maybe moving the message that’s displayed and just showing that for now on the home page only?

    As for the titles, maybe a blue background with white writing? May look bad but I’m trying to (with the great help from yourself) make it very much fit in with Stockport colours at every opportunity without overdoing it ;).

  • @phenomlab said in NodeBB customisation:

    @jac what are you looking for ?

    I’m not on the laptop currently so am unable to do it, but was thinking of maybe moving the message that’s displayed and just showing that for now on the home page only?

    As for the titles, maybe a blue background with white writing? May look bad but I’m trying to (with the great help from yourself) make it very much fit in with Stockport colours at every opportunity without overdoing it ;).

    @jac Ok. Might make sense to put together a mock up of sorts and I’ll work from that.

  • @jac Ok. Might make sense to put together a mock up of sorts and I’ll work from that.

    @phenomlab said in NodeBB customisation:

    @jac Ok. Might make sense to put together a mock up of sorts and I’ll work from that.

    Thanks mate. Will do 😁

  • @phenomlab said in NodeBB customisation:

    @jac Ok. Might make sense to put together a mock up of sorts and I’ll work from that.

    Thanks mate. Will do 😁

    What I want is where the title is to be blue in the background, with white font?

    And then I thought well this will clash with the menu bar that is also blue so I don’t know whether it can be done but maybe a yellow line to separate the menu and the article title?

    Many thanks.

    IMG_20211011_193140.jpg

  • What I want is where the title is to be blue in the background, with white font?

    And then I thought well this will clash with the menu bar that is also blue so I don’t know whether it can be done but maybe a yellow line to separate the menu and the article title?

    Many thanks.

    IMG_20211011_193140.jpg

    @jac I’m not so sure about this

    5745540e-3637-4e32-abe5-91e2f8774d11-image.png

    It’s too much blue (my opinion). I’d do this

    .topic-title {
        font-weight: 300 !important;
    }
    
    .topic [component="post/header"] {
        margin-top: 0;
        background: #ffc557;
        color: #00205c;
        padding-left: 20px;
        padding-bottom: 5px;
    }
    

    It’s in keeping with the club colours, and will look like this

    e1c76f50-8740-4b12-8c5a-011ff446a46f-image.png

  • @jac I’m not so sure about this

    5745540e-3637-4e32-abe5-91e2f8774d11-image.png

    It’s too much blue (my opinion). I’d do this

    .topic-title {
        font-weight: 300 !important;
    }
    
    .topic [component="post/header"] {
        margin-top: 0;
        background: #ffc557;
        color: #00205c;
        padding-left: 20px;
        padding-bottom: 5px;
    }
    

    It’s in keeping with the club colours, and will look like this

    e1c76f50-8740-4b12-8c5a-011ff446a46f-image.png

    @phenomlab said in NodeBB customisation:

    @jac I’m not so sure about this

    5745540e-3637-4e32-abe5-91e2f8774d11-image.png

    It’s too much blue (my opinion). I’d do this

    .topic-title {
        font-weight: 300 !important;
    }
    
    .topic [component="post/header"] {
        margin-top: 0;
        background: #ffc557;
        color: #00205c;
        padding-left: 20px;
        padding-bottom: 5px;
    }
    

    It’s in keeping with the club colours, and will look like this

    e1c76f50-8740-4b12-8c5a-011ff446a46f-image.png

    Wow that looks great!!!

    ,😁😁😁

  • @phenomlab said in NodeBB customisation:

    @jac I’m not so sure about this

    5745540e-3637-4e32-abe5-91e2f8774d11-image.png

    It’s too much blue (my opinion). I’d do this

    .topic-title {
        font-weight: 300 !important;
    }
    
    .topic [component="post/header"] {
        margin-top: 0;
        background: #ffc557;
        color: #00205c;
        padding-left: 20px;
        padding-bottom: 5px;
    }
    

    It’s in keeping with the club colours, and will look like this

    e1c76f50-8740-4b12-8c5a-011ff446a46f-image.png

    Wow that looks great!!!

    ,😁😁😁

    As for the blue one, would that look any better with the blue info block removed at all? Or is it still too much?

    Many thanks mate 😁

  • As for the blue one, would that look any better with the blue info block removed at all? Or is it still too much?

    Many thanks mate 😁

    @jac I think it’s too much because of the header being the same colour. A blue of they shade will only work if there is something in between it. It’s made much worse as the thread gets longer.

    When the page is scrolled, the title is set to sticky meaning that it’s always visible at the top of the screen. This means the colour is never out of view and is then dominant.

    The yellow is a better choice as it’s not being used anywhere else in the thread and as a result won’t look overdone.

  • @jac I think it’s too much because of the header being the same colour. A blue of they shade will only work if there is something in between it. It’s made much worse as the thread gets longer.

    When the page is scrolled, the title is set to sticky meaning that it’s always visible at the top of the screen. This means the colour is never out of view and is then dominant.

    The yellow is a better choice as it’s not being used anywhere else in the thread and as a result won’t look overdone.

    @phenomlab said in NodeBB customisation:

    @jac I think it’s too much because of the header being the same colour. A blue of they shade will only work if there is something in between it. It’s made much worse as the thread gets longer.

    When the page is scrolled, the title is set to sticky meaning that it’s always visible at the top of the screen. This means the colour is never out of view and is then dominant.

    The yellow is a better choice as it’s not being used anywhere else in the thread and as a result won’t look overdone.

    Thanks for the advice mate, no I agree the yellow would be a better choice definitely. I’ll apply now.

  • @phenomlab said in NodeBB customisation:

    @jac I think it’s too much because of the header being the same colour. A blue of they shade will only work if there is something in between it. It’s made much worse as the thread gets longer.

    When the page is scrolled, the title is set to sticky meaning that it’s always visible at the top of the screen. This means the colour is never out of view and is then dominant.

    The yellow is a better choice as it’s not being used anywhere else in the thread and as a result won’t look overdone.

    Thanks for the advice mate, no I agree the yellow would be a better choice definitely. I’ll apply now.

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac I think it’s too much because of the header being the same colour. A blue of they shade will only work if there is something in between it. It’s made much worse as the thread gets longer.

    When the page is scrolled, the title is set to sticky meaning that it’s always visible at the top of the screen. This means the colour is never out of view and is then dominant.

    The yellow is a better choice as it’s not being used anywhere else in the thread and as a result won’t look overdone.

    Thanks for the advice mate, no I agree the yellow would be a better choice definitely. I’ll apply now.

    Applied mate, looks great, thank you very much. Is there a way to change the titles to bold at all?

    Many thanks as always mate. Don’t forget the Phenomlab footer 😁😉.

  • @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac I think it’s too much because of the header being the same colour. A blue of they shade will only work if there is something in between it. It’s made much worse as the thread gets longer.

    When the page is scrolled, the title is set to sticky meaning that it’s always visible at the top of the screen. This means the colour is never out of view and is then dominant.

    The yellow is a better choice as it’s not being used anywhere else in the thread and as a result won’t look overdone.

    Thanks for the advice mate, no I agree the yellow would be a better choice definitely. I’ll apply now.

    Applied mate, looks great, thank you very much. Is there a way to change the titles to bold at all?

    Many thanks as always mate. Don’t forget the Phenomlab footer 😁😉.

    @jac said in NodeBB customisation:

    Is there a way to change the titles to bold at all?

    Yes - just remove this block

    .topic-title {
        font-weight: 300 !important;
    }
    
  • @jac said in NodeBB customisation:

    Is there a way to change the titles to bold at all?

    Yes - just remove this block

    .topic-title {
        font-weight: 300 !important;
    }
    

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Is there a way to change the titles to bold at all?

    Yes - just remove this block

    .topic-title {
        font-weight: 300 !important;
    }
    

    Many thanks mate, will try this later 😁.

  • @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Is there a way to change the titles to bold at all?

    Yes - just remove this block

    .topic-title {
        font-weight: 300 !important;
    }
    

    Many thanks mate, will try this later 😁.

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Is there a way to change the titles to bold at all?

    Yes - just remove this block

    .topic-title {
        font-weight: 300 !important;
    }
    

    Many thanks mate, will try this later 😁.

    Worked great, many thanks 😁👍🏻.


Related Topics
  • 2 Votes
    1 Posts
    393 Views
    No one has replied
  • Forum customisation

    Customisation nodebb forum customised
    11
    2
    6 Votes
    11 Posts
    2k Views
    Thank you Mark, the changes look fantastic!!
  • Whitespace fixes in Nodebb

    Solved Customisation nodebb
    18
    2
    7 Votes
    18 Posts
    5k Views
    @Panda Just circling back here with something of an update (which I think you’ll like). I’ve completely restructured the ranking system. There are now less ranks, with a higher point threshold to reach them. More importantly, if you reload the site, you’ll notice that the ranks are now icons. I also removed the “Author” badge, and made this a single icon, which (to me) looks much better.
  • Forum Icons NodeBB

    Solved Customisation icons forum nodebb
    13
    0 Votes
    13 Posts
    3k Views
    @cagatay That matches what I see [image: 1667218162107-4f0f858d-9812-42b1-9f61-ffb13d31dccd-image.png]
  • Changing Background on NodeBB

    Solved Customisation background image nodebb
    4
    0 Votes
    4 Posts
    2k Views
    @cagatay You’d target the body tag and use the below line of CSS background: url(/assets/customcss/backgrounds/default/default.png) no-repeat center center fixed; Obviously, you need to change the path to suit where your image is being stored. More info around the background property can be found here https://www.w3schools.com/cssref/css3_pr_background.php
  • [NodeBB] greeting message

    Solved Customisation css nodebb javascript
    2
    1
    3 Votes
    2 Posts
    2k Views
    @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
  • How to set a signature in NodeBB?

    Solved Customisation
    4
    2 Votes
    4 Posts
    2k Views
    @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: 1633427929198-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 .
  • Forum customisation

    Customisation forum customise
    17
    3 Votes
    17 Posts
    5k Views
    @jac said in Forum customisation: @phenomlab said in Forum customisation: @jac 100%. Just setting up some free time. I’m on annual leave from work offer the coming 2 weeks so hopefully will have a bit more time then. Not a problem Mark, I don’t wish for you to use all your spare time doing that, just do it when you can, no issues I know you’re busy doing other things but when you get a chance mate I’m happy for this to go ahead along with the RSS script.