Skip to content

[NODEBB] Help for my custom CSS

Solved Customisation
258 5 167.9k 3
  • wrote on last edited by

    how i create those folders. i added ACP/HEADERS the codes but not working.

  • how i create those folders. i added ACP/HEADERS the codes but not working.

    wrote on last edited by DownPW

    @cagatay said:

    how i create those folders. i added ACP/HEADERS the codes but not working.

    Adapt path to your custom installation. I don’t know where is your custom FA Folder nor how you use it

  • wrote on last edited by

    You need to load your Font Awesome CSS files by adjusting this code to the path where you saved them.

    But honestly, I don’t know how you’ve configured your site in this regard.

  • wrote on last edited by

    <meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
    <link href=“/assets/fonts/fonts.min.css?version=1” rel=“stylesheet”>
    <link href=“/assets/customfonts/FontAwesome.Pro.6.x.x/css/all.css” rel=“stylesheet” />
    <link href=“/assets/customfonts/FontAwesome.Pro.6.x.x/css/v4-shims.css” rel=“stylesheet” />
    <link href=“/assets/customfonts/FontAwesome.Pro.6.x.x/css/v4-font-face.css” rel=“stylesheet” />
    <script src=“https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js”></script>
    <link rel=“stylesheet” href=“https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css”/>
    <a id=“pageUp” class=“”><i class=“fas fa-chevron-up”></i></a>
    <div id=“readingposition” class=“reading-meter” style=“bottom: 0px;”>
    <div class=“reading-meter-background rounded-1 border border-gray-300 ready”>
    <div class=“reading-meter-progress-bar rounded-1” id=“progress-bar”>
    </div>
    </div>
    </div>

    what i have now

  • <meta http-equiv=“Content-Type” content=“text/html; charset=utf-8” />
    <link href=“/assets/fonts/fonts.min.css?version=1” rel=“stylesheet”>
    <link href=“/assets/customfonts/FontAwesome.Pro.6.x.x/css/all.css” rel=“stylesheet” />
    <link href=“/assets/customfonts/FontAwesome.Pro.6.x.x/css/v4-shims.css” rel=“stylesheet” />
    <link href=“/assets/customfonts/FontAwesome.Pro.6.x.x/css/v4-font-face.css” rel=“stylesheet” />
    <script src=“https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.umd.js”></script>
    <link rel=“stylesheet” href=“https://cdn.jsdelivr.net/npm/@fancyapps/ui@5.0/dist/fancybox/fancybox.css”/>
    <a id=“pageUp” class=“”><i class=“fas fa-chevron-up”></i></a>
    <div id=“readingposition” class=“reading-meter” style=“bottom: 0px;”>
    <div class=“reading-meter-background rounded-1 border border-gray-300 ready”>
    <div class=“reading-meter-progress-bar rounded-1” id=“progress-bar”>
    </div>
    </div>
    </div>

    what i have now

    wrote on last edited by

    @cagatay if you look in the console (developers console in browser) do you see any error messages being returned?

    Linux is case sensitive, and it’s possible to have the same filename and folder name in upper and lower case.

    I suspect this might be the issue, but I could be wrong.

  • wrote on last edited by

    Mark, the situation is that since I used your CSS files, I don’t even have the Frontawese folder. Because of that, I really need your direct help. I’d really appreciate it if you could take a look whenever you have some free time.

  • wrote on last edited by

    Hi Mark, hope you’re doing well. Are you going to be able to help me with this?

  • Hi Mark, hope you’re doing well. Are you going to be able to help me with this?

    wrote on last edited by phenomlab

    @cagatay Just looking at this now. Do you have a FA Pro 6 license, or are you trying to use the free version? It’s not immediately clear, and the directory structure on your server is a mess to be honest. Not sure what has happened here.

    EDIT - I have it working. DM me.

  • wrote on last edited by

    thank you Mark.

  • wrote on last edited by

    so what is the problem of @cagatay mark @phenomlab ?

  • wrote on last edited by

    i do not know 🙂 Mark resolved.

  • so what is the problem of @cagatay mark @phenomlab ?

    wrote on last edited by

    @DownPW the FA library was missing with no paths defined. I’ve set these in the headers and uploaded the source, including necessary shim files which resolves the issue.

  • wrote on last edited by

    OK
    Likely deleted by mistake from the NodeBB ACP headers.

  • OK
    Likely deleted by mistake from the NodeBB ACP headers.

    wrote on last edited by

    @DownPW Possibly, but the source files were also missing, and @cagatay has a custom theme developed by me.

  • wrote on last edited by

    fa0eee3c-239c-4d9b-b8c9-7fd7d7cbbd7c-image.jpeg

    Hi, the active users are not showing correctly. Instead of the usernames, I’m seeing code. What should I do to fix this?

  • fa0eee3c-239c-4d9b-b8c9-7fd7d7cbbd7c-image.jpeg

    Hi, the active users are not showing correctly. Instead of the usernames, I’m seeing code. What should I do to fix this?

    wrote on last edited by

    @cagatay sorry for late response. This looks too be one of the widgets, and I’m wondering if you have custom code that targets this.

    Had this recently happened after an upgrade or other changes?

  • wrote on last edited by

    mark hi,
    Refused to apply style from ‘https://efelsefe.com/assets/customfonts/FontAwesome-6-Pro/pro/css/v4-font-face.css’ because its MIME type (‘text/plain’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.

    I keep getting this error.


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
  • Custom Page - nodebb

    Solved Customisation custom-pages nodebb
    13
    2
    5 Votes
    13 Posts
    3k Views
    DownPW
    I’m happy to see this
  • 4 Votes
    7 Posts
    3k Views
    crazycells
    @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…
  • Smart Widgets

    Solved Configure nodebb
    9
    3 Votes
    9 Posts
    3k Views
    phenomlab
    @Panda said in Smart Widgets: So why is that, or conversely why would the function to expose username ever be required, as it seems app.user is already an available global object? It is, yes, but not if you are using it outside of a widget. The function I wrote is also historical and comes from the 2.x train
  • build nodebb Warning in entrypoint size limit

    Solved Performance nodebb
    2
    0 Votes
    2 Posts
    1k Views
    phenomlab
    @eeeee they are nothing to worry about, and can be ignored.
  • Q&A Plugin Changes NodeBB

    Solved Customisation nodebb q&a plugin
    25
    1
    6 Votes
    25 Posts
    11k Views
    cagatay
    @phenomlab said in Q&A Plugin Changes NodeBB: float: right; left: 10px; } worked thank you
  • [NODEBB] Welcome Message

    Solved Customisation css html nodebb
    20
    2
    13 Votes
    20 Posts
    9k Views
    phenomlab
    @DownPW the ‘js’ code for the banner takes the time from the client, so what it displays really depends on the regional settings for the operating system. I’ve not seen this issue myself but would like to see some examples of screenshots if possible.
  • [NODEBB] CSS Style Sheets SelectBox

    Locked Solved Customisation css
    112
    24 Votes
    112 Posts
    63k Views
    phenomlab
    @DownPW as discussed in PM Seems to have been solved with the new JS code that you added allowing the version CSS file change!! Cache problem therefore with the JS of the Switcher theme Based on this, I will close this thread and reference https://sudonix.com/topic/207/nodebb-help-for-my-custom-css/27
  • 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