• 28.08.2025, 19:28
  • Register
  • Login
  • You are not logged in.

 

BLOODFEUD

God

brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 3:14pm

hoi hoi

da letzten sonntag der server gehackt wurde, auf dem meine page liegt, hat mein kumpel, dem der server gehört, den safemode aktiviert.
leider funktioniert deswegen meine galerie nicht mehr.

nach langem suchen und ausprobieren sind wir nun beim simpleviewer gelandet, der auch recht super funzt soweit.
wir haben es geschaft so ein simpleviewer album in eine wordpress seite einzubinden was auch super aussieht.

nun kommen wir zu meiner frage
ich möchte eine seite erstellen, auf der eine album-uebersicht zu sehen ist. quasi ein thumbnail mit einem text als beschreibung und das ganze als link, damit man zum album gelangt.
ein klickbares thumb kann ich erstellen, aber leider bekomm ich keinen text darunter bzw keinen text, der mittig sitzt.

fuer das klickbare thumb verwende ich diesen code
<a href="url zur page" title="Hallenfußball"><img src="url zum thumb"/></a>

was muss ich jetzt daran ändern, damit ich unter dem thumb einen text stehen habe?

ich hoffe das war jetzt halbwegs verständlich :)

danke und gruß
yash


crushcoder

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 3:44pm

du willst wahrscheinlich auch mehrere thumbs nebeneinander haben?

ich habe das so gelöst, nur ist das bei mir nicht in wordpress, deswegen kommt es nicht zu konflikten mit anderen elementen neben den bildern (navigation oder sowas).
aber prinzipiell könnte es dich auf die richtige spur führen.

Source code

1
2
3
4
5
6
7
<div class="image">
        <a href="img/mustering/grosses_bild_1.png"><img src="img/mustering/thumb_1.png" alt="" /><br />Beschreibung 1</a><br />
        </div>
        <div class="image">
        <a href="img/mustering/grosses_bild_2.png"><img src="img/mustering/thumb_2.png" alt="" /><br />Beschreibung 2</a><br />
        </div>
        <div class="price" />

beim price-div wird umgebrochen, falls man mal eine neue reihe anfangen will.

dazu als css:

Source code

1
2
3
4
5
6
7
8
9
10
div.image
{
    width:250px; /* Breite der Thumbnails */
    float:left;
}

div.price
{
    clear:both;
}

bei mir ist der text linksbündig, für dich wäre eine "text-align:center" beim "div.image" angebracht.
Gott hat die Welt ja nur in sieben Tagen erschaffen können, weil es keine installierte Basis gab.

Y0Gi

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 4:00pm

Ich schlage so ein XHTML-Konstrukt vor:

Source code

1
2
3
4
<a class="card">
    <img src="..." alt="..." title="..." width="..." height="..."/>
    <div>Beschreibung</div>
</a>

Das zugehörige CSS:

Source code

1
2
3
4
5
6
7
8
a.card {
    display: block;
    float: left;
    width: 160px;
}
a.card img {
    margin-bottom: 0.5em;
}


Eine praktische Anwendung (ohne Links) von mir findest du auf dieser Seite (Stylesheet, ganz unten).

Eine etwas umfangreichere Anwendung beschreibt CSS Technique: Photo Cards

This post has been edited 1 times, last edit by "Y0Gi" (Jan 22nd 2013, 4:09am)

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 5:12pm

also das mit diesen photocars sieht schonmal super aus!

nur hab ich da ein problem

<p class="card-photo"><img ... /></p>

wie soll ich da die url vom thumbnail eintragen?

TrOuble

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 5:14pm

in den <img ...> tag ;)

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 5:16pm

Quoted from "crushcoder"

du willst wahrscheinlich auch mehrere thumbs nebeneinander haben?

ich habe das so gelöst, nur ist das bei mir nicht in wordpress, deswegen kommt es nicht zu konflikten mit anderen elementen neben den bildern (navigation oder sowas).
aber prinzipiell könnte es dich auf die richtige spur führen.

Source code

1
2
3
4
5
6
7
<div class="image">
        <a href="img/mustering/grosses_bild_1.png"><img src="img/mustering/thumb_1.png" alt="" /><br />Beschreibung 1</a><br />
        </div>
        <div class="image">
        <a href="img/mustering/grosses_bild_2.png"><img src="img/mustering/thumb_2.png" alt="" /><br />Beschreibung 2</a><br />
        </div>
        <div class="price" />

beim price-div wird umgebrochen, falls man mal eine neue reihe anfangen will.

dazu als css:

Source code

1
2
3
4
5
6
7
8
9
10
div.image
{
    width:250px; /* Breite der Thumbnails */
    float:left;
}

div.price
{
    clear:both;
}

