Skip to content
Sudonix

Custom badges

Solved Customisation
103 4 31.6k 2
Log in to reply

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
  • crazycellsundefined

    using exclusive nodebb forum data to create a chatgpt chatbot?

    Discussion nodebb chatgpt chat
    7
    4 Votes
    7 Posts
    2k Views
    crazycellsundefined
    @phenomlab oh no, that is 1 cent on the video, but you are right, symbols are similar… I just converted it to $1 , since it is more intuitive in daily life…
  • DownPWundefined

    nodebb-plugin-custom-pages

    Solved Customisation plugin custom-pages
    5
    2
    3 Votes
    5 Posts
    4k Views
    phenomlabundefined
    @DownPW it’s possible, yes, but you may inadvertently end up targeting other elements using the same class which of course isn’t desired. Can you provide a link in DM for me to review?
  • Pandaundefined

    Sidebar Widget is no longer on the side!

    Moved Solved General nodebb
    4
    2
    2 Votes
    4 Posts
    981 Views
    phenomlabundefined
    @Panda said in Sidebar Widget is no longer on the side!: Ah, so sidebar wont work on mobile? Correct. If you review the docs on bootstrap, you’ll notice that it is designed on a grid system https://getbootstrap.com/docs/5.0/layout/grid/ What I mean by changing the category is moving it on here to general as you posted it in bugs, when it isn’t.
  • Pandaundefined

    Where are widgets stored?

    Solved Configure nodebb
    3
    1 Votes
    3 Posts
    958 Views
    Pandaundefined
    @phenomlab Thanks, have DMed you
  • Pandaundefined

    Email validation NodeBB

    Bugs nodebb
    21
    3 Votes
    21 Posts
    6k Views
    phenomlabundefined
    @Panda said in Email validation NodeBB: Did you configure that as a custom change to the usual quote icon. How do you do that? I notice on NodeBB site its a solid blue quotes Yes, I changed it. NodeBB by default users the free font awesome library whereas I use the pro (paid) version SDK have access to a wider set of icons, and at different thicknesses etc. The change of colour is just simple CSS.
  • cagatayundefined

    How to fix header side as boxed

    Solved Customisation header boxed sudonix nodebb
    10
    1
    6 Votes
    10 Posts
    2k Views
    cagatayundefined
    @phenomlab yes it caused a problem for mobile users. thank you for helping …
  • DownPWundefined

    [NODEBB] Help for my custom CSS

    Solved Customisation nodebb css bugfix
    237
    49 Votes
    237 Posts
    98k Views
    DownPWundefined
    @baris said: You should change your selectors so it doesn’t look at the entire document. You probably only want to apply fancybox to stuff inside the #content element which is what changes when the user navigates around the page. So use $('#content a').... for your selectors then the forum logo in the header won’t be selected. I modified the JS Fancybox code now and this code and it seem better // --------------------------------------------- // Fancybox Media Reader (Without Website Logo) // --------------------------------------------- if (top.location.pathname !== '/login') { $(window).on('action:posts.loaded', function(data) { console.log("Polling DOM for lazyLoaded images to apply Fancybox"); $(document).ready(function() { $('#content a').not('.forum-logo').not(".avatar").not(".emoji").not(".bmac-noanimate").each(function() { $('#content a[href*=".jpg"], #content a[href*=".jpeg"], #content a[href*=".png"], #content a[href*=".gif"], #content a[href*=".webp"]').addClass("noanimate"); }); }); }); } if (top.location.pathname !== '/login') { $(document).ready(function() { $(window).on('action:ajaxify.end', function(data) { $('#content a').not('.logo').not(".avatar").not(".emoji").not(".bmac-noanimate").each(function() { $('#content a[href*=".jpg"], #content a[href*=".jpeg"], #content a[href*=".png"], #content a[href*=".gif"], #content a[href*=".webp"]').addClass("noanimate"); data.preventDefault() // Strip out the images contained inside blockquotes as this looks nasty :) $('#content blockquote img').remove(); }); Fancybox.bind( '#content a[href*=".jpg"], #content a[href*=".jpeg"], #content a[href*=".png"], #content a[href*=".gif"], #content a[href*=".webp"]', { groupAll: true, } ); }); }); } // Chat fancybox - fires when chat module loaded and AJAX calls new chat $(document).ready(function() { $(window).on('action:chat.loaded', function(data) { // >>> Se limiter au contenu principal uniquement <<< $('#content img').not('.forum-logo').not(".avatar").not(".emoji").not(".bmac-noanimate").each(function() { var newHref = $(this).attr("src"); $(this).wrap("<a class='fancybox' href='" + newHref + "'/>"); $('#content a[href*=".jpg"], #content a[href*=".jpeg"], #content a[href*=".png"], #content a[href*=".gif"], #content a[href*=".webp"]').addClass("noanimate"); data.preventDefault(); // Strip out the images contained inside blockquotes as this looks nasty :) $('#content blockquote img').remove(); }); Fancybox.bind( '#content a[href*=".jpg"], #content a[href*=".jpeg"], #content a[href*=".png"], #content a[href*=".gif"], #content a[href*=".webp"]', { groupAll: true, } ); }); }); For the logo, I must use overflow: visible !important; on [component="brand/logo"] /* --- Logo --- */ [component="brand/logo"] { max-height: 50px; width: auto; height: auto; max-width: 100%; display: block; object-fit: contain; object-position: left center; overflow: visible !important; } Better result !!
  • crazycellsundefined

    [NodeBB] First post customization

    Solved Customisation nodebb
    5
    4 Votes
    5 Posts
    2k Views
    crazycellsundefined
    @phenomlab thanks