nav is not shown after adding cover

AndroidDesigner commented 1 week ago

Hello everyone. I carefully read the setup documentation, and everything seemed correct, but when I created a cover page, the navbar I had created doesn’t display. the index.html is as the below:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="description" content="Description">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
  <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify@4/lib/themes/vue.css">
</head>

<body>

  <nav>
    <a href="#/">EN</a>
    <a href="#/ar/">Arabic</a>
  </nav>

  <div id="app"></div>

  <script>
    window.$docsify = {
      name: '',
      repo: '',
      loadSidebar: true,
      subMaxLevel: 2,
      coverpage: true,
      rtl: {
        body: "ltr",
        side: "ltr",
        bdo: "rtl"
      }
    }

  </script>
  <!-- Docsify v4 -->
  <script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
  <script src="//unpkg.com/docsify-rtl/build/index.min.js"></script>
  <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>

</body>
</html>

what is the problem?

paulhibbitts commented 1 week ago

Hi @AndroidDesigner , looks like you are missing the navbar config in your index.html file. Try adding loadNavbar: true, after your loadSidebar config?

AndroidDesigner commented 1 week ago

Hi @AndroidDesigner , looks like you are missing the navbar config in your index.html file. Try adding loadNavbar: true, after your loadSidebar config?

Yes, I added loadNavbar: true but nothing changed again. I removed the <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script> and everything works fine now. So you should remove this script tag from the cover page documentation.

AndroidDesigner commented 1 week ago

Another problem: Now the navbar is shown in the cover page, but scrolling the cover page to the content will hide it again and needs refresh the content page (http://localhost:3000/#/ URL) manually to show navbar.

sy-records commented 1 week ago

  <script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
  <script src="//unpkg.com/docsify-rtl/build/index.min.js"></script>
  <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>

cdn.jsdelivr.net/npm/docsify@4 and cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js These two are the same and do not need to be reintroduced.

paulhibbitts commented 1 week ago

Another problem: Now the navbar is shown in the cover page, but scrolling the cover page to the content will hide it again and needs refresh the content page (http://localhost:3000/#/ URL) manually to show navbar.

That is expected behavior from what I recall.

docsifyjs / docsify

nav is not shown after adding cover #2510