Skip to content
  • Custom button placement on bottombar on smartphones

    Solved Technical Support
    5
    0 Votes
    5 Posts
    473 Views
    DownPWD
    While waiting for version 3.5.0 which will add the new containers, we have solved the problem like this (with the help of @phenomlab ) if ($(window).width() <= 991) { // Check if the custom thread view button already exists in the bottom bar //$buttonContainer = $('.bottombar-nav.p-2.text-dark.bg-light.d-flex.justify-content-between.align-items-center.w-100'); if ($("#logged-in-menu").length > 0) { var buttonContainer = $('.bottombar-nav ul#logged-in-menu'); } else { var buttonContainer = $('.bottombar-nav ul#logged-out-menu'); } // Prepend the button to the selected container buttonContainer.prepend(threadViewButton); }
  • Threaded views?

    General Discussion
    14
    3 Votes
    14 Posts
    1k Views
    phenomlabP
    @julian Exactly. It's just not feasible and would cause significant strain even with lazy loading. It's why I've opted for 2nd best, which is the "cosmetic" route meaning certain posts (for example, your own, and topic-owner) stand out.
  • How to Hide the Navigator?

    Moved Technical Support
    2
    0 Votes
    2 Posts
    389 Views
    B
    Via custom CSS you can do this .page-topic .pagination-block { display: none !important; } In a theme you can change navigator.tpl and remove d-lg-block https://github.com/NodeBB/nodebb-theme-harmony/blob/73b6431f56990778a81e6948cc1e33d5458ddc14/templates/partials/topic/navigator.tpl#L1
  • 0 Votes
    5 Posts
    1k Views
    dogsD
    @baris Thank you very much. This worked! €: I additionally use the hook $(window).on('action:ajaxify.start', function (ev, data) { $('div.topic-header-image').hide(); }); so that the header container with the image is hiding immediatly and before ajaxify.end
  • 0 Votes
    3 Posts
    594 Views
    omegaO
    @baris Oh my! Awesome!
  • 0 Votes
    3 Posts
    997 Views
    M
    @yariplus said in Remove postbar bottom topic (or making better but remove is also good): Your negative margin pushes the bar into the content above. Apply it only to the first bar. ul .post-bar { background-color: #1d1f21; margin-left: -10px; margin-top: -20px; margin-right: -10px; } Thank you sir, you are awesome Now it looks perfect [image: BoAs2NI.png]
  • 4 Votes
    1 Posts
    1k Views
    julianJ
    As part of the creation of the Tenor GIF plugin, I needed to add a button to the composer toolbar: [image: 7jB0izT.png] Normally, this is fairly straightforward. filter:composer.formatting is called, and caught with this listener: plugin.registerFormatting = function (payload, callback) { payload.options.push({ name: 'gif', className: 'fa fa-tenor-gif', title: 'Insert GIF' }); callback(null, payload); }; The className denotes a class name (of course), and if you use fa and and corresponding fa-* class, you can select from hundreds of possible icons. Unfortunately for me, there was no "gif" icon, nor one for Tenor GIF. So I had to set out to make my own. To do this, you'll see that above, I set the class fa-tenor-gif. This maps to nothing, since the icon doesn't exist. However, it does provide a nice easy way to find and style the button itself. Then in my stylesheet, I simply added this styling to create my button via CSS pseudo-elements: .fa-tenor-gif::before { content: 'GIF'; font-size: 1rem; font-family: sans; background: #333; color: #fff; padding: 0.25rem 0.5rem; border-radius: 0.5em; position: relative; top: -0.2rem; } I wanted to go for a "badge-like" icon, since the text "GIF" fairly easily indicates what its purpose is for, hence the dark background, light text, and slight border radius. If you wanted to do something else, like replace the icon with a picture of your own, then you might want to look into using background-image, but that is outside of the scope of this tutorial
  • Style.less in nodebb-plugin-quickstart plugin

    NodeBB Plugins
    3
    0 Votes
    3 Posts
    2k Views
    T
    Hello @pichalite Yes, I did. I noticed quickstart plugin was not compatible to my version of BB. Do you think this is the problem? Thanks 11/4 03:10:30 [742] - warn: [plugins/load] The following plugins may not be compatible with your version of NodeBB. This may cause unintended behaviour or crashing. In the event of an unresponsive NodeBB caused by this plugin, run `./nodebb reset -p PLUGINNAME` to disable it. * nodebb-plugin-trophies * nodebb-plugin-quickstart
  • Remove Reputation Display in Profiles

    General Discussion
    3
    0 Votes
    3 Posts
    2k Views
    yariplusY
    @Joenel-de-Asis172 That is actually the best way to do it. The other way would be to remove that html from the profile template in your theme. However, unless you are making your own custom theme, your changes may get overwritten when the theme updates. So CSS is the way to go.
  • How to change black background on code blocks?

    Moved Technical Support
    3
    0 Votes
    3 Posts
    4k Views
    H
    @baris Cool, didn't know that settings section existed!
  • Markdown & tables

    Feature Requests
    4
    2 Votes
    4 Posts
    7k Views
    P
    This topic totally went under the radar (next time file issues on GH ) Updated the markdown plugin as per @yariplus' suggestion and they look good now (see @pier's OP). Necroing this because this is the first thread on Google when searching for NodeBB table markdown syntax.
  • Here's a helpful CSS cheatsheet!

    Moved Technical Support
    3
    9 Votes
    3 Posts
    3k Views
    T
    @julian Believe it or not, but I've never went there before for CSS reference, but I'll read up on it further here since of course they are the "authority" in web standards.
  • Modifying styles in /public/templates? Don't.

    General Discussion
    2
    4 Votes
    2 Posts
    3k Views
    T
    @julian Thanks for the response
  • Can't find CSS images?

    NodeBB Development
    12
    0 Votes
    12 Posts
    8k Views
    S
    @julian I'm trying in the same way like you mentioned. created: static/images in node_modules/nodebb-theme-persona in plugin.json i have added the below line "acpScripts": [ "lib/admin.js" ], "staticDirs": { "images": "./static/images" } and in the header file i'm trying to get the image like below <img src="/plugins/nodebb-theme-persona/images/logoWithText.png" /> but this is not working. Please suggest what am i doing wrong