Pawlita.de Support Forum. Alles zu den Skripten von Pawlita.de, Tipps und Tricks und PHP.

Senca · 14.3.2010 23:27

Hi Leute
bin leider neu hier und habe leider null plan von Php.
Ich möchte ein Homepage für meine Freundin und mich gestalten momentan ist alles auf Html und einigen eingebunden scripts die fertig sind.
Da ich bis jetzt Codes bekommen habe und alles für "Idioten sicher" erklärt wurde habe ich eigentlich alles erfolgreich beenden können.
o.O Leider nur... entweder bin ich zu blind und zu doof gerade einen Code zu finden oder meine nerven brechen gerade zusammen was um diese Uhrzeit vllt nicht mal schlimm wäre.

Jedenfalls habe ich eine bestehende HTML Seite, nur möchte ich eben das die Gallerie innerhalb der dargstellten Seite präsentiert wird.

Habe eigentlich einige threads hier angeschaut o.o nur habe ich weder einen Iframe noch include ich was.
Zumindest denke ich das.

Vielleicht sollte ich erwähnen das ich eben noch nichts hochgeladen habe, ich wollte eigentlich erst alles auf den Webspace laden wenn die Komplette Page fertig ist o.o könnte allerdings die Gallerie auf einen anderen Webspace testen o.o
Nur dann habe ich eben immer noch keinen Code den ich in der Html datei einbinden könnte.

Freue mich auf antworten bitte nicht so hart sein bin leider eben auf diesen gebiet noch ein Anfänger naja vllt nichtmal das <.<

Gruß Senca

Werbung · 14.3.2010 23:27

Chakky · 15.3.2010 17:57

hi,

da die galerie auf php basiert kannst du das lokal nur testen wenn du auch einen webserver installiert hast der php versteht....

mal kurz gesagt die galerie kannste einbinden über einen iframe (ist die einfachste, aber teilweise auch unsaubere lösung)

mit folgenden code:

Code:

<iframe src="link/zur/galerie.php" width="800" heigth="600"></iframe>

wäre jetzt ganz primitiv....

lad die galerie erstmal auf deinen webspace versuch sie so zu laufen zu bringen, wenn du da probleme hast. melde dich wir helfen dir gerne, und danach binden wir das in deine seite ein

Senca · 15.3.2010 18:14

Hi leute erstmal danke für deine Antwort Chakky,
Ich hatte die Gallerie mal hochgeladen hab sie auch per iframe mal eingebunden
Hat auch geklappt aber sieht leider irgendwie Banane aus <.<

Hier als visuelle ansicht:

http://devy.bplaced.net/braysign/test2.jpg

Hatte eben auch die Größe verändert weil sonst wäre es unter dem Content Bereich.
Gibt es vllt auch eine andere Lösung wie man eine Gallerie einbinden könnte das sie sichtbar ist ?

Chakky · 15.3.2010 19:55

könntest mit prozent arbeiten also

Code:

<iframe src="zur galerie.php" height="100%" width="100%"></iframe>

und damit so rumprobieren

Senca · 15.3.2010 20:25

Habe nun versucht den Content Bereich zu vergrößern doch irgendwie ._. klappt wohl doch nicht...
Ich möchte nur ungern den Code hier rein schreiben <.< wobei ich nicht mal weiß ob ich das darf aber vllt erkennt ja einer den fehler wenn ich den Code hier poste. Nur wie Gesagt weiß ich nicht ob ich es darf wenn ja mach ich es mal.

Chakky · 15.3.2010 20:34

warum darfst du das nich? immerher damit

Senca · 15.3.2010 20:56

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sarah+Benny ~ Gallerie</title>
<style type="text/css"> 
<!-- 
body  {
  font: 100% Verdana, Arial, Helvetica, sans-serif;
  background: #FFFFFF;
  margin: 0; /* Es empfiehlt sich, margin (Rand) und padding (Auffüllung) des Body-Elements auf 0 einzustellen, um unterschiedlichen Browser-Standardeinstellungen Rechnung zu tragen. */
  padding: 0;
  text-align: center; /* Hierdurch wird der Container in IE 5*-Browsern zentriert. Dem Text wird dann im #container-Selektor die Standardausrichtung left (links) zugewiesen. */
  color: #000000;
}

