Skip to content

Composer options on nodebb

Solved Configure
8 2 2.1k 1
  • I have made posts on the nodebb forum about this, but have additional question here.
    The composer screen (to make posts) is a weak spot for NodeBB, horrible array of icons which confuse new users. Picture upload is particularly confusing.
    Is the icon list bar configurable? in settings I only see this option

    Screenshot_20230615_102942_Chrome~2.jpg

    What option does this even do? What is it meaning by route?

  • I have made posts on the nodebb forum about this, but have additional question here.
    The composer screen (to make posts) is a weak spot for NodeBB, horrible array of icons which confuse new users. Picture upload is particularly confusing.
    Is the icon list bar configurable? in settings I only see this option

    Screenshot_20230615_102942_Chrome~2.jpg

    What option does this even do? What is it meaning by route?

    @Panda said in Composer options on nodebb:

    The composer screen (to make posts) is a weak spot for NodeBB, horrible array of icons which confuse new users. Picture upload is particularly confusing.
    Is the icon list bar configurable?

    I think it is, but you need a function or a plugin to change it. What most people do is target the buttons they do not not need or want in CSS and hide them. I agree with the picture upload - there are two actually - one for pictures themselves which is obvious, and one for files.

    in settings I only see this option

    All this setting does is allow the composer to start in a new window independently and not part of the current form.

  • @Panda said in Composer options on nodebb:

    The composer screen (to make posts) is a weak spot for NodeBB, horrible array of icons which confuse new users. Picture upload is particularly confusing.
    Is the icon list bar configurable?

    I think it is, but you need a function or a plugin to change it. What most people do is target the buttons they do not not need or want in CSS and hide them. I agree with the picture upload - there are two actually - one for pictures themselves which is obvious, and one for files.

    in settings I only see this option

    All this setting does is allow the composer to start in a new window independently and not part of the current form.

    @phenomlab there are 3 icons actually that can be confused for upload image, the first is upload pic by url. This confuses people as it uses the conventional pic icon that people associate with uploading an image.
    So how using CSS (uggghh) can I stop that one showing in the composer iconbar?

  • @phenomlab there are 3 icons actually that can be confused for upload image, the first is upload pic by url. This confuses people as it uses the conventional pic icon that people associate with uploading an image.
    So how using CSS (uggghh) can I stop that one showing in the composer iconbar?

  • @phenomlab
    Ok thanks, so I assume I add something like this to custom css

    /* removing buttons from composer */
    .composer .formatting-bar .formatting-group li[data-format="????"] {
      display: none;
    }
    

    How can i find out what ??? = for url pic, if thats one I want to disable ?
    Where are these icon names defined

  • @phenomlab
    Ok thanks, so I assume I add something like this to custom css

    /* removing buttons from composer */
    .composer .formatting-bar .formatting-group li[data-format="????"] {
      display: none;
    }
    

    How can i find out what ??? = for url pic, if thats one I want to disable ?
    Where are these icon names defined

    @Panda Here you go

    6e2191b0-c777-459a-82e8-cf14840c7f9c-image.png

  • Pandaundefined Panda has marked this topic as solved on
  • Back with another question, as although you gave me the list, I cant workout which ids are:
    orangle circled (for thumbnail)
    Purple circled (dont know what)
    IMG_20230615_143459_129.jpg

    Im trying to get as many removed so that pic upload appears without needing to scroll!

  • Back with another question, as although you gave me the list, I cant workout which ids are:
    orangle circled (for thumbnail)
    Purple circled (dont know what)
    IMG_20230615_143459_129.jpg

    Im trying to get as many removed so that pic upload appears without needing to scroll!

    @Panda You should be able to expose the CSS for these using F12 to get into console

    3591518c-e3a3-4ada-a43c-6b32a5e0359c-image.png

    a2b8ed46-4157-4ff2-85f0-576543380107-image.png

    That should then expose the element once selected

    89d9c545-a47a-40d1-98f4-80cf3b958e8f-image.png

    Here’s the below CSS you need based on the screenshot provided.

    .composer .formatting-bar .formatting-group li[data-format="picture-o"], .composer .formatting-bar .formatting-group li[data-format="spoiler"] {
        display: none;
    }
    

Did this solution help you?
Did you find the suggested solution useful? Support 💗 Sudonix with a coffee
If your organisation needs deeper expertise around infrastructure, security, or technology leadership, learn more about Phenomlab Ltd. Many of the deeper technical guides behind Sudonix are published there.

Related Topics
  • Opening links in nodebb widget

    Solved Configure nodebb
    6
    4 Votes
    6 Posts
    3k Views
    A more efficient way of including this would be to not over complicate it and leverage a standard iframe (providing the CSP headers of the remote site permit this) like below <iframe src="https://www.classmarker.com/online-test/start/?quiz=gag66aea7922f0a5" width="700" height="800"></iframe> This works first time every time on your site as intended.
  • NodeBB upgrade now cant post

    Solved Bugs nodebb
    5
    2 Votes
    5 Posts
    2k Views
    @Panda yes, for some reason, that is the case. If you need an urgent response, it’s probably better to post here because of the time difference.
  • NodeBB: hCaptcha

    Solved Configure hcaptcha
    15
    2 Votes
    15 Posts
    3k Views
    @mventures none that I know of. I don’t recall selecting these either for mine.
  • NodeBB: Favicon upload issue

    Solved Configure nodebb favicon
    12
    1
    3 Votes
    12 Posts
    3k Views
    @phenomlab I am on a Mac, so I used the “Option + Command + I”, and then performed the steps. It loaded my favicon! I checked on Firefox which I haven’t used before, and it showed my favicon also! That’s fantastic and thank you for the help!
  • NodeBB: The global Search option

    Solved Configure search nodebb
    5
    0 Votes
    5 Posts
    1k Views
    @mventures Yes, exactly. The other icon will restart NodeBB whilst the first icon I referenced will rebuild (recompile) it. The huge strength of NodeBB over Flarum (for example) is that the code is precompiled, and called once at boot. PHP’s code has to repeatedly reload code from source making it much slower.
  • NodeBB: Privileges for the Announcement channel

    Solved Configure nodebb
    6
    1
    1 Votes
    6 Posts
    2k Views
    Up to you really
  • nodebb loading emojis

    Solved Configure nodebb emojis
    16
    1
    1 Votes
    16 Posts
    4k Views
    @DownPW sure. Let me have a look at this in more detail. I know nginx plus has extensive support for this, but it’s not impossible to get somewhere near acceptable with the standard version. You might be better off handling this at the Cloudflare level given that it sits in between the requesting client and your server.
  • 0 Votes
    9 Posts
    3k Views
    @downpw I’m inclined to agree with this. There isn’t much else you can do, and provided it works with no odd looking artefacts in other browsers, then ok. The :before and :after are pseudo classes and very well supported across all browsers (except perhaps Internet Exploder, but who uses that these days ?)