Skip to content

ollie-nye/docfx-dropdown-fix

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Dropdown Navbar Fix - Steps to reproduce the fix

  1. Download https://github.com/dotnet/docfx/releases/download/v2.37.2/docfx.zip

  2. Extract docfx.zip

  3. Run docfx init -q to get a new project

  4. cd docfx_project

  5. Add to toc.yml:

    - name: More
      dropdown: true
      items:
      - name: Item 1
        topicHref: /abc
      - name: Item 2
        topicHref: /def
      - name: Item 3
        topicHref: /ghi
  6. Run docfx template export default to get the default template out of DocFX

  7. Move ./_exported_templates/default to ./custom_template

  8. Remove ./_exported_templates

  9. Change docfx.json -> [build][template] from 'default' to 'custom_template'

  10. Replace the contents of ./custom_template/partials/li.html.tmpl with:

    <ul class="nav level{{level}}">
    {{#items}}
      <li>
        {{^dropdown}}
          {{^leaf}}
            <span class="expand-stub"></span>
          {{/leaf}}
          {{#topicHref}}
            <a href="{{topicHref}}" name="{{tocHref}}" title="{{name}}">{{name}}</a>
          {{/topicHref}}
          {{^topicHref}}
            <a>{{{name}}}</a>
          {{/topicHref}}
          {{^leaf}}
            {{>partials/li}}
          {{/leaf}}
        {{/dropdown}}
        {{#dropdown}}
          <li class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">{{name}} <span class="caret"></span></a>
            <ul class="dropdown-menu level{{level}}">
              {{>partials/dd-li}}
            </ul>
          </li>
        {{/dropdown}}
      </li>
    {{/items}}
    </ul>
  11. Create ./custom_template/partials/dd-li.html.tmpl and add:

    {{#items}}
      <li><a href="{{topicHref}}">{{name}}</a></li>
    {{/items}}
  12. Stop active navbar items showing on the homepage with ./custom_template/styles/docfx.js, replacing line 394:

    $(e).addClass(active);

    with

    if ((window.location.pathname != '/index.html') && (window.location.pathname != '/')) {
      $(e).addClass(active);
    }
  13. Start site serve with docfx docfx.json --serve

About

Basic fix for DocFX navbar dropdowns

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published