/* Tipps für elastische Layouts:
1. Da die Gesamtgröße elastischer Layouts von der Standardschriftgröße des Benutzers abhängt, sind diese Layouts weniger berechenbar. Bei korrekter Verwendung haben sie außerdem für Personen, die größere Schriften benötigen, einen höheren Nutzwert, weil die Zeilenlänge proportional bleibt.
2. Die Größe der divs in diesem Layout basiert auf der Originalschriftgröße (100%) im Body-Element. Wenn Sie die Textgröße durch eine Einstellung wie font-size: 80% im Body-Element oder im #container global verringern, wird das gesamte Layout proportional verkleinert. Sie sollten die Breiten der verschiedenen divs vergrößern, um hierfür einen Ausgleich zu schaffen.
3. Wenn Sie in den einzelnen divs unterschiedliche Werte für die Schriftgröße angegeben, anstatt die Schriftgröße im Design global zu ändern (z. B. wenn #sidebar1 die Schriftgröße 70% zugewiesen wird und #mainContent die Größe 85%), so wird die Gesamtgröße der einzelnen divs proportional geändert. Sie sollten anhand der endgültig gewählten Schriftgröße entsprechende Anpassungen vornehmen.
*/
.thrColElsHdr #container { 
  width: 1125px;  /* Mit dieser Breite wird ein Container erstellt, der in ein 800 Pixel breites Browserfenster passt, sofern für den Text die Standardschriftgröße des Browsers übernommen wird. */
  background: #FFFFFF;
  margin: 0 auto; /* Durch automatische Ränder (in Verbindung mit einer Breite) wird die Seite zentriert. */
  border: 0;
  text-align: left; /* Hierdurch wird die Einstellung text-align: center im Body-Element überschrieben. */
} 
.thrColElsHdr #header { 
  background: #FFFFFF; 
  padding: 0 10px;  /* Diese Auffüllung entspricht der linksbündigen Ausrichtung der Elemente in den divs, die darunter erscheinen. Wenn im #header anstelle von Text ein Bild eingesetzt wird, sollten Sie die Auffüllung entfernen. */
} 
.thrColElsHdr #header h1 {
  margin: 0; /* Wenn Sie den Rand des letzten Elements im #header-div auf 0 einstellen, können Sie das Auftreten unerwarteter Abstände zwischen divs vermeiden. Wenn das div einen Rahmen hat, ist dies unnötig, weil dieser Rahmen die gleiche Wirkung hat. */
  padding: 10px 0; /* Durch die Verwendung der Auffüllung anstelle von Rändern lässt sich gewährleisten, dass das Element die Kanten des div nicht berührt. */
}

/* Tipps für sidebar1:
1. Wenn Sie für dieses div eine Schriftgröße festlegen, wird die Gesamtbreite des div entsprechend angepasst.
2. Da wir mit Gevierten (ems) arbeiten, ist es empfehlenswert, für die Randleiste selbst keine Auffüllung zu verwenden. Sie wird bei standardgerechten Browsern der Breite hinzugefügt, und dies wiederum führt zu einer unbekannten tatsächlichen Breite. 
3. Zwischen der Kante des div und den darin liegenden Elementen kann ein Abstand eingefügt werden, indem Sie diesen Elementen wie in ".thrColElsHdr #sidebar1 p" demonstriert einen linken und rechten Rand zuweisen.
*/
.thrColElsHdr #sidebar1 {
  float: left; 
  width: 300; /* Da es sich hier um ein floatendes Element handelt, muss eine Breite angegeben werden. */
  background: #FFFFFF; /* Die Hintergrundfarbe wird nur für die Länge des Spalteninhalts angezeigt. */
  padding: 15px 0; /* Durch die Auffüllung oben und unten entsteht in diesem div ein visueller Leerraum. */
}
.thrColElsHdr #sidebar2 {
  float: right; 
  width: 200px; /* Da es sich hier um ein floatendes Element handelt, muss eine Breite angegeben werden. */
  background: #FFFFFF; /* Die Hintergrundfarbe wird nur für die Länge des Spalteninhalts angezeigt. */
  padding: 15px 0; /* Durch die Auffüllung oben und unten entsteht in diesem div ein visueller Leerraum. */
}
.thrColElsHdr #sidebar1 h3, .thrColElsHdr #sidebar1 p, .thrColElsHdr #sidebar2 p, .thrColElsHdr #sidebar2 h3 {
  margin-left: 10px; /* Für jedes Element, das in den seitlichen Spalten platziert wird, sollten ein linker und ein rechter Rand angegeben werden. */
  margin-right: 10px;
}

