✔ Wie kann man HTML Elemente per externen Datei einblenden?

son gohan

son gohan

Erfahrenes Mitglied
Hallo,

ich frage mich ob man irgendwie ein Teil von einer HTML Datei rausschneiden kann, wie z.B. eine aufwendige Navigation die auf allen Projektseiten gleich aussieht, und dann diesen ausgeschnitten Teil in eine externe Datei packen kann, um diese dann wieder verkürzt durch eine Adresse zu dieser Datei in der eigentlichem HTML anzeigen kann.

Also so ähnlich wie bei einer CSS Datei, welche man mit allen Befehlen. Das hat ja auch den Vorteil das alles dann einmal im Cache des Browser gespeichert wird und somit auch die Ladezeit verkürzt wird.

Ich habe nämlich zwei Navigationsmenüs links und rechts in meine Seite eingebaut und wollte nun diese halt ausschneiden und in eine extra Datei packen und dann mit einer Adresse zu dieser Datei wieder anzeigen lassen, somit wäre der Quelltext kürzer und mein Ziel erreicht.

Hat jemand meine Frage verstanden und kann mir helfen?

Vielen Dank im Voraus.
 
Ja das stell doch kein Problem dar oder?

1. Man erstell eine index Datei (index.php)
<table>
<tr><td>
PHP: 
include("datei mit linker navigation");
</td>
<td>
PHP: 
include("datei mit der eigentlichen seite");
bzw. hier der seiteninhalt
</td>
<td>
PHP: 
include("datei mit rechter navigation");
</td>
</tr>
</table>

Du hast so deine Navigationen in 2 Dateien die du einfach dan mittels include in deine dokumente einbindest!
 
Hallo Lukasz,

vielen Dank für deine Hilfe. Also meine Navigatinsmenüs sehen so aus
einmal das rechte menü:
HTML: 
<div id="rightmenu">
<a href="beauty.html" onfocus="if(this.blur)this.blur()">Beauty &amp; Wellness</a>
<a href="haustier.html" onfocus="if(this.blur)this.blur()"> Haustier &amp; Hobby</a>
<a href="buro.html" onfocus="if(this.blur)this.blur()"> Schreibwaren &amp; Büro</a>
<a href="kredit.html" onfocus="if(this.blur)this.blur()"> Kredite &amp; Versicherungen</a>
<a href="essen.html" onfocus="if(this.blur)this.blur()"> Essen &amp; Trinken</a>
<a href="kind.html" onfocus="if(this.blur)this.blur()"> Kind &amp; Baby</a>
<a href="finanzen.html" onfocus="if(this.blur)this.blur()"> Immobilien &amp; Finanzen</a>
<a href="mode.html" onfocus="if(this.blur)this.blur()"> Mode &amp; Accessoires</a>
<a href="musik.html" onfocus="if(this.blur)this.blur()"> Musik</a>
<a href="flirten.html" onfocus="if(this.blur)this.blur()">Flirten &amp; Dating</a>
<a href="casino.html" onfocus="if(this.blur)this.blur()"> Lotterien &amp; Sportwetten</a>
</div>

und hier das linke:
HTML: 
<div id="leftmenu">
<a href="auto.html" onfocus="if(this.blur)this.blur()"> <img src="jpg/auto2.jpg" width="50" height="40" border="0" alt="Auto & Moto"></a>
<a href="geschenke.html" onfocus="if(this.blur)this.blur()"><img src="jpg/geschenke2.jpg" width="50" height="40" border="0" alt="Geschenkideen"></a>
<a href="handy.html" onfocus="if(this.blur)this.blur()"> <img src="jpg/handy2.jpg" width="50" height="40" border="0" alt="Handy, Telefon & Fax"></a>
<a href="haus.html" onfocus="if(this.blur)this.blur()"><img src="jpg/haus2.jpg" width="50" height="40" border="0" alt="Haus & Garten"> </a>
<a href="haushalt.html" onfocus="if(this.blur)this.blur()"> <img src="jpg/haushalt2.jpg" width="50" height="40" border="0" alt="Schreibwaren & Büro"></a>
<a href="buro.html" onfocus="if(this.blur)this.blur()"> <img src="jpg/buro2.jpg" width="50" height="40" border="0" alt="Schreibwaren & Büro"> </a>

Wie du siehst habe ich es alles mit CSS gemacht, ich hoffe das wird auch keine Probleme machen?

Jetzt will ich mal erklären wie ich dich verstanden habe, bitte korikiere mich, falls ich was falsch verstanden habe.

Ich nehme also einfach diese Beiden Menüs, so wie ich Sie jetzt in den zwei Beispielen oben gezeigt habe und erstelle daraus jeweils zwei php Dateien z.B. links.php und rechts.php ? Ich muss auch nicht dazu schreiben wenn ich die Stellen ausschneide und in die php Datei stecke, ich nehme also den reinen originalen text von Quelltext?

Wenn ich die beiden Dateien erstellt habe, dann füge ich einfach an die beiden stellen wo vorher mein Quelltext war, die einzelnen Adressen zu meinen erstellten php Dateien hinzu. z.B. <div id="leftmenu"> http://www...de/links.php </div> und
<div id="rightmenu"> http://www...de/rechts.php </div>?

Habe ich bis hier hin alles richtig gemacht, ich bin nämlich absoluter Anfänger in PHP?
Wenn ich alles richtig gemacht habe, dann müste jetzt meine beiden Menüs genauso erscheinen wie vorher als ich noch den original Code im Quelltext hatte, aber was ist mit Höhenangaben usw. werden die auch alle übernommen und funktioniert das auch alles mit CSS zusammen in allen Browsern?

Es wäre echt nett wenn du mir nochmal helfen kannst.
 
Du mußt das schon mit include('links.php'); an der Stelle machen, an der der Text erscheinen soll. Ansonsten scheinst du es richtig verstanden zu haben. Da der Client am Ende das Gleiche präsentiert bekommt, bleiben auch die Höhenangaben etc. erhalten. Und das mit CSS ist schon der richtige Weg, Tabellen sind ja nicht dafür da, eine Seite zu gestalten bzw. zu unterteilen..
 
Hallo,

ich habe jetzt mal lokal auf meinem Rechner eine Seite genommen und dort den gesamten Code für die Navigation rausgeschnitten.

Dann habe den Text einfach in eine Textdatei gesteckt und als php Datei abgespeichert.
Und das alles im gleichen odrner wie alle anderen HTML Datei gelegt.

Aber irgendwas stimmt wohl nicht. An der Stelle wo vorher meine Navigation war, habe ich dan folgendes geschrieben:

HTML: 
<div id="rightmenu">
include('rechts.php');
</div>

Die rechts.php ist wie bereits erwähnt in dem gleichen Ordner wie alle anderen Dateien und daher muss die Adresse doch erst mal stimmen, was kann ich sonst falsch gemacht haben?

Ich kenne mich ja auch überhaupt nicht aus mit PHP Befehlen und Links aber so schwer kann das doch nicht sein?
 
Welche Fehlermeldung wird denn angezeigt? Hast du deine "Hauptdatei" auch als .php gespeichert bzw. deinem Webserver klargemacht, daß die auch von PHP geparst werden soll?
 
Na ich würde dir empfehlen, dich erst mal mit den Grundlagen der Programmierung, und dann mit den Grundlagen vpn PHP auseinander zu setzen. Da gibt es ne Menge gute Bücher drüber.
 
Ups.. Die einfachsten Dinge übersieht man...
PHP: 
<div id="rightmenu">
<?php include('rechts.php'); ?>
</div>

Aber ein paar Grundlagen solltest du dir schon schaffen, da gebe ich meinem Namensvetter recht..
 
Hallo,


also erst mal vielen Dank für eure Hilfen. Ich will ja eigentlich nur diese ein Sache hinbekommen und glaube nicht das das so aufwendig sein kann damit ich jetzt ein ganzes Buch lesen muss?

Ich habe zwar keine Ahnung von PHP aber dafür etwas von HTML und CSS und mit eurer Hilfe bekomme ich das sicher hin.

