• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Elemente einer Seite (z. B. Navigation) auslagern

G

GerdB51

Neues Mitglied
Hallo,
nachdem ich meine Homepage jahrzehntelang als Frame-Seite betrieben habe (www.hsvfan-oberpfalz.de), bin ich jetzt dabei, sie mit HTML und CSS neu zu gestalten. Ich blicke auch schon etwas durch, bin aber trotzdem nach der langen Zeit immer noch Laie. Mich stört bei der neuen Gestaltung mit der Trennung von HTML und CSS etwas, dass ich auf jeder Seite auch die wiederkehrenden Inhalte wie Kopf, Fuss und Steuerung jedesmal wieder mit eingeben muss. Dass war mit Frames einfacher..... Falls ich jetzt z. B. einen Link in der Navigation ändern will, muss ich diese Änderung auf allen 450 Seiten vornehmen.
Gibt es eine Möglichkeit, z. B. über Javascript, externe Datei einbetten oder sonstwas, die entsprechenden Inhalte von Kopf, Fuß, Steuerung "auszulagern", so dass ich etwaige Änderungen nur einmal vorzunehmen brauche? Wenn möglich, ohne PHP, da sind meine Kentnnisse nur rudimentär.
 
Werbung:
Ja gibt es. Du lädst die verschiedenen Unterseiten per Ajax in deinen Container rein, wo der Content hin soll. Klicke ich in der Naigation also auf einen Button, lädt er die Seite in den Hauptcontainer. So brauchst du nur noch eine Seite, auf der die Navigation, etc. ist. Und der Rest wird einfach in den Content-Container reingeladen. Du sparst dir im übrigen auch die Ladezeiten.
 
Werbung:
Warum würdest du da PHP vorziehen?
Alles was du brauchst ist:

Code: 
$("a").click(function () {
   var link = $(this).attr("href");
   $.get(link, function(data) {
      $('.content-container').html(data);  
   });
});
Außerdem ist eine Google-Indexierung jeder Seite (meistens) möglich.
 
m.scatello schrieb:
Ich würde nur in Notfällen die Funktionalität einer Seite von JavaScript abhängig machen.
Zum Vergrößern anklicken....
Ok seh ich ein. Man kann schließlich Javascript deaktivieren. Dennoch machen es viele moderne Seite mittlerweile mit Ajax. Und mal ganz im ernst, wer Javascript deaktiviert, ist auch selber schuld wenn nichts mehr funktioniert.

m.scatello schrieb:
Außerdem kommt es oft genug vor, dass sich nicht nur der Content ändert.
Zum Vergrößern anklicken....
Inwiefern?
 
Werbung:
Z.B. die Navigation, bei der die aktuelle Seite markiert wird, bzw Breadcrumb. Oder der Seitentitel, oder, oder, oder...
 
Danke für die Ratschläge, hilft mir aber momentan nicht wirklich weiter. Denn wie ich schon schrieb, bin ich in weiten Teilen Laie. Mit PHP habe ich mich nur am Rande beschäftigt und für Ajax brauche ich auch (wenn ich es richtig verstehe) PHP. Ich muss mir doch dafür einen "virtuellen" Server auf dem PC installieren und sichergehen, ob mein Anbieter das unterstützt?? Und bei Javascript (das ich auch nur sehr brucstückhaft beherrsche), besteht wie bereits in einem Kommentar erwähnt, dass eine (immer kleiner werdende) Anzahl benutzer diese Funktion deaktiviert haben.
Ich hatte, gehofft, dass es vielleicht eine "einfachere" Lösung gibt. Werde mich doch noch mit der neuen Materie befassen müssen. Vielleicht käme ich ein Stück weiter, wenn ich wüsste, wie die genaue Synthax (in Ajax und Javascript) lautet. Wäre schön, wenn mir jemand den genauen Weg beschreiben könnte. Z. B. wenn in der Datei "navi.html" linker Teil) im rechten Bereich (Container?) die Datei "start.hmtl" erscheinen soll. (Also quasi ein 2-Spalten-Layout mit Kopf- und Fußbereich). Vielleicht begreife ich dann die Sache etwas mehr.
Nochmals danke für die bisherige Hilfe!
 
Klingt gut, kann ich aber noch nicht testen. Wenn ich die im Netz oft beschriebenen Test-Möglichkeiten ausprobiere (phpinfo(); oder echo "Hello World";), dann erscheint nach dem Hochladen nur die jeweilge 3zeilige Synthax, aber nicht das erhoffte Ergebnis. Ich kann aber meinem Provider erst morgen kontaktieren, ob sie PHP auf dem Server anbieten. Der Betreiber ist ein Bürgernetzverein (Asamnet), der von Ehrenamtlichen betreut wird und an Sonn- und Feiertagen nur eine Hotline für Notfälle bereit hält. Aber ich glaube, dein Vorschlag kommt meiner gewünschten Lösung sehr nahe.
 