/* Tipps für mainContent:
1. Wenn Sie diesem #mainContent-div nicht denselben Schriftgrößenwert wie dem #sidebar1-div zuweisen, basieren die Ränder des #mainContent div auf der Schriftgröße des #mainContent-div, und die Breite des #sidebar1-div basiert auf der Schriftgröße des #sidebar1-div. Sie sollten die Werte dieser divs anpassen.
2. Der Abstand zwischen mainContent und sidebar1 entsteht durch den linken Rand des mainContent-div. Der Spaltenbereich bleibt unabhängig von der Inhaltsmenge des sidebar1-div immer gleich. Sie können diesen linken Rand entfernen, falls der Text des #mainContent-div den Bereich von #sidebar1 füllen soll, wenn der Inhalt in #sidebar1 endet.
3. Zur Vermeidung von Float-Drops müssen Sie gegebenenfalls die ungefähre maximale Bild-/Elementgröße anhand eines Tests ermitteln, weil dieses Layout auf der vom Benutzer angegebenen Schriftgröße und den von Ihnen festgelegten Werten basiert. Wenn der Benutzer die Browser-Schriftgröße aber auf einen Wert eingestellt hat, der unter dem Normalwert liegt, steht im #mainContent-div weniger Platz zur Verfügung als beim Test erkennbar.
4. Im unten stehenden bedingten Kommentar für Internet Explorer wird die Zoom-Eigenschaft verwendet, um mainContent die Eigenschaft hasLayout zuzuweisen. Dadurch wird das potenzielle Auftreten verschiedener IE-spezifischer Fehler verhindert.
*/
.thrColElsHdr #mainContent {
   margin: 20 0em 0 20em;  /* Der rechte Rand kann in Gevierten (ems) oder Pixel angegeben werden. Durch ihn entsteht der Abstand am rechten Seitenrand. */

  
  
} 
.thrColElsHdr #footer { 
  padding: 0 10px; /* Diese Auffüllung entspricht der linksbündigen Ausrichtung der Elemente in den divs, die darunter erscheinen. */
  background:#FFFFFF;
} 
.thrColElsHdr #footer p {
  margin: 0; /* Wenn Sie die Ränder des ersten Elements in der Fußzeile auf 0 einstellen, können Sie unerwartete Abstände zwischen divs vermeiden. */
  padding: 10px 0; /* Durch die Verwendung der Auffüllung bei diesem Element entsteht genau wie bei einem Rand ein Leerraum, aber ohne die potenziellen Abstandsprobleme. */
}

