[HaBo]

19.11.07, 12:12

Hallo,

Ich bin gerade am gestalten eines Webauftrits. Das Grundgerüst habe ich wie folgt festgelegt:

Code:

+-------------+
|  Logo & Nav |
+-------------+
|Hauptinhalt  |
|(wechselbar) |
+-------------+
| footer      |
+-------------+

Ich möchte nun den oberen Teil (Logo & Nav) sowie den footer immer auf die gleiche Datei verlinken. (damit ich das Inhaltsverzeichnis zentral verwalten kann, und die Logo Grafik nur 1mal geladen/interpretiert werden muss)

Wie stelle ich das nun am klügsten an? Möglichst nur html und css. JS möchte ich wenn möglich vermeiden.

Ich habe zuerst an frames gedacht, nur müsste ich dann je nach dem, was in der Nav angeklickt wird, im Main frame etwas anderes anzeigen lassen. JS?

Macht man sowas überhaupt mit frames? Gibt doch sicher ein paar hier, die sich mit webdesign etwas auskennen :) Ein paar Stichworte in die richtige Richtung würden schon reichen ;)

Gruss & thx
IsNull

**lightsaver** · 19.11.07, 12:42

wenn ich dein problem richtig verstanden habe, dann hatten wir eine ähnliche frage bereits: menü für eine website - wie realisieren

Anzeige

- Anzeige -

19.11.07, 12:59

Zitat:

Original von lightsaver
wenn ich dein problem richtig verstanden habe, dann hatten wir eine ähnliche frage bereits: menü für eine website - wie realisieren

Danke für den Link, habe das nicht gefunden. Scheint aber trotzdem nur mit Frames oder dann mit php zu gehen...

Werde wahrscheinlich doch mit php machen. - Und dazu habe ich jetzt auch noch ne kleine Frage:

Ich kann ja die einzelnen html Dateien includen.

PHP-Code:

  <? include ("nav.html"); ?>
<? include ("main1.html"); ?>
<? include ("footer.html"); ?>

wie kann ich jetzt das main1.html verändern?

**lightsaver** · 19.11.07, 13:36

ich würde es so machen:

du machst deine einzelnen seiten. sagen wir mal, du hast ne datei impressum.php (nur ein beispiel für jede einzelne seite)

in dieser impressum.php machst du ein

Code:

<? include ("nav.html"); ?>

hier kommt jetzt in html der inhalt, also das was du als main bezeichnest

<? include ("footer.html"); ?>

und so machst du das dann halt auch mit allen anderen seiten.

ach und nav.html und footer.html sollten vielleicht keine kompletten html-dateien sein, da du ja sonst probleme mit doppelten tags bekommst. theoretisch würde halt schon ne einfache txt zum includen reichen.

19.11.07, 14:12

Ach so

Danke, denke dies kann ich nun umsetzen.

thx
IsNull

BigDevil · 19.11.07, 14:54

Zitat:

Original von lightsaver
ach und nav.html und footer.html sollten vielleicht keine kompletten html-dateien sein, da du ja sonst probleme mit doppelten tags bekommst. theoretisch würde halt schon ne einfache txt zum includen reichen.

Man sollte auf keinen Fall komplette .html Dateien includen. Der Validator ist bestimmt nicht begeistert, wenn ein Quelltext 3x <html></html>, <head></head> und <body></body> enthält.

Edit:

Du solltest bei include nicht mit absoluten Pfadangaben arbeiten, sondern mit relativen. Einige Server machen da Ärger.

ic3cu83z · 19.11.07, 15:11

Du könntest es auch komplett in HTML halten. Machst 1 Tabelle mit 100% Breite und Höhe.

Darin eine weitere Tabelle mit 3 Reihen (1. header/menu, 2. mainFrame/Inhalt, 3. Footer). Diese Tabelle dann für 1. auf eine feste Pixelzahl (bspw. Höhe des Logos) festlegen. Das selbe machst Du mit dem Footer.

Die Menüpunkte würde ich schon im Grundgerüst verlinken und als index.html speichern.

Dann brauchst Du lediglich für die einzelnen Menüpunkte den Inhalt ändern und das Dokument dann jeweils speichern (about.html, etc).

So sollte es auch klappen.

**lightsaver** · 19.11.07, 16:06

Zitat:

Original von BigDevil
Man sollte auf keinen Fall komplette .html Dateien includen. Der Validator ist bestimmt nicht begeistert, wenn ein Quelltext 3x <html></html>, <head></head> und <body></body> enthält.

deswegen hatte ich es ja extra nochmal erwähnt

