Skip to content

NodeBB customisation

Locked Customisation
332 4 274.2k 1
  • JAC JAC

    @jac said in NodeBB customisation:

    @downpw said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @downpw said in NodeBB customisation:

    Hmm if you talk about nodebb-plugin-browsing-users, the don’t work on mobile (we don’t see who read or talk at real time like on desktop).

    I think that’s just CSS set to hide on mobile viewport ?

    Yeah maybe 🙂

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    How to do this

    You should be able to use the (example) CSS provided by @DownPW

    @JAC

    Like said @phenomlab, you can use this CSS code on ACP/APPEARANCE/Custom CSS/LESS :

    a493733e-b36a-44d8-a8c5-cd9a2ca64a32-image.png

    Many thanks to both 😁

    Must try this tomorrow 👍🏻

    wrote on last edited by

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @downpw said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @downpw said in NodeBB customisation:

    Hmm if you talk about nodebb-plugin-browsing-users, the don’t work on mobile (we don’t see who read or talk at real time like on desktop).

    I think that’s just CSS set to hide on mobile viewport ?

    Yeah maybe 🙂

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    How to do this

    You should be able to use the (example) CSS provided by @DownPW

    @JAC

    Like said @phenomlab, you can use this CSS code on ACP/APPEARANCE/Custom CSS/LESS :

    a493733e-b36a-44d8-a8c5-cd9a2ca64a32-image.png

    Many thanks to both 😁

    Must try this tomorrow 👍🏻

    Would there be any reason why the colour shows differently in the nav bar and card slider?

    Screenshot 2022-01-14 at 12-18-44 Stockport County FC Fans Forum.png

    Obviously needs a lot of work with the link colours etc.

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @downpw said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @downpw said in NodeBB customisation:

    Hmm if you talk about nodebb-plugin-browsing-users, the don’t work on mobile (we don’t see who read or talk at real time like on desktop).

    I think that’s just CSS set to hide on mobile viewport ?

    Yeah maybe 🙂

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    How to do this

    You should be able to use the (example) CSS provided by @DownPW

    @JAC

    Like said @phenomlab, you can use this CSS code on ACP/APPEARANCE/Custom CSS/LESS :

    a493733e-b36a-44d8-a8c5-cd9a2ca64a32-image.png

    Many thanks to both 😁

    Must try this tomorrow 👍🏻

    Would there be any reason why the colour shows differently in the nav bar and card slider?

    Screenshot 2022-01-14 at 12-18-44 Stockport County FC Fans Forum.png

    Obviously needs a lot of work with the link colours etc.

    wrote on last edited by

    @jac Yes, because they are links that sit inside another DIV, so they will auto inherit from the a href CSS. You can override that with this (as an example - choose the colour you prefer)

    .recent-card-body a {
        color: #ffffff;
    }
    
  • @jac Yes, because they are links that sit inside another DIV, so they will auto inherit from the a href CSS. You can override that with this (as an example - choose the colour you prefer)

    .recent-card-body a {
        color: #ffffff;
    }
    
    wrote on last edited by

    @phenomlab Thanks Mark for the fast response.

    Unfortunately the above change only changes the title colour?

    Screenshot 2022-01-14 at 12-23-57 Stockport County FC Fans Forum.png

  • wrote on last edited by DownPW

    or just

    a {
        color: #YOURCOLOR;
        text-decoration: none;
    }
    

    but this code change other things like title of topic or a hlink for example.

    It all depends on what you want to get but the phenomlab method is better

    For the difference of color you must use the same color code than the navbar

    Here a good link for color code I use: https://htmlcolorcodes.com

  • or just

    a {
        color: #YOURCOLOR;
        text-decoration: none;
    }
    

    but this code change other things like title of topic or a hlink for example.

    It all depends on what you want to get but the phenomlab method is better

    For the difference of color you must use the same color code than the navbar

    Here a good link for color code I use: https://htmlcolorcodes.com

    wrote on last edited by

    @downpw Exactly - this is a bit more specific

    .footer .pull-right span, .recent-cards .recent-card-container .recent-card .footer .category-item a  {
        color: #ffffff !important;
    }
    
  • or just

    a {
        color: #YOURCOLOR;
        text-decoration: none;
    }
    

    but this code change other things like title of topic or a hlink for example.

    It all depends on what you want to get but the phenomlab method is better

    For the difference of color you must use the same color code than the navbar

    Here a good link for color code I use: https://htmlcolorcodes.com

    wrote on last edited by

    @downpw said in NodeBB customisation:

    Here a good link for color code

    One of my favourites along with this beauty
    https://coolors.co/4381c1-bdadea-bea2c2-a37871-4e4b5c

  • @downpw said in NodeBB customisation:

    Here a good link for color code

    One of my favourites along with this beauty
    https://coolors.co/4381c1-bdadea-bea2c2-a37871-4e4b5c

    wrote on last edited by

    @phenomlab

    Oh yeah he looks like very good 😉

  • @phenomlab

    Oh yeah he looks like very good 😉

    wrote on last edited by

    @downpw @phenomlab thanks all.

    if you go to link you’ll see I now have sorted most of it, although I am still unable to match the nav bar colour to the hover cards colour despite this being the same colour hex. Am I doing something wrong? 😛

  • JAC JAC

    @downpw @phenomlab thanks all.

    if you go to link you’ll see I now have sorted most of it, although I am still unable to match the nav bar colour to the hover cards colour despite this being the same colour hex. Am I doing something wrong? 😛

    wrote on last edited by

    @jac When you say navbar are you referring to this ?

    331f52bc-5aff-4d3b-9891-45504ee066e8-image.png

  • @jac When you say navbar are you referring to this ?

    331f52bc-5aff-4d3b-9891-45504ee066e8-image.png

    wrote on last edited by

    @phenomlab Sorry, yes mate 🙂

  • JAC JAC

    @phenomlab Sorry, yes mate 🙂

    wrote on last edited by

    @jac Find this value which is already set in your custom CSS

    .navbar-default {
        background-color: #194F90;
    }
    

    And change background-color to your preference.

  • @jac Find this value which is already set in your custom CSS

    .navbar-default {
        background-color: #194F90;
    }
    

    And change background-color to your preference.

    wrote on last edited by

    @phenomlab Thanks, will try that now.

  • @jac Find this value which is already set in your custom CSS

    .navbar-default {
        background-color: #194F90;
    }
    

    And change background-color to your preference.

    wrote on last edited by JAC

    @phenomlab said in NodeBB customisation:

    #194F90

    The nav bar is fine mate, it’s the cards I wish to change mate. Having a nightmate too with the reading progress meter change too. I’ve followed all instructions but can’t get it to show.

    Going back to the cards although I’ve chosen the same colour as the nav bar the colours simply don’t match.

    Screenshot 2022-01-14 at 13-14-18 Stockport County FC Fans Forum.png

    Apologies in advance mate I don’t want this to become an issue where you get annoyed 😛 🙂

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    #194F90

    The nav bar is fine mate, it’s the cards I wish to change mate. Having a nightmate too with the reading progress meter change too. I’ve followed all instructions but can’t get it to show.

    Going back to the cards although I’ve chosen the same colour as the nav bar the colours simply don’t match.

    Screenshot 2022-01-14 at 13-14-18 Stockport County FC Fans Forum.png

    Apologies in advance mate I don’t want this to become an issue where you get annoyed 😛 🙂

    wrote on last edited by

    @jac Ok. First things first, locate block

    .recent-cards .recent-card-container .recent-card
    

    And set line

    opacity: 0.8;
    

    To

    opacity: 1;
    

    Let me know if that solves the background issue with the cards ?

  • @jac Ok. First things first, locate block

    .recent-cards .recent-card-container .recent-card
    

    And set line

    opacity: 0.8;
    

    To

    opacity: 1;
    

    Let me know if that solves the background issue with the cards ?

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Ok. First things first, locate block

    .recent-cards .recent-card-container .recent-card
    

    And set line

    opacity: 0.8;
    

    To

    opacity: 1;
    

    Let me know if that solves the background issue with the cards ?

    Fantastic, that’s worked 🙂 many thanks!

  • wrote on last edited by phenomlab

    @JAC your custom header is inactive from what I can see

    5b082501-41da-492d-accc-42aad4b491c5-image.png

    I’ve enabled it. Still not working as expected though, so checking now

  • @JAC your custom header is inactive from what I can see

    5b082501-41da-492d-accc-42aad4b491c5-image.png

    I’ve enabled it. Still not working as expected though, so checking now

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @JAC your custom header is inactive from what I can see

    5b082501-41da-492d-accc-42aad4b491c5-image.png

    I’ve enabled it. Still not working as expected though, so checking now

    Thank you Mark.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @JAC your custom header is inactive from what I can see

    5b082501-41da-492d-accc-42aad4b491c5-image.png

    I’ve enabled it. Still not working as expected though, so checking now

    Thank you Mark.

    wrote on last edited by

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @JAC your custom header is inactive from what I can see

    5b082501-41da-492d-accc-42aad4b491c5-image.png

    I’ve enabled it. Still not working as expected though, so checking now

    Thank you Mark.

    Just updating laptop…

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @JAC your custom header is inactive from what I can see

    5b082501-41da-492d-accc-42aad4b491c5-image.png

    I’ve enabled it. Still not working as expected though, so checking now

    Thank you Mark.

    wrote on last edited by

    @jac Fixed. You had both the background and the bar set to the same colour 🙂

  • @jac Fixed. You had both the background and the bar set to the same colour 🙂

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Fixed. You had both the background and the bar set to the same colour 🙂

    Fantastic mate, thank you very much! 😄 🙂