/* Verschiedene wieder verwertbare Klassen */
.fltrt { /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts fließen lassen. Das floatende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
  float: right;
  margin-left: 8px;
}
.fltlft { /* Mit dieser Klasse können Sie ein Element auf der Seite nach links fließen lassen. */
  float: left;
  margin-right: 8px;
}
.clearfloat { /* Diese Klasse sollte in einem div- oder break-Element platziert werden und das letzte Element vor dem Schließen eines Containers sein, der wiederum einen vollständigen Float enthalten sollte. */
  clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
--> 
</style><!--[if IE]>
<style type="text/css"> 
/* Fügen Sie CSS-Korrekturen für alle IE-Versionen in diesen bedingten Kommentar ein. */
.thrColElsHdr #sidebar1, .thrColElsHdr #sidebar2 { padding-top: 30px; }
.thrColElsHdr #mainContent { zoom: 1; padding-top: 15px; }
/* Mit der obigen proprietären Zoom-Eigenschaft wird IE die Eigenschaft hasLayout zugewiesen, die zur Verhinderung verschiedener Fehler erforderlich ist. */
</style>
<![endif]-->
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_nbGroup(event, grpName) { //v6.0
  var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) {
      img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr)
      for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}
//-->
</script>
</head>

<body class="thrColElsHdr">

<div id="container">
  <div id="header">
  <center>
  <table width="0" border="0">
    <tr>
      <th scope="col"><img src="../Eigene Bilder/header.jpg" width="1123" height="395" /></th>
    </tr>
  </table>
</center>
  <!-- end #header --></div>
  <div id="sidebar1">
    <table width="200" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td><center><img src="../Eigene Bilder/Menu.jpg" width="331" height="56" /></td>
   </tr>
    <td><a href="News.html" target="_top" onclick="MM_nbGroup('down','group1','News','../Eigene Bilder/News3.png',1)" onmouseover="MM_nbGroup('over','News','../Eigene Bilder/News2.png','',1)" onmouseout="MM_nbGroup('out')"><center><img src="../Eigene Bilder/News.png" alt="News" name="News" width="311" height="56" border="0" id="News" onload="" /></center></a></td>
  </tr>
  <tr>
    <td><a href="Forum.html" target="_top" onclick="MM_nbGroup('down','group2','Forum','../Eigene Bilder/Forum3.png',1)" onmouseover="MM_nbGroup('over','Forum','../Eigene Bilder/Forum2.png','',1)" onmouseout="MM_nbGroup('out')"><center><img src="../Eigene Bilder/Forum.png" alt="Forum" name="Forum" width="311" height="56" border="0" id="Forum" onload="" /></center></a></td>
  </tr>
  <tr>
    <td><a href="Gallerie.html" target="_top" onclick="MM_nbGroup('down','group3','Gallerie','../Eigene Bilder/Gallerie3.png',1)" onmouseover="MM_nbGroup('over','Gallerie','../Eigene Bilder/Gallerie2.png','',1)" onmouseout="MM_nbGroup('out')"><center><img src="../Eigene Bilder/Gallerie.png" alt="Gallerie" name="Gallerie" width="311" height="56" border="0" id="Gallerie" onload="" /></center></a></td>
  </tr>
  <tr>
    <td><a href="Gbook.html" target="_top" onclick="MM_nbGroup('down','group4','Gästebuch','../Eigene Bilder/Gbook3.png',1)" onmouseover="MM_nbGroup('over','Gästebuch','../Eigene Bilder/Gbook2.png','',1)" onmouseout="MM_nbGroup('out')"><center><img src="../Eigene Bilder/Gbook.png" alt="Gästebuch" name="Gästebuch" width="311" height="56" border="0" id="Gästebuch" onload="" /></center></a></td>
  </tr>
  <tr>
    <td><a href="Kontakt.html" target="_top" onclick="MM_nbGroup('down','group5','Kontakt','../Eigene Bilder/Kontakt3.png',1)" onmouseover="MM_nbGroup('over','Kontakt','../Eigene Bilder/Kontakt2.png','',1)" onmouseout="MM_nbGroup('out')"><center><img src="../Eigene Bilder/Kontakt.png" alt="Kontakt" name="Kontakt" width="311" height="56" border="0" id="Kontakt" onload="" /></center></a></td>
  </tr>
