Ergebnis 1 bis 3 von 3
  1. #1
    Dreami Dreami ist offline
    Avatar von Dreami

    Tutorial: Gleiches Menü auf allen Seiten.

    Wenn man eine Webseite macht, merkt man sehr schnell, dass es sehr aufwendig ist, das Menü zu verwalten. Jedesmal wenn man einen neuen Menüpunkt hat muss man den in alle Seiten bringen. Da Menüs oftmals mehrzeilig sind, muss man hier einen geeigneten Editor haben und auch damit ist es noch ziemlich schwierig.
    Wäre es nicht viel einfacher, das Menü in einer Datei zentral zu haben?
    Dazu gibt es die PHP-Funktion include(). Diese Funktion lädt die Datei die zwischen den Klammern steht in die Datei, in der der Code steht nach.

    Damit das hier funktioniert muss euer Server PHP unterstützen. Das ist meistens standardmässig deaktiviert. Die Dateinamen der Inhaltsseiten müssen PHP-kompatibel sein, also z.B. .php oder .phtml. Ich würde .php empfehlen.
    Danach schreibt ihr erstmal die ganze Seite ohne das Menü. Dort wo der Kommentar steht, kommt später das Menü hin:
    HTML-Code:
    <html>
    <body>
    <head>
    <title>Testseite mit PHP</title>
    </head
    <body>
    <!-- Hier kommt das Menü hin -->
    Hier der Inhalt
    </body>
    </html>
    Danach schreibt ihr den Inhalt des Menüs. Achtung: include() liest die ganze Datei nur aus und schreibt sie in die ursprüngliche Datei. Ihr könnt also alles was vor und nach den <body>-Tags kommt weglassen, die <body>-Tags natürlich auch
    Die Datei könnt ihr jetzt z.B. als Test.php speichern.
    Jetzt macht ihr eine zweite Seite auf und schreibt z.B. folgendes hinein:
    HTML-Code:
    <a href="/">Ich bin ein Link zur Startseite</a>
    Damit habt ihr ein Menü, in dem ein Link zur Startseite ist mit dem Text "Ich bin ein Link zur Startseite".
    Diese Datei speichert ihr nur der Einfachheit halber z.B. unter dem Namen menu.html. Achtet darauf, dass Test.php und menu.html im gleichen Ordner sind.

    Jetzt könnt ihr das Menü in die ursprüngliche Datei einbinden. Öffnet also wieder Test.php und löscht den Kommentar. Die Datei sollte am Ende so aussehen:
    HTML-Code:
    <html>
    <body>
    <head>
    <title>Testseite mit PHP</title>
    </head
    <body>
    <?php
    include(menu.html);
    ?>
    Hier der Inhalt
    </body>
    </html>
    Der Tag <?php weist den Server an, ab hier PHP zu benutzen. Er führt die Funktion include() mit der Datei menu.html aus. Danach muss ?> stehen, damit der Server weiss, dass der PHP-Teil zu Ende ist.
    Am Ende solltet ihr dann eine Seite haben auf der der Link zur Startseite ist und darunter "Hier der Inhalt" steht.
    Das Ganze macht bei einer Seite noch nicht soviel Sinn. Wenn ihr aber eine zweite Seite habt, z.B. Moep.php, macht das mehr Sinn.
    Macht also eine zweite Seite mit dem folgenden Inhalt:
    HTML-Code:
    <html>
    <body>
    <head>
    <title>Testseite mit PHP</title>
    </head
    <body>
    <?php
    include(menu.html);
    ?>
    Das ist die Moep-Seite
    </body>
    </html>
    Ihr könnt diese Datei z.B. Moep.php nennen. Achtet darauf dass sie im selben Verzeichnis wie menu.html ist.
    Wenn ihr Moep.php öffnet solltet ihr den Link sehen (wie auf Test.php) und den Text "Das ist die Moep-Seite.

    Ihr könnt jetzt menu.html öffnen. Schreibt dorthin in eine neue Zeile:
    HTML-Code:
    <a href="Test.php">Link zur Testseite</a>
    <a href="Moep.php">Link zur Moepseite</a>
    Öffnet jetzt Moep.php und ihr solltet die 3 Links und den Inhalt sehen. Wenn ihr jetzt auf Test.php geht seht ihr das gleiche, nur dass hier natürlich der Inhalt anders ist.

    Wenn ihr das Ganze in der Praxis sehen möchtet, hier meine Seite: http://trg.kellerone.de. Ich empfehle euch, die Quelltexte zu lesen. Das Menü ist hier menu.html. Am besten lest ihr den Quelltext von http://trg.kellerone.de/menu.html und vergleicht den Quelltext mit der Startseite http://trg.kellerone.de/index.php.

  2. Anzeige

    Tutorial: Gleiches Menü auf allen Seiten.

    Schau dir mal diesen Bereich an. Dort ist für jeden was dabei!
  3. #2
    Vo0do0 Vo0do0 ist offline
    Avatar von Vo0do0

    AW: Tutorial: Gleiches Menü auf allen Seiten.

    schönes tutorial.
    zwar etwas für totale-anfänger, dafür für diese auch sehr gut verständlich.schön gemacht

  4. #3
    Unregistriert

    AW: Tutorial: Gleiches Menü auf allen Seiten.

    Bei mir klappt's nur, wenn die inkludierte Datei in Anführungszeichen gesetzt wird: include("menu.html");

    Anselm

Ähnliche Themen


  1. WiFi MAX Tutorial - Tutorial: Hi Leutz, hab mal ein WiFi Max Tutorial gemacht. Wäre nett wenn ihr mich dabei unterstützen könntet dieses zu verbessern, sprich kritik ausüben und...

  2. Wii Fit Plus gleiches balance board ?: Hi ist im wii fit plus genau das gleiche balance board wie beim vorgänger wii fit enthalten?:D

  3. Bild ist beschnitten an allen seiten ?? HILFE: Ich habe mir grad zum 3 mal Win7 64 bit installiert eigentlich funzt allet prima , jedoch ist das Bild anscheinend zu Gross an allen Seiten fehlen...

  4. Gleiches Profil, neue ID: Erstmal sry für diesen wohl überflüssigen Thread, kann auch sofort gecloset werden, sobald ich eine Antwort bekommen habe. Also, ich hätte gerne...

  5. Gleiches Vista auf 2 Computern?: Hey! Zur Weihnachtszeit habe ich mir natürlich einen neuen Computer zukommen lassen. Auf meinem alten PC war auch schon Windows Vista Home Premium...