Related Topics
  • Whitespace fixes in Nodebb

    Solved Customisation nodebb
    18
    2
    7 Votes
    18 Posts
    6k Views
    phenomlab
    @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.
  • nodebb-user-level customisation : popover element

    Solved Customisation css user level plugin custom
    15
    6 Votes
    15 Posts
    5k Views
    DownPW
    No no, I said that in the sense that he told me it was simple ^^ I was able to see that this was not the case by targeting the elements he had advised me.
  • who is read NodeBB

    Customisation read post nodebb
    6
    0 Votes
    6 Posts
    3k Views
    phenomlab
    @cagatay You should ask in the NodeBB forums. Perhaps reference this post https://discuss.flarum.org/d/23066-who-read
  • NodeBB inline videoplayer

    Solved Customisation nodebb
    12
    3 Votes
    12 Posts
    5k Views
    Panda
    @phenomlab YAY! It works Thanks so much
  • [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 Footer

    Solved Customisation footer nodebb
    10
    1 Votes
    10 Posts
    4k Views
    JAC
    @phenomlab said in NodeBB Footer: @jac and you. Hope all is well and you recover quickly Thanks pal
  • NodeBB Discord Plugins

    Unsolved Customisation nodebb discord plugin
    7
    0 Votes
    7 Posts
    4k Views
    phenomlab
    @RiekMedia hi. Just following up on this thread (I know it’s old) but was curious to understand if it’s still an issue or not ?
  • 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