</table>
  <!-- end #sidebar1 --></div>
  <div id="mainContent">
  <center>
    <h1> Gallerie</h1>
    <p><iframe src="http://devy.bplaced.net/luck/galerie.php" width="470" heigth="600"></iframe></p>
   

  <!-- end #mainContent --></center></div>
  <!-- Dieses clear-Element sollte direkt auf das #mainContent-div folgen, um das #container-div anzuweisen, alle untergeordneten Floats aufzunehmen. --><br class="clearfloat" />
   <div id="footer">
   <center>
  <table width="200" border="0">
    <tr>
      <th scope="row"><img src="../Eigene Bilder/footer.jpg" width="1139" height="303" /></th>
    </tr>
  </table>

  <!-- end #footer --></center></div>
<!-- end #container --></div>
</body>
</html>

Wenn du eine Visualisierung benötigst... unter:
http://devy.bplaced.net/luck/
findest du alle Datein die bis jetzt eigentlich gedacht sind für die page... außer eben die psd's ^^

Is echt nett das du mir hilfst Thank you very much

Chakky · 15.3.2010 21:22

sieht ja ganz gut aus...

probier mal das ganze mit den prozent angaben bei den width und heigth anzupassen.....ein "aufwendiges" php script brauchen wir uns da nich zu basteln

ich denke pilot wird auch noch reinschauen ansonsten schau ich morgen abnd nochmal rein.....

Senca · 15.3.2010 22:11

Naja hatte ich schon versucht aber so irgendwie ist es bei mir fehlgeschlagen

Patrick Delißen · 17.3.2010 20:00

könnteste mal bitte den direkten linkzu der homepage geben damit man mal schaun kann was so der quelltext hergibt ?

grüße

so kann ich wenig damit anfangen wies aussieht und so

grüße

Chakky · 17.3.2010 20:04

Code:

    <iframe src="http://devy.bplaced.net/luck/galerie.php" width="70%" height="800" frameborder="0"></iframe>

füge das so ein sollte gehen,die breite wird dynamisch mit 70% genutz, die höhe ist statisch mit 800pixel....kannst ja mit den wert bissel rumspielen

und die funktion frameborder="0" setzt das ganze noch so das es sich ohne rahmen einfügt

Senca · 17.3.2010 21:03

Chakky ich küss dich
Aber ich denke das sollte deine Freundin übernehmen

Vielen herzlichen Dank ich versteh zwar nich ganz warum sich jetzt erst die höher verändert obwohl ichs mit zich verschiedenen werten versucht hab.
Aber nun ja ich will mich gar nicht beschweren und auf Holz klopfen *klopf klopf*

*.* mich freuts das es geht ^^

Vielen lieben Dank

Nun kann ich die Page soweit auch fertig stellen
Wenn sie dann online geht setze ich auch eine kleine Linkseite rein zu euch als dankeschön
Habt eine echt gute Gallerie entworfen, anfangs vllt bissel schwer da kein Code oder so zum einfügen war aber das haben wir ja nun.

Wäre eigentlich nice wenn man son Codegenerator mit einstellbaren größen machen könnte doch ich denke das ist eher was für Programmierer.
Nochmals Danke

Pawlita.de Support Forum. Alles zu den Skripten von Pawlita.de, Tipps und Tricks und PHP.

#1 14.3.2010 23:27

kein code findbar

14.3.2010 23:27

#2 15.3.2010 17:57

Re: kein code findbar

Code:

#3 15.3.2010 18:14

Re: kein code findbar

#4 15.3.2010 19:55

Re: kein code findbar

Code:

#5 15.3.2010 20:25

Re: kein code findbar

#6 15.3.2010 20:34

Re: kein code findbar

#7 15.3.2010 20:56

Re: kein code findbar

Code:

#8 15.3.2010 21:22

Re: kein code findbar

#9 15.3.2010 22:11

Re: kein code findbar

#10 17.3.2010 20:00

Re: kein code findbar

#11 17.3.2010 20:04

Re: kein code findbar

Code:

#12 17.3.2010 21:03

Re: kein code findbar

Brett Fußzeile