Ich hatte mir lange überlegt, wie ich z.B. beim Wetterkalender, oder bei den Listentage die von Wswin ein einfaches Dropdown-Menü einbauen kann, direkt von einer Vorlage mit dem Programm Dreamweaver 21 von Adobe. Der Html Code und die CSS Dateien werden von dem Programm beim Speichern der Datei dann automatisch erzeugt. Also kein lästiges Suchen im Netz.
Was im Html-Code eingefügt werden muss:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html>
<head>
<style type="text/css">
<!--
TD {FONT-FAMILY: Arial; }
-->
</style>
<!-- Bootstrap -->
<link href="css/bootstrap-4.4.1.css" rel="stylesheet">
</head>
<BODY bgColor="#555E75">
<!-- DropdownMen -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
<a class="navbar-brand" href="#">Wetterkalender</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="../../index.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Jahr 2024</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="wetterkalender_01_2024.html">Januar 2024</a>
<a class="dropdown-item" href="wetterkalender_02_2024.html">Februar 2024</a>
<a class="dropdown-item" href="wetterkalender_03_2024.html">Mrz 2024</a>
... diese Zeilen weiterhin kopieren und unter Mrz 2024 einfügen, wenn Erweitert wird.
</li>
</ul>
</div>
</div>
Anmerkung: Wenn mehrere Jahr erweitert werden sollen, den kompletten Inhalt mit:
------>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Jahr 2024</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="wetterkalender_01_2024.html">Januar 2024</a>
<a class="dropdown-item" href="wetterkalender_02_2024.html">Februar 2024</a>
</li>
------->
Weiter unten im body:
vor </body>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery-3.4.1.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/popper.min.js"></script>
<script src="js/bootstrap-4.4.1.js"></script>
</body>
Achtung: Diese Dateien müssen dort liegen, wo sich diese Dateien, wie Wetterkalender, Jahreszeiten u.s.w. sich befinden.
Sind zwei Unterordner, die dort auf den Server kopiert werden müssen.
Nach dem Hochladen, sieht dann die Wetterkalender.html Datei anders aus, in der Darstellung, ist aber nicht tragisch.
Die Unterordner css und js sind als Zip-Datei im Anhang.
Sollte was nicht funktionieren, melden. Denke ist wohl kein Fehler drin.