Also ich denke den ersten Fehler muss ich woll in meiner php Datei haben, den ich weis ja auch nicht genau wie man die schreibe muss, vielleicht habe ich ja irgendwelche Sachen dort vergessen? Deshalb hier der Auszug aus meiner gesamten rechts.php Datei:
HTML: 
<a href="beauty.html" onfocus="if(this.blur)this.blur()">Beauty &amp; Wellness</a>
<a href="haustier.html" onfocus="if(this.blur)this.blur()"> Haustier &amp; Hobby</a>
<a href="buro.html" onfocus="if(this.blur)this.blur()"> Schreibwaren &amp; Büro</a>
<a href="kredit.html" onfocus="if(this.blur)this.blur()"> Kredite &amp; Versicherungen</a>
<a href="essen.html" onfocus="if(this.blur)this.blur()"> Essen &amp; Trinken</a>
<a href="kind.html" onfocus="if(this.blur)this.blur()"> Kind &amp; Baby</a>
<a href="finanzen.html" onfocus="if(this.blur)this.blur()"> Immobilien &amp; Finanzen</a>
<a href="mode.html" onfocus="if(this.blur)this.blur()"> Mode &amp; Accessoires</a>
<a href="musik.html" onfocus="if(this.blur)this.blur()"> Musik</a>
<a href="flirten.html" onfocus="if(this.blur)this.blur()">Flirten &amp; Dating</a>
<a href="casino.html" onfocus="if(this.blur)this.blur()"> Lotterien &amp; Sportwetten</a>

Wie man sieht habe ich einfach den realen Quelltext ausgeschnitten ohne div Tags und in die Datei eingefügt und mit dem Namen rechts.php getauft. Habe ich den bis dahin die PHP Datei richtig erstellt?

Dann habe ich ja einfach dort wo der Quelltext des Linkmenüs im div Tag war versucht die Adresse zur PHP Datei einzugeben, damit der Browser den Weg dort hin findet und die Datei einlesen tut.
So sah es im Quelltext meiner Testseite vorher aus:
HTML: 
<div id="rightmenu">
<a href="beauty.html" onfocus="if(this.blur)this.blur()">Beauty &amp; Wellness</a>
<a href="haustier.html" onfocus="if(this.blur)this.blur()"> Haustier &amp; Hobby</a>
<a href="buro.html" onfocus="if(this.blur)this.blur()"> Schreibwaren &amp; Büro</a>
<a href="kredit.html" onfocus="if(this.blur)this.blur()"> Kredite &amp; Versicherungen</a>
<a href="essen.html" onfocus="if(this.blur)this.blur()"> Essen &amp; Trinken</a>
<a href="kind.html" onfocus="if(this.blur)this.blur()"> Kind &amp; Baby</a>
<a href="finanzen.html" onfocus="if(this.blur)this.blur()"> Immobilien &amp; Finanzen</a>
<a href="mode.html" onfocus="if(this.blur)this.blur()"> Mode &amp; Accessoires</a>
<a href="musik.html" onfocus="if(this.blur)this.blur()"> Musik</a>
<a href="flirten.html" onfocus="if(this.blur)this.blur()">Flirten &amp; Dating</a>
<a href="casino.html" onfocus="if(this.blur)this.blur()"> Lotterien &amp; Sportwetten</a>
</div>

Und so sieht es jetzt aus an der Stelle in meiner Testseite nachdem ich den Quelltext des Linkmenüs rausgeschnitten habe und in die rechts.php Datei gelegt habe aus:

HTML: 
<div id="rightmenu">
<?php include('rechts.php'); ?>
</div>

Wie ihr sieht habe ich diemal auch den Link richtig geschrieben, aber es wird nichts an der Stelle angezeigt, Gedanklich kann ich es ja etwas nachvollziehen, das der Browser einfach diese Datei sucht und dort dann den Inhalt eingibt, wenn er Sie den gefunden hat.

Finden müste der Browser aber doch die rechts.php Datei oder habe ich den PFad falsch angegeben, oder muss die ganze Sache vielleicht auch erst mal auf ein Server geladen werden?

Die Seite in der ich den vorherigen kurzen PHP Link eingefügt habe befindet sich im gleichen Ordner wie meine rechts.php Datei, also muss die Pfadangabe doch nicht länger oder kürzer sein als von mir angegeben und soweit der PHP Link auch richtig geschrieben ist, müste doch dann der Fehler in der rechts.php Datei liegen?
 
Wenn er die Datei nicht fände, würdest du eine Fehlermeldung erhalten. Die Datei rechts.php ist soweit richtig geschrieben.
Leider hast du meine Frage noch nicht beantwortet, ich vermute, daß da eher der Fehler liegt:
Hast du deine "Hauptdatei" auch als .php gespeichert bzw. deinem Webserver klargemacht, daß die auch von PHP geparst werden soll?
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück