Souvenirs auf die Profilseite

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>Bildadresse</td></td></td></td>
<td><td><td><td>Bildadresse</td></td></td></td>
<td><td><td><td>Bildadresse</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 <td> und </td>. 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.

Einfügen der Bildadressen

Die jeweilige Bildadresse wird mit Linkinformationen der dazugehörigen Quelle (HP, Listing) in den Zwischenspeicher kopiert und wie bereits beschrieben eigefügt:

<td><a href=“https://www.geocaching.com/geocache/GC7EXTC_jurassic-world-bonus“ target=“_blank“>
<img src=“http://nordwind.info/wp-content/uploads/2018/04/545684fc-ed58-4fc3-a0b5-40419404c7b8_l.png.jpeg“
border=“0″></a></td></td></td></td>

So sollte die erste Tabellenzeile nach dem Einfügen in dem Wert aussehen.

Bildgrößen individuell ändern

Da viele Souveniers in unterschiedlichen Bildgrößen bereiutgestellt werden können wir noch den HTML-Wert

style=“width: 240px; height: 160px;“

zwischen <img und src einbauen, womit wir bei den Pixelwerten die Bildgröße individuell anpassen können. Da unzählige Banner mit den unterschiedlichsten Größen daherkommen,  haben sich folgende Bildgrößen bewährt:

  • 480 x 320 – Querformat
  • 320 x 480 – Hochformat
  • 480 x 200 – Schmalformat
  • 800 x 200 – Breitformat

 

Nach oben