Webdesign in Siegen

Nächster Schritt zum erstellen einer Homepage ?

Fragen zum Thema HTML und CSS können hier gestellt werden

Moderatoren: Basti, Ingo

Nächster Schritt zum erstellen einer Homepage ?

Beitragvon Creativé am 15.11.2007, 18:32

Hallo,
Ich bin ein Neuling im Gebiet HTML und CSS. Ich habe bisher das Design für jede einzelene Seite mit PS entworfen ( auch gesliced ) und ein Basis-Layout erstellt (bei mir: Header,Navi,Content ; 3 Bilder) und die Bilder in 3 verschiedene Div Layer eingefügt.
Ich habe ein kleines Stylesheet entworfen wodrinn die Position und die Hintergrund Farbe der Seite bestimmt ist.

Nun meine Frage :
Was muss ich als nächstes tun ?
Wie krieg ich es hin ,dass wenn ich auf ein Link klicke ,sich nur die einzelnen Bereiche verändern aber das Basis Layout immer gleich bleibt ?

http://img138.imageshack.us/img138/8505/screensp2.jpg
Benutzeravatar
Creativé
Mitglied
 
Beiträge: 15
Registriert: 13.11.2007
Wohnort: Köln

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon NoTomorrow am 15.11.2007, 18:38

Mit ner php switch() und include() anweisung kann man das ganz gut machen. Gibt aber bestimmt auch noch andere wege :)

Hier ein tutorial: http://www.phpmac.com/articles.php?view=241

natürlich machst du dann an der stelle wo er
Code: Alles auswählen

...
echo "Products";
...


und so weiter schreibt, folgendes rein:

Code: Alles auswählen
...
include("products.php");
..


und in die products.php (oder wie auch immer du die datei dann nennst, ist ja egal) schreibst du dann deinen inhalt rein der angezeigt werden soll wenn man auf "products" drückt (nehmen wir mal an du hättest einen kopf der products heisst)
Benutzeravatar
NoTomorrow
Mitglied
 
Beiträge: 40
Registriert: 15.11.2005

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon Creativé am 15.11.2007, 19:03

danke ich werds mal ausprobieren
Benutzeravatar
Creativé
Mitglied
 
Beiträge: 15
Registriert: 13.11.2007
Wohnort: Köln

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon Elchi3 am 15.11.2007, 19:11

Nabend,
ich hätte jetzt einfach die HTML Datei des Basis-Layouts kopiert, und diese dann verlinkt.
So kannst du dann in jede der einzelnen Dateien den individuellen Text hineinschreiben.
Zum Beispiel der Code für dein Kontakt-Button:

Code: Alles auswählen
<a href="http://squaba.de/kontakt.html"><img src="dein_kontakt_button_bild.jpg" /></a>


Wenn du jetzt auf Kontakt klicken würdest öffnet sich die kopierte Basis-Datei(jetzt zB. kontakt.html) in der du die Kontaktdaten hineinschreiben kannst.

Mit einfachem HTML geht es auch, ich hoffe mal das ist es was du meinst :o0:
Die PHP-Methode ist natürlich auch nicht schlecht.Ich denk aber mal das du dir es auch nicht unnötig kompliziert machen willst, oder?

Gruß
<Elchi3>
Wir ertrinken in Informationen, aber wir hungern nach Wissen.
Elchi3
Mitglied
 
Beiträge: 20
Registriert: 11.11.2007
Wohnort: Verden

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon NoTomorrow am 15.11.2007, 19:21

Elchi3 hat geschrieben:Nabend,
ich hätte jetzt einfach die HTML Datei des Basis-Layouts kopiert, und diese dann verlinkt.
So kannst du dann in jede der einzelnen Dateien den individuellen Text hineinschreiben.
Zum Beispiel der Code für dein Kontakt-Button:

Code: Alles auswählen
<a href="http://squaba.de/kontakt.html"><img src="dein_kontakt_button_bild.jpg" /></a>


Wenn du jetzt auf Kontakt klicken würdest öffnet sich die kopierte Basis-Datei(jetzt zB. kontakt.html) in der du die Kontaktdaten hineinschreiben kannst.

Mit einfachem HTML geht es auch, ich hoffe mal das ist es was du meinst :o0:
Die PHP-Methode ist natürlich auch nicht schlecht.Ich denk aber mal das du dir es auch nicht unnötig kompliziert machen willst, oder?

Gruß
<Elchi3>



Ich halte deine methode eher für unnötig kompliziert :/ Überleg mal. Wenn du jede seite einzeln machst, muss er jedes mal wenn er einen link oder eine grafik ändert, auch jede einzelne seite ändern. Die php Methode ist einfach cleaner, schneller und einfacher zu verwalten, da man nur eine Html Datei mit dem Design hat, und der Rest besteht aus stumpfen Dateien mit Inhalt die dynamisch eingebunden werden.
Wenn man das mit dem php einmal versteht ist es auch echt einfach. Man muss sich nur drauf einlassen und darf nicht gleich denken, dass alles zu kompliziert ist. :wink:
Benutzeravatar
NoTomorrow
Mitglied
 
Beiträge: 40
Registriert: 15.11.2005

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon Creativé am 15.11.2007, 19:26

danke elch
aber wenn ich das tue dann wird ja die seite mit den gesamten bildern des Basis Layout wieder neu geladen und das dauert....
was ich will ist dass wenn ich jetzt z.B auf Kontakt klicke , die Seite nur z.b das Script des Kontaktfomulars laden muss. Nicht aber den gesamten Hintergrund nocheinmal?

Ansonsten hätte ich ja einfach die 6 verschiedenen Seiten entwerfen können , slicen und verlinken ( was ich am anfang auch gemacht habe ) aber das dauert beim laden bestimmt eine Ewigkeit.


Ich such lieber mehr Infos zu den Php Möglichkeiten :) danke trotzdem




@noto
Wie häng ich mit Dreamweaver die PhP datei an die Homepage an , das diese auch erkennt das das php document für sie gedacht ist ?
Benutzeravatar
Creativé
Mitglied
 
Beiträge: 15
Registriert: 13.11.2007
Wohnort: Köln

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon NoTomorrow am 15.11.2007, 20:30

Du musst die Dateien nicht anhängen. Sie müssen nur im selben Ordner sein. Ich schreib dir den code mal hin. Ist nicht viel!

Das sollte auf dem webserver am ende drauf sein:
index.html (das ist die datei mit der grafik und den links etc.)
kontakt.php ( Hier ist einfach nur stumpfer text oder verlinkte bilder drin. Muss nicht .php sein, kann auch was anderes sein zb. HTML. Wichtig ist aber dass du hier wirklich nur den text rein machst und nicht das design nochmal! Das musst du nicht.)
preise.php
was_auch_immer.php
[..und so weiter..]

So jetzt kommen die links in der index.html. Die hast du bestimmt schon reingemacht. du musst nur, und das ist das wichtige, folgendes schreiben:

Code: Alles auswählen
<a href="index.html?inhalt=kontakt"> Hier kommt dann das bild hin oder ein Text den man anklicken kann. </a>


Das machst du für jeden link. Am wichtigsten ist aber: ?inhalt=kontakt. Damit übergibst du der variable $inhalt den wert kontakt. Was das bringt zeig ich gleich. Also, jeder link kriegt jetzt dieses ?inhalt=kontakt, nur heisst es dann bei dem preise link natürlich ?inhalt=preise usw...

Soo, jetzt gehst du genau an die stelle, wo der text stehen soll im code. Wenn du dreamweaver benutzt klick einfach dahin wo der text stehen soll und guck dann im Code fenster, der Cursor sollte dann an der richtigen stelle blinken.. Geh aber auf nummer sicher indem du mal testweise was in den Code schreibst und guckst ob es dann an der richtigen stelle erscheint. Wenn du die richtige stelle gefunden hast fügst du die Switch anweisung ein:

Code: Alles auswählen
<?php
switch($inhalt){
    case "kontakt":
        include("kontakt.php"); // In den anführungszeichen steht die datei die aufgerufen werden soll! Hier kontakt.php
        break;
       
    case "preise": // wenn inhalt = preise ist, wie in diesem fall, wird preise.php aufgerufen
        include("preise.php");
        break;

    case "bla": // hier noch ein Beispiel damit du verstehst wie wie das ganze aufgebaut ist. für jeden weiteren link einfach die drei Zeilen mit case, include und break einfügen und anpassen.
        include("bla.php");
        break;
       
    default: // default wird aufgerufen wenn garnichts in $inhalt steht. das passiert zum beispiel wenn der user zum ersten mal auf deine seite kommt.
        include("news.php");
        break;
?>


Switch() guckt sich die variable $inhalt an und entscheidet dann mit include() welche seite aufgerufen werden soll. Wenn du jetzt mehr links machst muss du wie gesagt einfach nur ?inhalt=blabla in dem link ändern und die drei befehle in die switchanweisung einfügen. Das was bei Include() in den klammern steht wird dann in die HTML datei geladen und muss deswegen auch im gleichen ordner sein und genau so heissen wie du es reinschreibst. Wenn die Datei nicht im gleichen ordner ist schreibst du ganz normal wie bei einem Link auch wo sich die datei befindet.

Ich hoffe ich konnte dir helfen.. bin selber noch neu auf dem Gebiet. Wenn du alles richtig machst sollte das auf jeden fall klappen ;) Wenn jemand merkt, dass da was falsch ist, bitte sagen..

Gruß NoTo
Benutzeravatar
NoTomorrow
Mitglied
 
Beiträge: 40
Registriert: 15.11.2005

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon Creativé am 15.11.2007, 21:58

wow danke das du dir soviel mühe gemacht hast :D ja es hat mir sehr viel weiter geholfen ;)
/ja ich benutze dreamweaver

Aber nur noch einmal zur Kontrolle:
1.In den Index.html die verlinkungen reinschreiben , das halt die bilder der navi leiste (home,preiseblabla)zu den jeweiligen seiten springt.
Code: Alles auswählen
<a href="index.html?inhalt=home"><img src="../Navi Bilder/Bilder/Navi_11.gif" width="100" height="36"> </a>

(hab mich entschieden das die index seite eine "vorseite" wird mit Enter button blabla ;) )

2.Die Grafiken der jeweiligen Seiten (z.B für Preise) den Text und das Subnavi in eine .php datei einbauen und diese preise.php nennen

3.In die index.html datei in den head bereich folgendes reinschreiben?
Code: Alles auswählen
<?php
switch($inhalt){
    case "home":
        include("home.php");
        break;
?>



Richtig so ?
sorry wenn ich da etwas dumm rüber komme aber hab halt fast 0 plan :)
Benutzeravatar
Creativé
Mitglied
 
Beiträge: 15
Registriert: 13.11.2007
Wohnort: Köln

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon NoTomorrow am 15.11.2007, 22:20

Creativé hat geschrieben:
3.In die index.html datei in den head bereich folgendes reinschreiben?
Code: Alles auswählen
<?php
switch($inhalt){
    case "home":
        include("home.php");
        break;
?>



1. Nicht in den Header, sondern in den Body, genau da wo der Text nacher erscheinen soll. Du kannst einfach mitten in den body <?php schreiben, das macht garnichts.

2. Bei switch nie default vergessen.. ansonsten passt alles ^^ viel spass
Benutzeravatar
NoTomorrow
Mitglied
 
Beiträge: 40
Registriert: 15.11.2005

Re: Nächster Schritt zum erstellen einer Homepage ?

Beitragvon Creativé am 15.11.2007, 22:27

ich werde es mal ausprobieren und dann hier posten wo meine fehler liegen :) falls es welche gibt ;)
aja danke ;)
mfg Creativé
Benutzeravatar
Creativé
Mitglied
 
Beiträge: 15
Registriert: 13.11.2007
Wohnort: Köln


Zurück zu HTML/CSS

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast