Skip to content

[NODEBB] Help for my custom CSS

Solved Customisation
258 5 173.4k 3
  • 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
  • CSS code customization for the link preview plugin

    Solved Customisation css nodebb
    6
    2
    3 Votes
    6 Posts
    3k Views
    phenomlab
    @kadir-ay-0 marking as resolved based on https://community.nodebb.org/topic/17109/manual-build-a-night-mode-for-harmony/5 Please do not raise requests in two places - here and the NodeBB forums. All this does is create unnecessary load for both parties.
  • NodeBB: Favicon upload issue

    Solved Configure nodebb favicon
    12
    1
    3 Votes
    12 Posts
    4k Views
    mventures
    @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!
  • 36 Votes
    55 Posts
    31k Views
    phenomlab
    @DownPW I see why. The code relies on the existence of [component="topic/quickreply/container"] However, this by definition means that the below has to be enabled [image: aeef638f-4188-489d-a9f2-f3a26dbca9d8-image.png] It will then work [image: 7fb38631-e0f3-46ef-b652-00929d927b13-image.png] For some unknown reason, this is hidden in Harmony, and only shows if you select it. In v2, it seems that the <section> is deleted altogether in Persona if “Quick Reply” is disabled, meaning it won’t fire as it can’t locate that specific component. The downside is that you might not want the quick reply function, but I think it’s a PITA to scroll up to the top of the post just to reply, so I have it on
  • How to fix size of photos & videos NodeBB

    Solved Customisation nodebb nodebb size
    7
    3 Votes
    7 Posts
    3k Views
    phenomlab
    @crazycells pleasure. Using percentages makes much more sense in this case. It’s the same argument with px vs pt vs em with fonts, margins, padding, etc., in the sense that em is generally preferred over px and pt https://stackoverflow.com/questions/609517/why-em-instead-of-px
  • NodeBB Footer

    Solved Customisation footer nodebb
    10
    1 Votes
    10 Posts
    4k Views
    JAC
    @phenomlab said in NodeBB Footer: @jac and you. Hope all is well and you recover quickly Thanks pal
  • Customising NodeBB

    Locked Customisation nodebb
    3
    0 Votes
    3 Posts
    3k Views
    phenomlab
    Closing this thread as a duplicate of https://sudonix.com/topic/12/nodebb-customisation
  • NodeBB customisation

    Locked Customisation
    332
    27 Votes
    332 Posts
    280k Views
    phenomlab
    @jac Given your departure away from your previous project, I’m going to close this thread…