bei mir ist der text linksbündig, für dich wäre eine "text-align:center" beim "div.image" angebracht.


hammer hart!
es funzt.... WOOOOOOHOOOOO

danke crushcoder :)

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 5:21pm

Quoted from "TrOuble"

in den <img ...> tag ;)


also als ich den einfach da reingepackt hab wurd mir das thumb nicht angezeigt...

crushcoder

God

Re: brauche hilfe mit html fuer meine page

Thursday, March 1st 2007, 5:47pm

es sollte nicht:
<p class="card-photo"><img ... /></p>

sondern:
<a class="card-photo"><img ... /></a>

sein, bzw:
<a class="card-photo" href="url"><img ... /></a>
Gott hat die Welt ja nur in sieben Tagen erschaffen können, weil es keine installierte Basis gab.

Y0Gi

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 11:35am

Quoted from "Crimson"

also als ich den einfach da reingepackt hab wurd mir das thumb nicht angezeigt...

Dann war wohl der Pfad zum Bild nicht korrekt.

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 6:40pm

der pfad selber war auf jeden in ordnung

ich glaube ich hab einfach irgendwie nen fehler bei der schreibweise gemacht....

aber naja, das mit diesen cards werd ich mir auf jeden merken!
ich bin erstmal froh, das die galerie wieder läuft. und ohne euch wäre das nicht so einfach gegangen :)

http://www.yashweb.de/?page_id=72

gruß und thx
yash

Patrickclouds

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 7:05pm

hätte man sowas auch mit tabellen umsetzen können?
[CENTER][/CENTER]

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 7:53pm

also ich hab zwar null ahnung davon, aber ich glaube das geht bestimmt.

aber ein "problem" gibt es da
da ich ja öfters fotos auf meine page stelle, muss das ganze so einfach wie möglich gehen, da ich nicht immer nen halbe seite code eingeben muss :)

Y0Gi

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 8:51pm

Quoted from "Patrickclouds"

hätte man sowas auch mit tabellen umsetzen können?

Nur, wenn man es nicht besser kann. Blinde Tabellen für Layouts zu verwenden ist seit CSS 2 verpönt und spätestens seit Web 2.0 offiziell als Webfriedensbruch angesehen ;)

crushcoder

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 10:19pm

der vorteil der css-lösungen ist auch das es skaliert.
hat jm einen breites browserfenster können mehr thumbs nebeneinander angezeigt werden als bei einem schmalen fenster.

bei einer tabelle muss man sich auf eine bestimmte anzahl festlegen, und ein user mit schmalen bildschirm muss eventuell seitlich scrollen, bzw. ein user mit breitem bildschirm sieht ein paar verlorene thumbs in der bildschirmmitte.

außerdem kann man immer mehr thumbs ergänzen, auch mal einfach umordnen, ein bild einschieben usw.
das ist bei tabellen immer mit viel aufwand verbunden.

mal abgesehen vom dogma das tabellen nunmal zur darstellung von tabellarischen daten gedacht sind, nicht zum layouten. ;)
Gott hat die Welt ja nur in sieben Tagen erschaffen können, weil es keine installierte Basis gab.

Y0Gi

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 10:28pm

Richtig. Tabellen wären semantisch falsch, weniger flexibel (bei der CSS-Lösung rutschen z.B. mehr Boxen in eine Zeile, wenn man die Schrift hinreichend verkleinert) und brauchen auch weniger HTML bzw. sogar insgesamt mit HTML und CSS weniger Daten, wodurch es natürlich bei jedem Seitenaufruf weniger zu laden gibt (das Stylesheet bleibt sogar im Browsercache) was wiederum in weniger Traffic und höherer Geschwindigkeit mündet.

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Friday, March 2nd 2007, 11:32pm

hach gott

wenn ich auch nur 10% von dem aufm kasten hätte was ihr drauf habt, dann wäre meine seite bestimmt auch gut :)

aber naja, sie erfuellt ihren zweck

Y0Gi

God

Re: brauche hilfe mit html fuer meine page

Saturday, March 3rd 2007, 1:15pm

Es ist nie zu spät, sich weiter zu bilden :)

BLOODFEUD

God

Re: brauche hilfe mit html fuer meine page

Saturday, March 3rd 2007, 2:40pm

da ist auf jeden etwas dran!

aber bei mir ist das so ne sache.
ich hantier lieber mit handfesten sachen rum, sprich lötkolben und schraubenzieher :D
vielleicht liegt das ja auch daran, dass ich es einfach nicht kann, aber schon nach so ner kurzen session an der hp bin ich erschöpft wie sonst was :)

aber hey, wer weiß, jetzt weiß ich ja auch schon einiges mehr als vorher, daher kanns ja nicht schlechter werden ;D