Werbung:
Dein Testscript hat aber die Extension .php? Mit .htm oder .html wird PHP nicht geparst.

Laut der Internetseite von Asamnet
Mysql Datenbank
Dies ist eine SQL Datenbank und wird benötigt um ein CMS (Content Management System) auf Ihrer Internetseite zu betreiben. Diese Datenbank ist auch kostenfrei mit dabei!
Zum Vergrößern anklicken....
Und somit muss dort auch PHP funktionieren.

Und wer lesen kann, ist klar im Vorteil. Ebenfalls auf der Internetseite von Asamnet
Dateiname
Alle Dateien sollten mit .html enden, sofern sie php verwenden, enden die Dateien mit .php
Es wird zwischen Groß- und Kleinschreibung unterschieden. Die Dateien "index.html" und "INdex.html" sind also zwei verschiedene Dateien.
Verzichten sie auf Leerzeichen in Dateinamen
Verzichten sie auf Umlaute und ausgefallene Sonderzeichen. Bindestriche und Unterstriche sind in Ordnung. Auf z. B. Klammern und Anführungszeichen sollten sie verzichten.
Zum Vergrößern anklicken....
 
Zuletzt bearbeitet von einem Moderator:
da habe ich mich wirklich blöd angestellt. Ich hatte zwar die richtige Extension, habe aber den Text in die Entwurfsansicht kopiert und nicht in die Code-Ansicht geschrieben. Dadurch wurde der Code "zerschossen" und mit unsinnigen Tags versehen. Ich bin jetzt einen Schritt weiter. Danke!
Ich hab mal gleich in einem Beispiel versucht, include anzuwenden. Auf der lokalen Festplatte wird der 3zeilige Code zwar gespeichert, aber auf der hochgeladenen Seite ist er nicht dabei. Außerdem sind, wenn ich die Datei als php abspeichere, in der Onine-Version sämtliche CSS-Formatierungen weg, die Seite erscheint z. B. in weiß mit schwarzer Schrift und alle Poitionierungen sind verschwunden. Wahrscheinlich auch wieder irgendein dummer Fehler von mir.
 
Du musst uns schon deinen Quellcode zeigen und idealerweise einen Link zu deiner Seite
 
Werbung:
Es scheint jetzt zu funktionieren! Zumindest bei der Probedatei passte alles (etwas "verschobene" Formatierungen kann ich noch korrigieren. Ich schick trotzdem mal die Links zu den Test-Dateien. Aussehen sollte die Seite wie www.hsvfan-oberpfalz.de/start2.htm. Die neu erstellte PHP-Datei lautet www.hsvfan-oberpfalz.de/start2.php und die einzufügende Seite www.hsvfan-oberpfalz.de/fram2.php. Wenn Du Lust hast, kannst Du vielleicht einen Blick darauf werfen.
Danke nochmals für die bereits geleistete Hilfe.
 
So wie du es machst, zerschießt du dir deinen HTML-Code. In der frame2.php gehört nur die Navigation, kein Doctype, Head und body, also nur von <ul> bis inkl. </ul>

Und wenn du schon umbaust, dann bitte konsequent. Stelle um auf HTML5 und nutze UTF-8
 
Werbung:
Danke, Du hast mir entscheidend weitergeholfen. Da jetzt das Einbinden einer externen Datei passt, kann ich mich an die anderen Sachen UTF-8 und HTML5 heranwagen, obwohl ich hier auch noch einmal bei Null anfangen muss. Es kann also durchaus sein (sogar höcshtwahrscheinlich), dass ich demnächst wieder Hilfe brauche.
 
Die Umstellung auf UTF-8 ist ja eigentlich kein Problem, du musst nur drauf achten, dass du die Datei auch im UTF-8 Format speicherst, das können alle halbwegs moderne Editoren.
Und auf HTML 5 umstellen kannst du ja Step by Step machen, zuerst einmal das Grundgerüst beachten:
HTML: 
<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <title>Titel</title>
  </head>
  <body>
  </body>
</html>
 
Speichern in UTF-8 dürfte kein Problem sein, da (wie gerade gesehen habe), mein Editor dies standardmäßig vorgibt. Ich verwende den (veralteten Microsoft Expression Web 4. Zu Beginn bis zur Einstellungmachte ich meine Seiten in Frontpage. Beim Umstieg habe ich dann das dortige Format (charset=iso-8859-1) mit übernommen und nur gelegentlich geändert. Das "umrüsten" dürfte also mein geringstes Problem sein..... Und das Grundgerüst im HTML5 habe ich auch kapiert. Also frei nach Fehlfarben: "es geht voran".
Dank Dir.
 
Werbung:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben