Template fixes for Bootswatch themes

NodeBB Development

Suggested Topics

  • 0 Votes
    1 Posts

    Made a child theme based on Persona for some edits. Instead of publishing it to npm symlinked it, theme folder being outside public_html( where nodebb install resides). How can I load a js file to use with it? If I put ./nodebb-theme-mytheme/lib/script.js" inside plugins.json doesn't work.

  • 1 Votes
    1 Posts

    I need a little guidance here. I run a self-hosted NodeBB forum with the default Persona theme and no skin. I would like to switch to the Flatly skin, because its style closely resembles the main site (which is a wordpress thing). But unfortunately when I switch to Flatly some elements become invisible.

    For example the header in the chat window looks like this, when no skin is selected:

    But it looks like this when the Flatly skin is selected:

    The button glyphs are there, but they are hard to find because their foreground color is the same as the background color.
    Similarly when I watch the forum on my smartphone I cannot see the (black) Chat glyph on the black header background, so it seems like the chat feature is missing.

    So, I guess I should override or subclass or modify the Flatly skin somehow, or at least some parts of it. And while I am at it I may also change some colors, slightly.

    But I have no clue where the resources are that I need to edit. So my question is: where in the nodebb directories are the Flatly skin files, and how should I proceed in a way that my modifications don't get lost after a nodebb upgrade?


  • 0 Votes
    16 Posts

    Finally it worked. Thank you very much. Just two points:

    a. Ajaxing ends up with this URL:

    I mean the internal details are visible to the user. An ideal solution is to reset the URL to something like this: localhost:4567/map

    b. Suppose I cold load with an invalid URL:

    it still renders the map page. Ideally, it should display the "Page Not found message"

    Any solution to these two? Or, shall I consider them as "OK let it behave so!"?

  • 0 Votes
    1 Posts

    Greetings, I am trying to directly modify some files in the persona theme to include the slick carousel slider as a header. I've added it as an inline script in header.tpl and also changed my requirejs-config accordingly:

    require.config({ baseUrl: "{relative_path}/src/modules", waitSeconds: 3, urlArgs: "{config.cache-buster}", paths: { 'jquery': '../../vendor/jquery/js/jquery', 'forum': '../client', 'admin': '../admin', 'vendor': '../../vendor', 'mousetrap': '../../bower/mousetrap/mousetrap', 'slick': 'http://cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min' }, shim: { 'slick' : ['jquery'] } });

    I find that the slider and site is working fine only on a fresh page load/reload. On a click of any button to navigate, the slider breaks and i get these errors:

    Uncaught TypeError: $(...).timeago is not a function
    Uncaught TypeError: $(...).tooltip is not a function
    Uncaught TypeError: widgetAreas.find(...).timeago is not a function

    Probably suggesting that jQuery was loaded more than once. I'm inclined to think that this has got something to do with how I've changed the requirejs above. However leaving out the above change will lead to:

    Uncaught TypeError: Cannot read property 'fn' of undefined in slick.min.js

    Possibly suggesting the jQuery wasn't loaded?

    I've also looked and followed the tips here but nothing seems to work. I just feel that I'm really close to getting it done.

  • 0 Votes
    1 Posts

    Now I have to change theme's tempalte, can I just config it in plugin?