Potential Trace of Hidden Category

Bug Reports

Suggested Topics


  • 8 Votes
    1 Posts
    166 Views

    Since NodeBB 1.18.6 it is possible to create dropdowns in the navigation (https://github.com/NodeBB/NodeBB/issues/9967). Before 1.18.6 to accomplish this you would have to use nodebb-plugin-customize to modify the menu template or use javascript to inject the markup after page load.

    In this tutorial I will show you how to create a dropdown navigation item that replaces the default categories link with a dropdown. The final result will look like this:

    category-dropdown.gif

    First thing to do is to turn the navigation item into a dropdown, to do this head over to yourforum.com/admin/settings/navigation, select the categories navigation item and toggle the dropdown option.

    category-dropdown-1.gif

    Once this is done you can use the text area below the toggle to add your markup. To create a simple dropdown you would just add a list of dropdown items like so:

    <li><a class="dropdown-item" href="/categories">All</a></li> <li><a class="dropdown-item" href="/category/2/general-discussion">General Discussion</a></li>

    Since you can input html here you can create custom dropdowns. To achieve the same dropdown as the first gif use the below html code, no css is necessary.

    <li><a class="dropdown-item" href="/categories">All</a></li> <li class="dropdown-divider"> <li><a class="dropdown-item" href="/category/2/general-discussion">General Discussion</a></li> <li class="d-flex flex-column"> <a class="dropdown-item" href="/category/3/nodebb-development">NodeBB Development</a> <div class="d-flex flex-column px-4"> <div class="d-flex align-items-center gap-1"> <i class="fa fa-fw fa-caret-right text-primary"></i> <a class="btn-ghost-sm text-sm text-nowrap" href="/category/13/nodebb-blog">NodeBB Blog</a> </div> <div class="d-flex align-items-center gap-1"> <i class="fa fa-fw fa-caret-right text-primary"></i> <a class="btn-ghost-sm text-sm text-nowrap" href="/category/5/feature-requests">Feature Requests</a> </div> <div class="d-flex align-items-center gap-1"> <i class="fa fa-fw fa-caret-right text-primary"></i> <a class="btn-ghost-sm text-sm text-nowrap" href="/category/6/bug-reports">Bug Reports</a> </div> <div class="d-flex align-items-center gap-1"> <i class="fa fa-fw fa-caret-right text-primary"></i> <a class="btn-ghost-sm text-sm text-nowrap" href="https://explore.transifex.com/nodebb/nodebb/">NodeBB Localization</a> </div> </div> </li> <li><a class="dropdown-item" href="/category/7/nodebb-plugins">NodeBB Plugins</a></li> <li><a class="dropdown-item" href="#">...add more as needed...</a></li>

    Modify the links to match your forum categories. To create dividers between sections you can use <li class="dropdown-divider">

    Now you can navigate your categories without going to the home/categories page. ๐ŸŽŠ

  • Purge category, leave 1 post

    Bug Reports
    0 Votes
    3 Posts
    910 Views

    @baris thank you so much!!! Run like a charm!!!

  • 0 Votes
    1 Posts
    1k Views

    Regarding subcategory icons being shown on the main page in 1.01, I noticed an issue when a category icon is used w/o a font awesome icon.

    tl;dr

    Custom category icons aren't shown on the main page for subcategories If a font awesome icon is also used, it is shown instead.

    Request use of a scaled down subcategory icon, or the ability to use icon + font awesome, but not have font awesome shownn on the main page.

    Subcategory icons on the main page ยท Issue #4381 ยท NodeBB/NodeBB

    I noticed that if you upload a image for your category icons, that subcategories shown on the main page beneath their parent category do not fixing a scanned copy of the background image. If you use a font awesome icon and a uploaded ima...

    favicon

    GitHub (github.com)

  • 0 Votes
    3 Posts
    1k Views

    @baris we get faster service here than at McDonalds. Jeeze.

    Confirmed that the fix works fine. Thanks again.

  • Aspect Ratio

    General Discussion
    0 Votes
    2 Posts
    1k Views

    @Guiri I use 450px x 450px and set them to cover.