Skip to content

NodeBB customisation

Locked Customisation
332 4 274.2k 1
  • JAC JAC

    Is there any way to remove the footer code?

    Screenshot 2021-09-12 at 13-32-11 phenomlab.png

    wrote on last edited by
    #21

    @jac Yep. Go into the ACP->Widgets, and you’ll see it under the footer in “Global”

    1e6ad998-4e5e-4b6a-80c3-d214acaeead2-image.png

    See the “x” on the global footer HTML widget ? Delete that, and confirm, then it’ll disappear.

  • JAC JAC

    change Nav hover colour to #FFC557

    Screenshot 2021-09-12 at 13-34-08 phenomlab.png

    wrote on last edited by
    #22

    @jac said in NodeBB customisation:

    change Nav hover colour to #FFC557

    .navbar-default .navbar-brand, .navbar-default .navbar-nav>li>a:hover {
        color: #FFC557;
    }
    
  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I do have a few changes I have in mind to be made, but am aware of posting them all at once ;).

    You can post them all at once, no issues. You might want to create screenshots and identify the areas that you’d like changed. I have your site URL so it won’t be too tough to accomplish

    Thanks 🙂

    wrote on last edited by
    #23

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I do have a few changes I have in mind to be made, but am aware of posting them all at once ;).

    You can post them all at once, no issues. You might want to create screenshots and identify the areas that you’d like changed. I have your site URL so it won’t be too tough to accomplish

    Thanks 🙂

    I can confirm this has indeed work 🙂 thank you very much1 🙂

  • @jac said in NodeBB customisation:

    change Nav hover colour to #FFC557

    .navbar-default .navbar-brand, .navbar-default .navbar-nav>li>a:hover {
        color: #FFC557;
    }
    
    wrote on last edited by JAC
    #24

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    change Nav hover colour to #FFC557

    .navbar-default .navbar-brand, .navbar-default .navbar-nav>li>a:hover {
        color: #FFC557;
    }
    

    Is there any way to change the tag colours in the post?

    Screenshot 2021-09-12 at 12-03-52 Simon Rusk Post-Match Interview - County 0-3 Yeovil.png

    with white writing and a blue background (#255A9F)

    something I’m looking to do with the quotes block, admittedly like you have done yourself (it looks very smart indeed 😉 )

  • JAC JAC

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I do have a few changes I have in mind to be made, but am aware of posting them all at once ;).

    You can post them all at once, no issues. You might want to create screenshots and identify the areas that you’d like changed. I have your site URL so it won’t be too tough to accomplish

    Thanks 🙂

    I can confirm this has indeed work 🙂 thank you very much1 🙂

    wrote on last edited by
    #25

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I do have a few changes I have in mind to be made, but am aware of posting them all at once ;).

    You can post them all at once, no issues. You might want to create screenshots and identify the areas that you’d like changed. I have your site URL so it won’t be too tough to accomplish

    Thanks 🙂

    I can confirm this has indeed work 🙂 thank you very much1 🙂

    Has the mobile view nav font changed to white? Would you mind checking, using two browsers one is definitely grey and one looks a little lighter but it’s hard to tell.

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I do have a few changes I have in mind to be made, but am aware of posting them all at once ;).

    You can post them all at once, no issues. You might want to create screenshots and identify the areas that you’d like changed. I have your site URL so it won’t be too tough to accomplish

    Thanks 🙂

    I can confirm this has indeed work 🙂 thank you very much1 🙂

    Has the mobile view nav font changed to white? Would you mind checking, using two browsers one is definitely grey and one looks a little lighter but it’s hard to tell.

    wrote on last edited by phenomlab
    #26

    @jac No, it hasn’t. You’ll need this

    .navbar-default .navbar-toggle {
        color: #ffffff;
    }
    
  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    change Nav hover colour to #FFC557

    .navbar-default .navbar-brand, .navbar-default .navbar-nav>li>a:hover {
        color: #FFC557;
    }
    

    Is there any way to change the tag colours in the post?

    Screenshot 2021-09-12 at 12-03-52 Simon Rusk Post-Match Interview - County 0-3 Yeovil.png

    with white writing and a blue background (#255A9F)

    something I’m looking to do with the quotes block, admittedly like you have done yourself (it looks very smart indeed 😉 )

    wrote on last edited by
    #27

    @jac said in NodeBB customisation:

    with white writing and a blue background (#255A9F)

    You’ll need this

    .tag-list .tag {
        background: #255A9F;
        color: #ffffff;
    }
    
  • @jac No, it hasn’t. You’ll need this

    .navbar-default .navbar-toggle {
        color: #ffffff;
    }
    
    wrote on last edited by
    #28

    @phenomlab said in NodeBB customisation:

    @jac No, it hasn’t. You’ll need this

    .navbar-default .navbar-toggle {
        color: #ffffff;
    }
    

    Many thanks mate that has worked 😁

  • @jac said in NodeBB customisation:

    with white writing and a blue background (#255A9F)

    You’ll need this

    .tag-list .tag {
        background: #255A9F;
        color: #ffffff;
    }
    
    wrote on last edited by
    #29

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    with white writing and a blue background (#255A9F)

    You’ll need this

    .tag-list .tag {
        background: #255A9F;
        color: #ffffff;
    }
    

    Have applied this too but unsure if it’s working as I can’t see it on mobile view.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    with white writing and a blue background (#255A9F)

    You’ll need this

    .tag-list .tag {
        background: #255A9F;
        color: #ffffff;
    }
    

    Have applied this too but unsure if it’s working as I can’t see it on mobile view.

    wrote on last edited by
    #30

    @jac Here’s the desktop view

    99ef6f3a-48cf-49d7-8308-0255eaee2e29-image.png

  • @jac Here’s the desktop view

    99ef6f3a-48cf-49d7-8308-0255eaee2e29-image.png

    wrote on last edited by
    #31

    @phenomlab said in NodeBB customisation:

    @jac Here’s the desktop view

    99ef6f3a-48cf-49d7-8308-0255eaee2e29-image.png

    Looks great thanks!

    Is there any way to show tags on mobile post instead of this…

    IMG_20210913_182348.jpg

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Here’s the desktop view

    99ef6f3a-48cf-49d7-8308-0255eaee2e29-image.png

    Looks great thanks!

    Is there any way to show tags on mobile post instead of this…

    IMG_20210913_182348.jpg

    wrote on last edited by
    #32

    @jac Not sure what you mean ?

  • @jac Not sure what you mean ?

    wrote on last edited by
    #33

    @phenomlab said in NodeBB customisation:

    @jac Not sure what you mean ?

    How come the tags don’t show on mobile view?

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Not sure what you mean ?

    How come the tags don’t show on mobile view?

    wrote on last edited by
    #34

    @jac They are hidden by default because of the lack of screen estate.

  • @jac They are hidden by default because of the lack of screen estate.

    wrote on last edited by
    #35

    @phenomlab I understand 🙂 that’s fine 😛

  • JAC JAC

    @phenomlab I understand 🙂 that’s fine 😛

    wrote on last edited by phenomlab
    #36

    @jac they could be displayed, but would need refactoring to ensure the layout and experience remain intact.

  • @jac they could be displayed, but would need refactoring to ensure the layout and experience remain intact.

    wrote on last edited by
    #37

    @phenomlab thanks, something like that could work yes, I just don’t like it looking plain, that’s why I’m trying to make little changes here and there, thanks as always for the assistance 😄

  • JAC JAC

    @phenomlab thanks, something like that could work yes, I just don’t like it looking plain, that’s why I’m trying to make little changes here and there, thanks as always for the assistance 😄

    wrote on last edited by
    #38

    @jac I think my only concern here is the size and placement. If it’s too crammed, that detracts from the user experience and removes the focus away from the actual content.

  • @jac I think my only concern here is the size and placement. If it’s too crammed, that detracts from the user experience and removes the focus away from the actual content.

    wrote on last edited by
    #39

    @phenomlab said in NodeBB customisation:

    @jac I think my only concern here is the size and placement. If it’s too crammed, that detracts from the user experience and removes the focus away from the actual content.

    Of course yes, I’ll probably just leave it how it is and make other changes such as font etc.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac I think my only concern here is the size and placement. If it’s too crammed, that detracts from the user experience and removes the focus away from the actual content.

    Of course yes, I’ll probably just leave it how it is and make other changes such as font etc.

    wrote on last edited by
    #40

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac I think my only concern here is the size and placement. If it’s too crammed, that detracts from the user experience and removes the focus away from the actual content.

    Of course yes, I’ll probably just leave it how it is and make other changes such as font etc.

    Hi Mark,

    I thought if I made changes bit by bit that may be better…

    How can I get the quotes background in blue with a nice font on? That stands out.

    Many thanks.


Related Topics
  • 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
  • Changing Background on NodeBB

    Solved Customisation background image nodebb
    4
    0 Votes
    4 Posts
    2k Views
    phenomlab
    @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
    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] Scroll Button

    Solved Customisation css javascript html scroll button
    7
    1
    0 Votes
    7 Posts
    3k Views
    phenomlab
    @downpw ooops. Forgot that. Thanks for adding.
  • [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
  • Social icon (Nodebb)

    Solved Customisation nodebb social
    7
    0 Votes
    7 Posts
    3k Views
    JAC
    @phenomlab said in Social icon (Nodebb): @jac I just tested my theory around using the OG image, and according to the Twitter card validator, it works fine [image: 73e805e1-997b-41bf-9259-51c5052ca8fc-image.png] fixed
  • 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 .