use menu entry property weight to sort menu items

README.md

@@ -178,15 +178,18 @@ paginate = 5
     # path = "/img/your-example-logo.svg"
     # alt = "Your example logo alt text"
 
+    # `weight` is used to sord menu items. https://gohugo.io/variables/menus/
     [languages.en.menu]
       [[languages.en.menu.main]]
         identifier = "about"
         name = "About"
         url = "/about"
+        weight = 1
       [[languages.en.menu.main]]
         identifier = "showcase"
         name = "Showcase"
         url = "/showcase"
+        weight = 0
 ```
 
 to `config.toml` file in your Hugo root directory and change params fields. In case you need, here's [a YAML version](https://gist.github.com/panr/8f9b363e358aaa33f6d353c77feee959).

layouts/partials/menu.html

@@ -1,7 +1,7 @@
 <nav class="menu">
   <ul class="menu__inner menu__inner--desktop">
     {{ if or $.Site.Params.showMenuItems (eq $.Site.Params.showMenuItems 0) }}
-      {{ range first $.Site.Params.showMenuItems $.Site.Menus.main }}
+      {{ range first $.Site.Params.showMenuItems (sort $.Site.Menus.main "Weight") }}
         {{ if not .HasChildren }}
           <li><a href="{{ .URL }}">{{ .Name }}</a></li>
         {{ end }}
@@ -15,16 +15,16 @@
             >
           </li>
           <ul class="menu__sub-inner-more hidden">
-            {{ range last (sub (len $.Site.Menus.main) $.Site.Params.showMenuItems) $.Site.Menus.main }}
+            {{ range last (sub (len $.Site.Menus.main) $.Site.Params.showMenuItems) (sort $.Site.Menus.main "Weight") }}
               {{ if not .HasChildren }}
                 <li><a href="{{ .URL }}">{{ .Name }}</a></li>
               {{ end }}
             {{ end }}
           </ul>
         </ul>
       {{ end }}
-      {{ else }}
-      {{ range $.Site.Menus.main }}
+    {{ else }}
+      {{ range sort $.Site.Menus.main "Weight" }}
         {{ if not .HasChildren }}
           <li><a href="{{ .URL }}">{{ .Name }}</a></li>
         {{ end }}
@@ -33,7 +33,7 @@
   </ul>
 
   <ul class="menu__inner menu__inner--mobile">
-    {{ range $.Site.Menus.main }}
+    {{ range sort $.Site.Menus.main "Weight" }}
       {{ if not .HasChildren }}
         <li><a href="{{ .URL }}">{{ .Name }}</a></li>
       {{ end }}