habe mich nur so nah an dem beispiel gehalten wir grad möglich

.:L · 19.11.07, 16:53

kann dir nur php empfehlen.

Du musst nichma php können, kannst alle sauslagern.
Geht auch über include sprich::

Du machst ne Datei
config.php
da schreibst du alle beschreibungen -> Seiten rein
und in dne Link auf den Seiten packste dann nurnoch die Bezeichnung

zb:

in der config.php steht

$dateien['home'] = "home.html"

dann schreibste in den link

"href="index.php?section=home"

hört sich bestimmt brutal an, is abe recht dufte leicht.

Bei Interesse erlär ichs gerne genauer

19.11.07, 17:59

Erstmal danke für die vielen Tipps und Anregungen.

Ich habe nun Lightsavers Methode in die Tat umgesetzt, und das haut auch hin.

also so:

Zitat:

<? include ("nav.htm"); ?>

//hier kommt jetzt in html der inhalt, also das was du als main bezeichnest

<? include ("footer.htm"); ?>

Selbstverständlich habe ich nur im nav.htm die eröffnungs Tags, und nur im footer die schliessenden. Das was ich erreichen wollte, ist somit erreicht.

@.:L:

Ich kann ein bisschen PHP (ich brauchte es bis jetzt halt nur sehr wenig, deshalb muss ich mich oft durch die Helps quälen...) Das was du antönst, scheint mir als ob man hier mit GET Variabeln schaffen würde, oder?

Wäre dir dankbar, wenn du deinen Vorschlag noch etwas genauer umschreiben könntest. Evtl. auch mit Gründen, warum man es auf diese oder die andere Art machen sollte...

thx & Gruss
IsNull

BigDevil · 19.11.07, 19:05

Zitat:

Original von IsNull
Selbstverständlich habe ich nur im nav.htm die eröffnungs Tags, und nur im footer die schliessenden. Das was ich erreichen wollte, ist somit erreicht.

l

Ich hätte das anders gemacht.

Code:

<html>
<head>
</head>
<body>
<?php include ("navi.html"); ?>
---main---
<?php include ("footer.html"); ?>
</body>
</html>

So steht in der Navi- und Footerdatei auch nur die Navigation und der Footer.

M.D.Geist · 19.11.07, 22:56

Hallo IsNull,

hier ist mal ein kleines Beispiel zur Verwendung von GET-Variablen. Du brauchst dazu nur einmal eine "index.php" mit "navi" und "footer" zu schreiben, der dementsprechende Inhalt der dann angezeigt wird, wird durch die Links in der Navigation gesteuert.

Code:

/***** Navigation *****/
GET-Variablen werden mit einem ? an die URL angehängt, mehrere Variablen werden
durch ein & getrennt (z.b. index.php?foo=wert1&bar=wert2)

<a href="index.php?id=1">Link1</a>
<a href="index.php?id=2">Link2</a>
<a href="index.php?foo=bar">Link3</a>

/**** Main *****/
Hier prüfst du die GET-Variablen auf ihren Wert und includierst dann die 
dementsprechenden Dateien. 
(z.B. mit switch() falls du nur auf Zahlen prüfst oder mit if() wenn du auch auf
Strings prüfst)

<?php
  switch($_GET['id']) {
    case 1:
    include("seite1.php");
    break;
    case 2:
    include("seite2.php");
    break;
  }

  if($_GET['foo'] == "bar") {
    include("seite3.php");
  }
?>

/***** Footer ****/

Ich hoffe dieses kleine Beispiel ist relativ verständlich, falls du dich ernsthaft damit befassen willst kann ich dir nur das PHP-Manual oder ein gutes Buch empfehlen.

bLaCk-DrAg0n · 20.11.07, 10:26

ich weiss jetzt nicht wie groß der webauftritt werden soll.
sollte deine Seite nicht mehr als 3 verschiedene pages haben,
dann ignoriere meinen beitrag einfach ^^

Ich persönlich würde die Ganze sache mit einer Template Engine unter PHP lösen.
Dies würde dir 1. mehr möglichkeiten bieten und 2. eine höhere Dynamik der Seite erlauben,
wenn dies denn gewünscht ist.
Zu PHP gibt es schon einige viele Engines die alle ihre Vor- und Nachteile haben.
Am besten du schaust dir die Engine's selber mal an.
Würde dir vLib empfehlen. ist für so kleine sachen recht gut

PS: Nimm nicht Smarty... das wär für deine Zwecke 1. viel zu Overpowered und 2. ist es generell einfach zu langsam. die anderen kenne ich leider nicht :X

20.11.07, 13:30

Zitat:

Original von M.D.Geist
Hallo IsNull,

hier ist mal ein kleines Beispiel zur Verwendung von GET-Variablen. Du brauchst dazu nur einmal eine "index.php" mit "navi" und "footer" zu schreiben, der dementsprechende Inhalt der dann angezeigt wird, wird durch die Links in der Navigation gesteuert.
[...]
Ich hoffe dieses kleine Beispiel ist relativ verständlich, falls du dich ernsthaft damit befassen willst kann ich dir nur das PHP-Manual oder ein gutes Buch empfehlen.

Hi M.D.Geist,

Jetzt verstehe ich das Prinzip. Ich werde es nun so umsetzen.

@bLaCk-DrAg0n:
Nun, die grösse ist nicht ganz so einfach festzulegen. Zu Beginn werden es so um die 3-4 Haupseiten sein, wobei bei es bei einer Hauptseite Sub-Kategorien geben wird. Da ich aber überall mit dem gleichen nav und footer fahren will, ist es wahrscheinlich übertrieben so was zu nutzen. Später könnte das ganze noch etwas wachsen.

Da ich es aber nicht kenne, werde ich es mir sicherlich mal zu Gemüte führen... wenn ich mal ne freie Minute finde

Sobald das ganze oben ist, und öffentlich zugänglich, werde ich die Site hier verlinken, und ihr könnt, sofern ihr wollt, konstruktive Krittik anbringen

(momentan ist dies aus "politischen" Gründen nicht möglich. )

Ich möchte mich nochmals für die tolle Unterstützung bei euch allen bedanken

Gruss
IsNull

.:L · 20.11.07, 16:01

Soho da bin ich nun

Mache mir mal die Mühe etwas ausführliches z uschreiben

index.php

Code:

<?php
	error_reporting(E_ALL);
	include "config.php";	
?>
<html>
<head><title></title></head>
<body>
<?php
	include "menu.php";
          include "inhalt.php";
          include "footer.php";
?>
</body>
</html>

Kannst natürlich nochn Stylesheet reinbringen

hm jetzt könnte man sich ja fragen, was in der config.php steht die ganz am ist

config.php

Code:

<?php
	$dateien = array();
          $dateien['home'] = "home.html";
?>

Hier werden die Links eingebungen. Später musst du im Link nurnoch
<a href="index.php?section=home
schreiben, und php nimmt die definierte datei.

Tja, bleibt zu klären, wo home.html jetzt auftauchen soll.

inhalt.php

Code:

<?php
    if(isset($_GET['section']) AND isset($dateien[$_GET['section']])) {
        include $dateien[$_GET['section']];
    } else {
        include $dateien['home'];
    }
?>

mehr ist das ganze nicht.....

Anzeige

- Anzeige -

19.11.07, 12:12	#1 (permalink)
IsNull Guest Likes:	Page Layout Anzeige Hallo, Ich bin gerade am gestalten eines Webauftrits. Das Grundgerüst habe ich wie folgt festgelegt: Code: +-------------+ \| Logo & Nav \| +-------------+ \|Hauptinhalt \| \|(wechselbar) \| +-------------+ \| footer \| +-------------+ Ich möchte nun den oberen Teil (Logo & Nav) sowie den footer immer auf die gleiche Datei verlinken. (damit ich das Inhaltsverzeichnis zentral verwalten kann, und die Logo Grafik nur 1mal geladen/interpretiert werden muss) Wie stelle ich das nun am klügsten an? Möglichst nur html und css. JS möchte ich wenn möglich vermeiden. Ich habe zuerst an frames gedacht, nur müsste ich dann je nach dem, was in der Nav angeklickt wird, im Main frame etwas anderes anzeigen lassen. JS? Macht man sowas überhaupt mit frames? Gibt doch sicher ein paar hier, die sich mit webdesign etwas auskennen :) Ein paar Stichworte in die richtige Richtung würden schon reichen ;) Gruss & thx IsNull

19.11.07, 13:36	#4 (permalink)
lightsaver Moderator Registriert seit: 19.06.06 Likes: 52	ich würde es so machen: du machst deine einzelnen seiten. sagen wir mal, du hast ne datei impressum.php (nur ein beispiel für jede einzelne seite) in dieser impressum.php machst du ein Code: <? include ("nav.html"); ?> hier kommt jetzt in html der inhalt, also das was du als main bezeichnest <? include ("footer.html"); ?> und so machst du das dann halt auch mit allen anderen seiten. ach und nav.html und footer.html sollten vielleicht keine kompletten html-dateien sein, da du ja sonst probleme mit doppelten tags bekommst. theoretisch würde halt schon ne einfache txt zum includen reichen.

