How can I use a html link menu?

Question

I'm converting a static site to Joomla, and wanted to keep everything the same; So I also want to keep using my static HTML menu.

I currently don't care about responsiveness and so on...

There is just one page on this site, it just a test(layout, ect): https://kicotest.demojoomla.com/

Can someone tell me how I can use HTML "menus" based on links in Joomla? My menu code looks like this:

<div class="mainmenu"> <!--main menu links-->  
 <ul class="navigation">
  <li class="nav-item"><a id="link12" style="border-style: solid; border-width: 1px;" href="http://www.kico4u.de/#" onclick="LangChange();">English menu</a></li>
  <li class="nav-item"><a id="link1" href="http://www.kico4u.de/index.html">Home</a></li>
  <li class="nav-item"><a id="link2" href="http://www.kico4u.de/english/uebungen/uebungen.html">Übungen</a></li>
  <li class="nav-item"><a id="link3" href="http://www.kico4u.de/english/grammatik/grammatik.html">Grammatik</a></li>
  <li class="nav-item"><a id="link4" href="http://www.kico4u.de/english/topicotw/topicotw.html">Hörübungen</a></li>
  <li class="nav-item"><a id="link5" href="http://www.kico4u.de/english/gbinfo/gbinfo.html">Infos zu GB</a></li>
  <li class="nav-item"><a id="link6" href="http://www.kico4u.de/english/uebungen/worksheets.html">Arbeitsblätter</a></li>
  <li class="nav-item"><a id="link7" href="http://www.kico4u.de/english/uebungen/pass_wort1.htm">Passwort kaufen</a></li>
  <li class="nav-item"><a id="link8" href="http://www.kico4u.de/forum/">Forum</a></li>
  <li class="nav-item"><a id="link9" href="http://www.kico4u.de/english/uebungen/references.htm">Referenzen</a></li>
  <li class="nav-item"><a id="link10" href="http://www.kico4u.de/english/ueberuns/ueberuns.html">Über uns</a></li>
  <li class="nav-item"><a id="link11" href="http://www.kico4u.de/english/impressum/index.html">Impressum</a></li>
 </ul> <!--main menu links end-->
</div>

The easiest way would be to replace the links right?

Answer 1

The easiest way (though not an ideal solution) would probably be to use a Custom HTML module (either the built-in module, or one from the Joomla Extensions Directory). Simply paste your code, and publish the module to your main menu position.

However, this goes agains the main purpose of a CMS, because your menu now is hard-coded, and not part of the Joomla menu system.

If you want to keep your current links, and still use the Joomla menu system, you can set Menu Item Type to System Links -> External URL, and insert your static URL. Again, this is not good practice.

The best option is to create articles with your static content, and then add menu items that link to these articles. If you need your source code to look exactly as your example (with classes and IDs), you can create a module override for the menu module (ROOT\modules\mod_menu\tmpl). Copy the files you want to override to ROOT\templates\YOURTEMPLATE\html\mod_menu\ and modify the source code as needed to add your classes and IDs. You probably want to edit default.php, default_url.php or both.

Hope that helps.