Selbstverständlich haben viele Nutzer von GC.com ihre eigenen Methoden, wenn es darum geht, Bilder, Banner ooder Souvenirs in ihre Profilseite einzubinden. Die häufigtse Methode bestaht aus dem einfügen des Quellcodes des Banners in die Profilseite. Je nach Aktivität füllt sich so nach und nach die Profilseite.
Soll das Ganze etwas geordneter aussehen wir z. B. mehrere Banner mit einheitlichen Größen nebeneinander, müssen einige kleine Hürden in Sachen Bildbearbeitung und HTML genommen werden.
Erzeugen einer Tabelle für mehrere Bilder
Für die Darstellung von mehreren Bildern nebeneinander bedienen wir uns einer HTML-Tabelle, die wir in die Profilseite (ohne Text Bildadresse) hineinkopieren und die wie folgt aussieht:
<table>
<tbody>
<tr>
<td><img src=“Bildadresse“
style=“border:0px solid ;width:300px;height:160px;“></td></td></td></td>
<td><td><td><td><img src=“Bildadresse“
style=“border:0px solid ;width:300px;height:160px;“></td></td></td></td>
<td><td><td><td><img src=“Bildadresse“
style=“border:0px solid ;width:300px;height:160px;“</td>
</tr>
</tbody>
</table>
Als nächstes greifen wir uns von den einzufügenen Bildern die jeweilige Bildadresse ab (Mac: Befehl über linke Maustaste) und fügen sie zwischen die Werte img src=“ und „
style. Das oben abgebildete Tool ist für 3 Bilder ausgelegt, das nach Belieben durch einfügen oder löschen der mittleren Bildzeile – also <td><td><td><td>Bildadresse</td></td></td></td> – erweitert bzw. verringert werden kann. Die Werte <td><td><td> vor, und </td></td></td> nach dem Wert <td></td> sorgen für einen ausreichenden Abstand zwischen den Bildern. Wird eine neue Tabelle für weitere Bilder eingefügt, ist eine ausreichender Abstand der Bilder nach unten bzw. nach oben vorhanden. Genügt dies nicht und soll stattdessen ein Absatz eingefügt werden, erfolgt dies mit dem Wert <br>. Das Eingeben durch Leerzeilem mittels >Enter< hat im HTML keine Auswirkung.
Bildgrößen individuell ändern
Da viele Souveniers in unterschiedlichen Bildgrößen bereiutgestellt werden können wir noch den HTML-Wert
style=“width: 300px; height: 160px;“
zwischen <img und src einbauen, womit wir bei den Pixelwerten die Bildgröße individuell anpassen können.