Präsentation Bitte Hilfe bei HomeGallery

Funny · 09.08.04

Hallo!

HomeGallery scheint ja ganz toll zu sein, wenn man HTML kann. Ich kann´s aber nicht

Immerhin habe ich rausgefunden, wie ich den Hintergrund farblich ändern kann.

Was mir jetzt aber noch fehlt, ist der Befehl, daß das ganze in der Mitte steht und nicht links am Rand.
Ist bestimmt ganz einfach (wenn man´s kann) :-[

Lieben Gruß
Sylvia

hausi · 09.08.04

Hallo!
Es gibt im HTML verschiedenste Varianten. Am einfachsten ist aber der Tag
<center></center>
Zwischen den beinden muss dann der Text, Bild usw. stehen.
Grüße Hausi

Funny · 09.08.04

Dankeschön!

Ich wußte erst nicht wo ich das überhaupt einfügen muß, hab aber gedacht über bzw. unter "body" wäre logisch. Und siehe da ...

Wenn du mir jetzt noch verraten könntest, wie ich die Schriftart (für "zurück, Übersicht und weiter) ändere, würde dir mein Dank ewig hinterschleichen

Lieben Gruß
Sylvia

PS: So steht´s jetzt drin

HTML:

<html>

<head>
  <meta http-equiv="Content-Language" content="de">
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <meta name="GENERATOR" content="##HGVERSION##">
  <title>##GALLERYNAME##: ##CAPTION##</title>
  <style type="text/css"><!--
   body {color: #000000; background-color: #FFF7EA; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
   td, th, ul, li, input, textarea {color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
   a       {color: #222266; text-decoration: none;   }
   a:hover {color: #222266; text-decoration: underline; }
   p {margin: 1em 0 1em 0; }
   p.small {font-size: 80%; color: #808080; margin: 0.5em 0 0.5em 0; }
   h1 {font-size: 24px; font-weight: bold; margin-bottom: 1em; }
   h2 {font-size: 15px; font-weight: bold; margin-bottom: 1em; }
   h3 {font-size: 12px; font-weight: bold; margin-bottom: 1em; }
   hr {height: 1px; border: none; color: #000000; background-color: #000000; }
  --></style>
</head>
<center>

<body>

<h1>##GALLERYNAME##</h1>
<p><a
  href="##BACK##">&lt;&nbsp;Zurück</a>&nbsp;|&nbsp;<a
  href="##OVERVIEW##">Übersicht</a>&nbsp;|&nbsp;<a
  href="##NEXT##">Weiter&nbsp;&gt;</a>
</p>

##IMAGE## 

<p><b>##CAPTION##</b></p>
<p>##DESCRIPTION##</p>
<p class="small">##DATE##</p>
<p class="small">##TECHNICALS##</p>

<p><a
  href="##FIRST##">&middot;&lt;&nbsp;Anfang</a>&nbsp;|&nbsp;<a
  href="##BACK##">&lt;&nbsp;Zurück</a>&nbsp;|&nbsp;<a
  href="##OVERVIEW##">Übersicht</a>&nbsp;|&nbsp;<a
  href="##NEXT##">Weiter&nbsp;&gt;</a>&nbsp;|&nbsp;<a
  href="##LAST##">Ende&nbsp;&gt;&middot;</a></p>

<hr>
<p class="small">Bild ##IMGINDEX## von ##IMGCOUNT##&nbsp;&nbsp;##IMGID##</p>
<p class="small">Galerie erstellt mit ##HGVERSION##</p>

</body>
</center>
</html>

kuni-r · 09.08.04

Hallo Funny,

vielleicht hilft Dir das nochmal ein wenig weiter:

http://www.die-ritters.de/samples/homegallerybeispiel.zip

Ich hab da Beispiel-Templates, ein Stylesheet etc. mit reingepackt. Wenn Du die HTML-Templates mal mit einem passenden Editor aufmachst...

Wenn Du ein wenig HTML lernen möchtest, kann ich Dir SelfHTML wärmstens empfehlen:

http://aktuell.de.selfhtml.org/

Ansonsten hilft oft auch, sich mit dem Browser den Code von Seiten anzusehen, die man gut findet. Abspeichern und rumprobieren...

Funny · 09.08.04

Hallo Kuni!

Das hatte ich mir schon angesehen, aber wenn man so gar nichts davon versteht... :

Ich habe mir schon öfter vorgenommen HTML zu lernen, aber bisher habe ich mich nicht aufraffen können.
Ich benutze zwar Dreamweaver, aber da dann den Ansichtsmodus (für Dummies ;D)
Man kann dort ja auch ein Album erstellen, leider stehe ich damit ziemlich auf Kreigsfuß, ist mir einfach zu umständlich.

Mit HTML wär´s natürlich einfacher :-[

Lieben Gruß
Sylvia

hausi · 09.08.04

Hallo Funny!
Perfekt, dass du den Quelltext dazugehängt hast, denn auch die Schriften lassen sich auf verschiedenste Weise bearbeiten.
Ich habe im <style> eine neue Schriftklasse definiert
p.navi {font-size: 18px; font-weight: normal; margin-bottom: 1em; }
(in diesem Teil wird Schriftgröße, Aussehen (normal, bold (=fett) und Ausrichtung definiert)

und dann beim entsprechenden Text den Tag auf
 erweitert.

HTML:

<html>

<head>
  <meta http-equiv="Content-Language" content="de">
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <meta name="GENERATOR" content="##HGVERSION##">
  <title>##GALLERYNAME##: ##CAPTION##</title>
  <style type="text/css"><!--
   body {color: #000000; background-color: #FFF7EA; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
   td, th, ul, li, input, textarea {color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
   a      {color: #222266; text-decoration: none;   }
   a:hover {color: #222266; text-decoration: underline; }
   p {margin: 1em 0 1em 0; }
   p.small {font-size: 80%; color: #808080; margin: 0.5em 0 0.5em 0; }
   p.navi {font-size: 18px; font-weight: normal; margin-bottom: 1em; }
   h1 {font-size: 24px; font-weight: bold; margin-bottom: 1em; }
   h2 {font-size: 15px; font-weight: bold; margin-bottom: 1em; }
   h3 {font-size: 12px; font-weight: bold; margin-bottom: 1em; }
   hr {height: 1px; border: none; color: #000000; background-color: #000000; }
  --></style>
</head>
<center>

<body>

<h1>##GALLERYNAME##</h1>
<p class="navi"><a
  href="##BACK##">< Zurück</a> | <a
  href="##OVERVIEW##">Übersicht</a> | <a
  href="##NEXT##">Weiter ></a>
</p>

##IMAGE##

<p><b>##CAPTION##</b></p>
<p>##DESCRIPTION##</p>
<p class="small">##DATE##</p>
<p class="small">##TECHNICALS##</p>

<p class="navi"><a
  href="##FIRST##">·< Anfang</a> | <a
  href="##BACK##">< Zurück</a> | <a
  href="##OVERVIEW##">Übersicht</a> | <a
  href="##NEXT##">Weiter ></a> | <a
  href="##LAST##">Ende >·</a></p>

<hr>
<p class="small">Bild ##IMGINDEX## von ##IMGCOUNT##  ##IMGID##</p>
<p class="small">Galerie erstellt mit ##HGVERSION##</p>

</body>
</center>
</html>

Linley · 09.08.04

Hallo Sylvia,

für Leute, die, wie ich keinen Schimmer von HTML haben, wurden mir einmal die HTML-Hefte von Herrn Hanke, erschienen im Knowware-Verlag empfohlen, zum Beispiel: Homepages mit HTML und CSS.
Die Hefte kosten um die vier Euro, sind also bezahlbar.

Ich habe mir ein paar der Hefte bestellt, man kann sie aber auch an vielen Kiosken, Tankstellen, etc. beziehen.

Schönen Gruß,

Martin

Funny · 09.08.04

Dafür bekommst du :-* :-* :-*

Danke Hausi, ich hab jetzt nochmal ganz mutig gegen "Comic Sans" ausgetauscht. Alles perfekt!

Vielen Danke für die Hilfe.

Lieben Gruß
Sylvia

@Linley
Werde ich mir mal angucken, danke für den Tipp.

kuni-r · 09.08.04

Hallo Sylvia,

wegen des Zentrierens...

Im Template, wo die Thumbnails angezeigt werden steht ziemlich am Ende

##THUMBS##

Das ALIGN="CENTER" sorgt dafür, daß die Thumbnail-Liste mittig angezeigt wird.

Im Template, das für die Bilder zuständig ist, steht die Variable für das Bild in einem Tabellenfeld. Für dieses Tabellenfeld gibst Du statt <TD> ein: <TD ALIGN="CENTER"> Dann wird der Inhalt des Feldes zentriert.

Der Rest des Aussehens der Thumbnails wird im *.gdf definiert. Reiter "HTML-Templates". Dort findest Du einen solchen Eintrag:

<TD ALIGN="CENTER" VALIGN="MIDDLE" HEIGHT="140" WIDTH="140" CLASS="thumbs">
Tabellenfeld wird zentriert, Inhalt mittig gesetzt. Feldhöhe ist 140 Pixel, Feldbreite ebenfalls 140 Pixel. Das CLASS= holt sich die Angaben über das Aussehen des Feldes aus dem CSS-Stylesheet.

<A HREF="##IMGURL##">
<IMG SRC="##THUMBURL##" ALT="##CAPTION##" BORDER="##THUMBBORDER##" WIDTH="##THUMBWIDTH##" HEIGHT="##THUMBHEIGHT##"></A>
 
##ORIGFILE## 
</TD>

Hier wird ein Link aus der Variable ##IMGURL### erstellt. Als Basis dient ein Bild namens ##THUMBURL## mit der Beschreibung ##CAPTION##, die beim Überfahren des Thumbnails mit der Maus angezeigt wird.

Der Rand des Thumbnails wird durch die Variable ##THUMBBORDER## definiert. Die Größe des Bildchens durch ##THUMBHEIGHT## und ##THUMBWIDH##

Nach einem Zeilenumbruch ( ) kommt ein Text mit der Buchstabengröße -2 in Verdana oder Helvetica, der aus der Variablen ##ORIGFILE## definiert wird. Das </TD> schließt die Angaben zum Inhalt des Feldes ab.

Funny · 09.08.04

Aaaahh ja.
Ich gestehe, ich verstehe nicht mal die Hälfte :-[

Muß mich wohl doch mal mit HTML beschäftigen.

Trotzdem Danke, Kuni.

Lieben Gruß
Sylvia

m.s · 09.08.04

hallo sylvia,

wenn du die gallerie ins web stellen willst, solltest du drauf achten, dass du möglichst nur schriftarten verwendest, die auf den systemen der betrachter auch vorhanden sind. das sind für windows-rechner : arial, courier, comic, new times roman, tahoma, verdana und evtl. noch trebuchet.

ansonsten ist selfhtml ne gute quelle, um sich html beizubringen.

grüsse
micha

edit

ops, ich seh grad, dass manfred den selfhtml-link oben schon genannt hat. aber doppelt hält besser ;D ;D

Linley · 09.08.04

Hi Micha,

selfhtml wurde mir auch schon aus verdiedensten Richtungen empfohlen, allerdings kam ich damit nie wirklich zurecht, frag mich nicht, warum.
Irgendwie habe ich dabei nicht durchgeblickt ...

Schönen Gruß,

Martin

m.s · 09.08.04

hallo martin,

bei selfhtml muss man wirklich ganz vorne anfangen zu lesen. oder man benutzt es als nachschlagewerk, nachdem man die grundsätze aus nem buch gelernt hat.

grüsse
micha

giraffengero · 09.08.04

Hallo Sylvia,

mir ging es im letzten Jahr genauso wie dir jetzt! Keine Ahnung von HTML aber homegallery gefiel mir und ich wollte es nach meinen Wünschen verändern.
Ich versuchte es dann auch mit selfhtml, geholfen hat mir dann aber auch, einfach auf Internetseiten, von denen ich etwas abschauen wollte, mit der rechten Maustaste draufzuklicken und "Quelltext öffnen" zu wählen und mich dann da einzulesen und die für mich relevanten Codes zu finden.

Anbei zwei Beispiele von mir mit homegallery erstellten Bilderseiten.

http://buergerfestrundgang2004.franken-luftbild.de/index.htm

http://ffroth.franken-luftbild.de/

m.s · 09.08.04

Hallo,

der Tipp von Gero, in den Quelltext zu schauen, ist sehr gut. Wenn man einigermaßen weiß, worums geht, kann man sich da viel abschauen. Ansonsten gibts da noch diese Seite:

http://www.htmling.net/?menu=html

Ist vielleicht eher für Kinder gemacht, aber was für Kinder gut ist, kann für Erwachsene ja nicht schlecht sein (ums mal mit den Worten der Werbung zu sagen) ;D ;D

Grüsse
Micha

wegus · 09.08.04

HTML ist wirklich weit davon entfernt schwierig zu sein! Problematisch ist oft nur die schiere Menge der Möglichkeiten und der zugehörigen Erweiterungen. Deshalb ist ein didaktisch guter Einstieg wichtig. Wie Du ja schon gesehen hast Funny, kann man mit wenigen Elementen schon viel ausrichten. selfhtml ist toll, aber meiner Meinung nach nur als Nachschlagewerk, für den der prinzipiell schon bescheid weiß. Zum Verstehen und Erlernen empfehle ich:

http://www.dpunkt.de/html4/

hier werden Schritt für Schritt die wichtigsten Punkte mit Beispielen erläutert. Mehr als einen Rechner, einen Texteditor und Zeit für die ca. 300 Seiten braucht Mensch nicht.

Gruß Karsten

giraffengero · 09.08.04

Hallo,

hier noch zwei links, die mir auch sehr geholfen haben:

http://www.hilberer.de/html/htmlkurs.html

und zu den Farben:

http://www.pagetutor.com/pagetutor/makapage/picker/index.html

m.s · 09.08.04

Hallo,

und wer des Englischen mächtig ist, kann auch mal bei W3Schools vorbeischauen. Dort kann gibts auch Beispiele, die man selbst beeinflussen kann. D.h. links steht der Quelltext und rechts das Ergebnis.

Grüsse
Micha

wegus · 09.08.04

Bei soviel Lernstoffquellen, sollten wir vielleicht eine kleine Lernzielkontrolle androhen

;D ;D

kuni-r · 09.08.04

HTML:

<head>
  <meta http-equiv="Content-Language" content="de">
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <meta name="GENERATOR" content="##HGVERSION##">
  <title>##GALLERYNAME##: ##CAPTION##</title>
  <style type="text/css"><!--
   body {color: #000000; background-color: #FFF7EA; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
   td, th, ul, li, input, textarea {color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 13px; }
   a       {color: #222266; text-decoration: none;   }
   a:hover {color: #222266; text-decoration: underline; }
   p {margin: 1em 0 1em 0; }
   p.small {font-size: 80%; color: #808080; margin: 0.5em 0 0.5em 0; }
   h1 {font-size: 24px; font-weight: bold; margin-bottom: 1em; }
   h2 {font-size: 15px; font-weight: bold; margin-bottom: 1em; }
   h3 {font-size: 12px; font-weight: bold; margin-bottom: 1em; }
   hr {height: 1px; border: none; color: #000000; background-color: #000000; }
  --></style>
</head>
<center>

<body>

<h1>##GALLERYNAME##</h1>

Das <center> muß iinnerhalb des Bodys stehen. also...
....
</head>
<body>
<center>
...
</center>
</body>

Präsentation Bitte Hilfe bei HomeGallery

Mitglied

Mitglied

Mitglied

Mitglied

Mitglied

Mitglied

Mitglied

Mitglied

Mitglied

Mitglied

FF-Team

Mitglied

FF-Team

Mitglied

FF-Team

Mitglied

Mitglied

FF-Team

Mitglied

Mitglied