19.11.07, 16:53	#9 (permalink)
.:L Senior Member Registriert seit: 05.05.06 Likes: 24	kann dir nur php empfehlen. Du musst nichma php können, kannst alle sauslagern. Geht auch über include sprich:: Du machst ne Datei config.php da schreibst du alle beschreibungen -> Seiten rein und in dne Link auf den Seiten packste dann nurnoch die Bezeichnung zb: in der config.php steht $dateien['home'] = "home.html" dann schreibste in den link "href="index.php?section=home" hört sich bestimmt brutal an, is abe recht dufte leicht. Bei Interesse erlär ichs gerne genauer __________________ fat people are hard to kidnap

20.11.07, 16:01	#15 (permalink)
.:L Senior Member Registriert seit: 05.05.06 Likes: 24	Soho da bin ich nun Mache mir mal die Mühe etwas ausführliches z uschreiben index.php Code: <?php error_reporting(E_ALL); include "config.php"; ?> <html> <head><title></title></head> <body> <?php include "menu.php"; include "inhalt.php"; include "footer.php"; ?> </body> </html> Kannst natürlich nochn Stylesheet reinbringen hm jetzt könnte man sich ja fragen, was in der config.php steht die ganz am ist config.php Code: <?php $dateien = array(); $dateien['home'] = "home.html"; ?> Hier werden die Links eingebungen. Später musst du im Link nurnoch <a href="index.php?section=home schreiben, und php nimmt die definierte datei. Tja, bleibt zu klären, wo home.html jetzt auftauchen soll. inhalt.php Code: <?php if(isset($_GET['section']) AND isset($dateien[$_GET['section']])) { include $dateien[$_GET['section']]; } else { include $dateien['home']; } ?> mehr ist das ganze nicht..... __________________ fat people are hard to kidnap

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

19.11.07, 12:42	#2 (permalink)
lightsaver Moderator Registriert seit: 19.06.06 Likes: 52	wenn ich dein problem richtig verstanden habe, dann hatten wir eine ähnliche frage bereits: menü für eine website - wie realisieren

19.11.07, 14:12	#5 (permalink)
IsNull Guest Likes:	Ach so Danke, denke dies kann ich nun umsetzen. thx IsNull

19.11.07, 15:11	#7 (permalink)
ic3cu83z Registriert seit: 08.08.06 Likes: 0	Du könntest es auch komplett in HTML halten. Machst 1 Tabelle mit 100% Breite und Höhe. Darin eine weitere Tabelle mit 3 Reihen (1. header/menu, 2. mainFrame/Inhalt, 3. Footer). Diese Tabelle dann für 1. auf eine feste Pixelzahl (bspw. Höhe des Logos) festlegen. Das selbe machst Du mit dem Footer. Die Menüpunkte würde ich schon im Grundgerüst verlinken und als index.html speichern. Dann brauchst Du lediglich für die einzelnen Menüpunkte den Inhalt ändern und das Dokument dann jeweils speichern (about.html, etc). So sollte es auch klappen.

20.11.07, 10:26	#13 (permalink)
bLaCk-DrAg0n Registriert seit: 04.10.05 Likes: 0	ich weiss jetzt nicht wie groß der webauftritt werden soll. sollte deine Seite nicht mehr als 3 verschiedene pages haben, dann ignoriere meinen beitrag einfach ^^ Ich persönlich würde die Ganze sache mit einer Template Engine unter PHP lösen. Dies würde dir 1. mehr möglichkeiten bieten und 2. eine höhere Dynamik der Seite erlauben, wenn dies denn gewünscht ist. Zu PHP gibt es schon einige viele Engines die alle ihre Vor- und Nachteile haben. Am besten du schaust dir die Engine's selber mal an. Würde dir vLib empfehlen. ist für so kleine sachen recht gut PS: Nimm nicht Smarty... das wär für deine Zwecke 1. viel zu Overpowered und 2. ist es generell einfach zu langsam. die anderen kenne ich leider nicht :X

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Tastatur layout.	Noirzone	Linux/UNIX	8	28.04.07 14:44
Layout wie? container? Tabelle?	.:L	(Web-) Design und webbasierte Sprachen	7	18.08.06 11:36
Kigotix Layout	K!lLeR	(Web-) Design und webbasierte Sprachen	1	03.01.06 16:00
Kigotix Layout	K!lLeR	Internet Allgemein	1	03.01.06 16:00
FluxBox => Keyboard layout	keymaker	Linux/UNIX	4	22.12.05 17:09

[HaBo]

Page Layout