Ankündigung

Einklappen
Keine Ankündigung bisher.

Layout Erstellung - Aufteilung

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Layout Erstellung - Aufteilung

    ALL-INKL.COM - Webhosting Server Hosting Domain Provider
    Hallo,
    ich bin zur Zeit dabei mir ein "Layout" zu erstellen, da die Navigation bei jeder Seite gleich bleiben soll, hab ich mehrere Dateien erstellt und binde diese dann mit include ein.

    Die Website beinhaltet folgendes:
    Oben einen Header, Navigation das sollte immer gleich bleiben.
    Im unteren Bereich, können News eingetragen werden.
    Ich hab dazu einen Bereich erstellt
    Code:
    <div id="xxx">
    Hier steht der Text
    </div>
    Im Moment hab ich das so gelöst, das ich dafür zwei Include dateien habe, eine mit den Inhalt
    Code:
    <div id="xxx">
    die andere mit den Inhalt
    Code:
    </div>
    .
    Jetzt stellt sich mir allerdings die Frage ob dies auch noch anders möglich ist.

    Das gleiche hab ich bei den Bereichen auf der rechten Seite gemacht, allerdings erscheint mir das etwas unsauber.

    So gesehen binde ich auf jeder Seite die Css Datei ein und dann sämtliche Dateien mit den jeweiligen "Bereichen".
    Beispiel:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Startseite</title>
    <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
    <?php
      include "navigation.html";
      include "rightmenu.html";
      include "center.html";
    ?>
    Hier könnten die News stehen
    <?php
      include "center2.html";
      include "end.html";
    ?>
    
    
    
    
    </body>
    </html>
    Passt das so wie ich das gemacht habe, oder gibt es noch eine andere "elegantere" Lösung?
    Ich hab schon ein bisschen gesucht aber sonst nicht wirklich was gefunden.
    Mir wäre es wichtig dass nur html, css und php verwendet wird.

  • #2
    AW: Layout Erstellung - Aufteilung

    Hi,

    warum machst Du nicht eine Seite mit dein entsprechenden Bereichen.
    und lässt bei Klick nur den Bereich mit dem Inhalt ändern.
    Diesen kannst Du dann auslagern in andere Dateien, dann bindest Du nur die ein die aufgerufen wird.

    Auf der hauptseite hast Du dann alles fest eingerichtet (z.B. header, menue, u.s.w.) und änderst nur den Content.

    Die CSS-Datei brauchst dann auch nur einmal im head aufrufen
    ganz einfach so:
    HTML-Code:
    <link rel="stylesheet" href="style.css" type="text/css" media="screen">
    ich habe das in etwa so

    PHP-Code:
    <?php session_start(); //Session-Start
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html> 
    <head>
      <title> TITEL</title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      <meta name="Revisit" content="After 20 days">
      <meta name="audience" lang="de" content="Alle">
      <link rel="shortcut icon" href="favicon.ico">
      <link rel="stylesheet" href="style.css" type="text/css" media="screen">
      <link rel="stylesheet" href="print.css" type="text/css" media="print">
    </head>
    <body>

    <!--- Head -->
    <div id="head">
    <a href="?seite=start" onfocus="this.blur()"><img style="border: 0; width: 177px; height: 100px; margin-top: 15px;" alt="Logo" title="Logo" src="logo.png" align="left" hspace="5"></a>
    <h1>D K D<br>
    Dortmunder Kurierdienst</h1>
    <br>
    <!--- Menue -->
    <ul id="menue">
      <li class="default"><a href="?seite=start" onfocus="this.blur()">Startseite</a></li>
      <li><a href="?seite=wir" onfocus="this.blur()">das sind wir</a></li>
      <li><a href="?seite=philosophie" onfocus="this.blur()">Philosophie</a></li>
      <li class="drop">Kontakt
         <ul class="down">
        <li><a href="?seite=impressum" onfocus="this.blur()">Impressum</a></li>
        <li><a href="?seite=kontakt" onfocus="this.blur()">Kontakt</a></li>
        <li><a href="?seite=anfrage" onfocus="this.blur()">Frachtanfrage</a></li>
         </ul>
      </li>
      <li class="drop">Sonstiges
         <ul class="down">
        <li><a href="?seite=disclaimer" onfocus="this.blur()">Rechtshinweise</a></li>
        <li><a href="?seite=download" onfocus="this.blur()">Downloads</a></li>
        <li><a href="?seite=banner" onfocus="this.blur()">unsere Banner</a></li>
        <li><a href="?seite=partner" onfocus="this.blur()">Partnerseiten</a></li>
         </ul>
      </li>
    </ul>
    </div>

    <!--- Content, bei einen Klick auf ein Menuepunkt ändert sich nur dieser Bereich -->
    <div id="main">
    <?php
    //include-Funktion, hier wird der entsprechende Inhalt dargestellt mit Pfad wo dieser zu holen ist
    //include-array
    $content = array();
           
    $content['start'] = "content/start.php";
           
    $content['wir'] = "content/wir.php";
           
    $content['philosophie'] = "content/philosophie.php";
           
    $content['download'] = "content/download.php";
           
    $content['banner'] = "content/banner.php";
           
    $content['partner'] = "content/partner.php";
           
    $content['kontakt'] = "content/kontakt/kontakt.php";
           
    $content['mailer'] = "content/kontakt/mailer.php";
           
    $content['mailer2'] = "content/kontakt/mailer2.php";
           
    $content['anfrage'] = "content/kontakt/fracht.php";
           
    $content['impressum'] = "content/rechtliches/impressum.html";
           
    $content['disclaimer'] = "content/rechtliches/disclaimer.html";
    if(isset(
    $_GET['seite'], $content[$_GET['seite']]))
     {
         include 
    $content[$_GET['seite']];
     } else {
        include 
    "content/start.php";
     }
    ?>
    </div>

    <!--- Fußbereich -->
    <div id="foot">
      <a href="?seite=impressum" onfocus="this.blur()">Impressum</a>&nbsp;<a href="?seite=disclaimer" 
         onfocus="this.blur()">Rechtshinweise
      </a>
      <p class="adress">Betreiberangaben in Kurzform<br>
      </p>
    </div>

    </body>
    </html>
    Ich hoffe das hilft Dir weiter, wie was dargestellt wird, das wird über die style.css geregelt.
    Aber denke das ist eh klar
    Schreib- und Tipfehler sind zu Belustigung, wer sie findet darf sie behalten
    irren ist menschlich, also verzeiht eventuelle Fehler

    Gruß aus dem Süden

    Kommentar


    • #3
      AW: Layout Erstellung - Aufteilung

      Hallo,
      danke für die Rückmeldung.
      Ich hatte die letzten Tage leider kaum Zeit.

      Wenn ich das richtig sehen hast du einen "content" Ordner erstellt und dort die anderen Seiten. Die jeweiligen Seiten werden dann durch einen klick auf die Oberen Links geladen.

      Wenn ich das richtig verstehe, erstelle ich eine Hauptseite, und dort "binde" ich dann die anderen Websites ein, so dass die Navigation gleich bleibt nur die übergebene Seite wird dann mit "eingebunden". Bzw. erstelle ich einen Bereich, der dann immer durch die jeweilige Seite geändert wird, wie oben der "main" Bereich.
      Zuletzt geändert von Aluan; 02.05.2013, 15:09.

      Kommentar


      • #4
        AW: Layout Erstellung - Aufteilung

        Hallo,

        genau richtig verstanden.

        Es ändert dich nicht die seite sondern nur der Teil wo der Content eingebunden wird (per include)

        Ja ich habe ein Ordner wo ich die jeweiligen Dateien drin zu liegen habe, finde ich übersichtlicher, aber das muss man so nicht machen, kann auch alles in ein Ordner sein, der Pfad muss eben passen

        Und die eingebundenen Dateien, benötigen auch kein eigenen head oder so,
        weil den hast ja in der Datei wo es eingebunden wird schon

        Gruß Massel
        Schreib- und Tipfehler sind zu Belustigung, wer sie findet darf sie behalten
        irren ist menschlich, also verzeiht eventuelle Fehler

        Gruß aus dem Süden

        Kommentar


        • #5
          ALL-INKL.COM - Webhosting Server Hosting Domain Provider
          AW: Layout Erstellung - Aufteilung

          Sehr gut,
          ist wohl etwas übersichtlicher und wesentlich weniger Arbeit.

          Dankeschön!

          Kommentar

          homepage-forum.de - Hilfe für Webmaster! Statistiken

          Einklappen

          Themen: 56.587   Beiträge: 428.015   Mitglieder: 28.177   Aktive Mitglieder: 53
          Willkommen an unser neuestes Mitglied, jacksamnack.

          Online-Benutzer

          Einklappen

          290 Benutzer sind jetzt online. Registrierte Benutzer: 4, Gäste: 286.

          Mit 3.502 Benutzern waren am 23.01.2020 um 18:20 die meisten Benutzer gleichzeitig online.

          Die neuesten Themen

          Einklappen

          Die neuesten Beiträge

          Einklappen

          Lädt...
          X