---
title: "Bild als Wasserzeichen und darüber Content?"
url: "https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content"
source: "typo3.net"
tags: ["Allgemein","Bilder","Frage","HTML & CSS"]
created: "2006-03-27"
last_reply: "2006-05-24"
replies: 25
solved: false
page: 1
pages: 1
lang: "de"
---

# Bild als Wasserzeichen und darüber Content?

Allgemein · 25 Antworten · gestartet 2006-03-27

## Eröffnungsbeitrag

**Moestchen** · 2006-03-27 · [Beitrag #1](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/1)

Hallo Leute,
bin nach wie vor noch dabei mich in Typo3 einzuarbeiten, komme zwar mittlerweile immer besser zu recht, aber habe immer noch so meine Probleme.

In meinem Template habe ich einen Bereich mit dem Marker ###INHALT### versehen. Ziel soll es sein, in diesem Bereich den Content der Webseite anzuzeigen, wobei im Hintergund als Wasserzeichen ein Logo zu sehen sein soll.

Das Bild und den Content in zwei verschiedenen Bereichen anzuzeigen ist ja kein Problem, aber wie bekomme ich das im selben Bereich mit Ebenen hin?

Habe es mit dem GIFBUILDER versucht, doch mit:

```typoscript
     INHALT = IMAGE
     INHALT.file = GIFBUILDER
     INHALT.file.XY = 560, 400
     INHALT.file {
         10 = IMAGE
         10.file = fileadmin/...

         20 = CONTENT
         20.table = tt_content
         20.select.orderBy = sorting 
     }
```

wird mir lediglich die Grafik angezeigt.
"Schnippel" ich das ganze wieder auseinander und packe es in zwei getrennte Bereiche, funktioniert es ohne Probleme.

Könnt ihr mir bitte weiterhelfen, was ich verkehrt mache!?

Vielen DANK und viele Grüße

## Antworten

### [#2](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/2) · nugget · 2006-03-27

wieso realisierst du das wasserzeichen nicht mit css?

### [#3](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/3) · Moestchen · 2006-03-27

:o ... weil ich wahrscheinlich nicht weiß wie es geht?

### [#4](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/4) · Unbekannter Benutzer · 2006-03-27

schau mal bei selfhtml rein, background-image ist das Stichwort

Viele Grüße
Niki

### [#5](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/5) · toyde · 2006-03-27

> weil ich wahrscheinlich nicht weiß wie es geht?

? wartest Du denn bis es sich selbst löst?  o.O

1) Ich kenne CSS nicht: also:
<http://www.google.de>
Suchbegriffe "hintergrundbild css".
z.B.:

```html
<div style="background-image: url(.../images/bg.jpg);">mein Content hat ein Hintergrundbild</div>
```

2) Wie bekomme ich Klassen in meinen Content
» gibt hier eine **tolle Forumsuche**.
Suchbegriffe "CSS Content Klassen".

Du versuchst es ja nicht mal - finde ich schade..  #paralyzed#

### [#6](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/6) · Moestchen · 2006-03-27

Danke für die Hinweise und eure Unterstützung!!!

> Du versuchst es ja nicht mal - finde ich schade

@toyde:
Sorry, aber ich denke das du das wohl kaum beurteilen kannst.
Erstens sitze ich nicht erst seit 5 Minuten an dem Problem, sondern schon seit heute früh und zweitens habe ich schon mehr als genug gegoogelt. Nur wie gesagt, habe ich es in Bezug auf GIFBUILDER versucht und kam nicht auf die Idee mit CSS. Wie soll man nach was googeln, wenn man nicht weiß wonach?
Und sicherlich fällt es dir leichter, aber vergiss bitte nicht, das jeder - sicherlich auch du - mal klein angefangen hat ... und dies hier ist doch auch ein Anfängerforum.

Sorry an alle anderen, bitte nicht falsch verstehen, aber das musste mal sein. Nichts ärgert mich mehr in Forum, als solche pauschalen Äußerungen.
Denn ich denke ein Forum ist ein Quell des Wissens, wo jeder was lernen kann und nicht ein Ort zum sagen "du bist zu doof zu suchen".

Viele Grüße

### [#7](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/7) · toyde · 2006-03-27

Ich habe nix von 'zu doof' gesagt. Nur hatte Dir ja nugget wunderbar gesagt, dass man Hintergrundbilder/Wasserzeichen per CSS lösen kann.

### [#8](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/8) · Moestchen · 2006-03-27

> Ich habe nix von 'zu doof' gesagt.

Hab ich ja auch nicht behauptet, deswegen steht es a) in Anführungszeichen und b) hätte ich sonst geschrieben, DU hast gesagt. ;-)

Also, bitte nicht persönlich nehmen - ist wirklich so nicht gemeint ... sondern es ist nur ein allgemeines Problem, welches mir in Verbindung mit Foren auffällt.

Viele Grüße

PS: Habs gerade mit CSS probiert uns es funzt leider nicht.  :'(

### [#9](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/9) · toyde · 2006-03-27

Kein Ding. Kritik ist bei mir nie böse gemeint ;)

Was hast Du genau versucht mit CSS? Poste bitte mal Quellcode bzw. TypoScript.

### [#10](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/10) · Moestchen · 2006-03-27

Okay, dann ist ja alles geklärt. :-)

Habe mir einfach erst einmal eine leere HTML-Seite erstellt um das CSS-Code-Schnipsel auszuprobieren:

```html
<html>
  <body>
    <div style="background-image:url(Logo-2006-03-27_2.gif);">
      TEST
    </div>
  </body>
</html>
```

Das Bild liegt selbstverständlich im selben Verzeichnis.

Als Ergebnis sehe ich aber nur eine weiße Seite mit dem Wort TEST.

### [#11](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/11) · toyde · 2006-03-27

Und so?

```html
<html>
  <body>
    <div style="background-image:url(Logo-2006-03-27_2.gif); height:600px;">
      TEST
    </div>
  </body>
</html>
```

<div>test</div> ist ein einziliges Div. Wenn dein Hintergrundbild erst weiter unten zu sehen ist, dann sieht man es nicht  :p

Das hat wie Du siehst nix mit TYPO zu tun.
Hier der Link zu selfhtml, welches oben erwähnt wurde: <http://de.selfhtml.org/css/eigenschaften/index.htm>

### [#12](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/12) · Moestchen · 2006-03-27

> <div>test</div> ist ein einziliges Div

Da hst du wohl recht,  #angry# , habs in meiner Testseite noch einmal probiert, indem ich mehrere Probezeilen eingefügt habe - klappt.

Aber in meinem Template funktioniert es nicht, obwohl mehrzeiliger Content ausgegeben wird.
ERGÄNZUNG: Lokal wird mir in der Vorschau jetzt die Grafik als Hintergrundbild und darüber Text angezeigt, nur wenn ich das Template und das Bild auf den Server kopiere, wird mir beim Seitenaufruf nur der Content und kein Logo mehr angezeigt. :'(

Mal noch eine andere Frage:
War denn mein Ansatz mit GIFBUILDER so verkehrt? - Weil ich dachte, das man da einfach mit mehreren Ebenen arbeiten kann!?

### [#13](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/13) · Laures · 2006-03-28

erklärung
die seite die dein nutzer aufruft liegt immer im verzeichnisbaum genau ÜBER fileadmin. alle links die du im template setzt müssen also von diesem verzeichnis ausgehn. Davon ausgehend das dein bild direkt in fileadmin liegt muss es also heißen:

```html
<html>
  <body>
    <div style="background-image:url(fileadmin/Logo-2006-03-27_2.gif);">
      TEST
    </div>
  </body>
</html>
```

und siehe da, es funzt im template.

zum gifbuilder:
da die erstellten images mit dem <img src=...> tag eingebunden werden ist es relativ komplex das teil als hintergrund einzufügen. wenn es zusätzlich immer das selbe bild ist, ist es unnötige arbeit für den server.

Laures

### [#14](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/14) · Unbekannter Benutzer · 2006-03-28

ein GIFBUILDER Bild kann man relativ einfach auch als Hintergrundbild einbinden das ist kein Problem, aber bei der Methode Hintergrundbild + Content mit GIFBUILDER erzeugen wird der _gesamte_ Inhalt als Bild ausgegeben. Könntest also auch einfach Deinen Entwurf nehmen, als jpg speichern und online stellen dann sparst Du Dir die ganze Typo3 Implementierung ;-)

Viele Grüße
Niki

### [#15](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/15) · Laures · 2006-03-28

> **Niki schrieb:**
>
> ein GIFBUILDER Bild kann man relativ einfach auch als Hintergrundbild einbinden das ist kein Problem ...

WIE? Die möglichkeit will ich wissen, weil es einige fälle gibt wo ich dynamische hintergründe am ende gelassen hab.

ich kenne keine möglichkeit das image tag zu entfernen. damit fällt das einbinden über background-image schonmal flach. nächste möglichkeit währe der z-index. und das währe relativ schwierig.

Wie geht das einfacher?

In freudiger Erwartung,

Laures

### [#16](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/16) · toyde · 2006-03-28

> **Laures schrieb:**
>
> ich kenne keine möglichkeit das image tag zu entfernen.
>
> Wie geht das einfacher?

GIFBUILDER hat ja nix mit IMG-Tag zu tun.

Forumsuche links oben. Suchbegriffe "gifbuilder background-image".

### [#17](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/17) · Laures · 2006-03-28

Suchergebnis: 2 seiten an Forenbeiträgen. keine lösung.
kann ich einen Marker direkt durch ein Gifbuilder objekt ersetzen?

### [#18](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/18) · fuss · 2006-03-28

Olla!

Um das ganze (hoffentlich) zum Abschluss zu bringen: ;)

So liest man ein Bild aus dem Media Feld beim Seitentyp "advanced" aus, und bindet dieses per CSS dynamisch (als Hintergrund) ein:

```typoscript
# background content
# NO subpart - just a marker!
temp.bgcntgfx = TEXT
temp.bgcntgfx {
 data = levelmedia: -1, "slide"
 field.listNum = 0
 ifEmpty = bg_cnt.jpg
 wrap = background-image: url(uploads/media/|);
}
```

Irgendwo im HTML-Template:

```html
<div id="contentcontainer" style="###BGCNTGFX###">...</div>
```

ifEmpty gib an, welches Bild benutzt werden soll, wenn kleins gefunden wird.

Wenn man nun ein dynamisch vom gifbuilder erzeugtes Bild einbinden will, muss der Typ vom gifbuilder anstelle von IMAGE IMG_RESOURCE sein:

```typoscript
temp.gifbuilder = IMG_RESOURCE
```

Nun kommt man an den Pfad des Bildes ran, und kann diesen per Marker einbinden.

Zum Thema levelmedia slide und weiterführende Info zu IMG_RESOURCE bitte tsref konsultieren. ;)

gruss, fuss

### [#19](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/19) · Unbekannter Benutzer · 2006-03-28

Da bleibt mir nichts mehr hinzuzufügen :-)

### [#20](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/20) · toyde · 2006-03-28

Tja, fehlt nur noch Moestchen der per CSS das Bild nun drin hat oder nicht ... *Fragezeichen*. Ist ja sein Thread  ;) .

### [#21](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/21) · Moestchen · 2006-03-29

Sorry das ich mich erst heute melde, hatte gestern leider keine Zeit vorbei zu schauen.

... und was soll ich euch sagen, ja, es funktioniert jetzt mit der CSS-Methode. Mein Fehler war, das ich den Pfad nicht vom Ordner fileadmin aus aufgebaut hatte, von daher konnte das Bild auch nicht gefunden werden.

Recht herzlichen Dank für eure Hilfe!!!

Viele Grüße

### [#22](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/22) · shue · 2006-05-23

Hallihallo zusammen,

ich stöbere nunmehr seit fast zwei Monaten hier als stille Teilnehmerin durchs Forum und habe dadurch schon die Lösung für viele meiner kleinen Anfängerproblemchen gefunden.

Mit DIESEM Thread hier habe ich außerdem mit dem Beitrag von "fuss" die Lösung für genau das gefunden, was ich gerade brauche: Bilder, die ich über "advanced" einer Seite per upload/media zuweise, über CSS dann als background-image im Kopf der jeweiligen Seite auszugeben. Soweit so Klasse.

Warum schreibe ich dann hier? Weil es leider bei mir nicht funktioniert  #angry#  bzw ich nicht weiß, wie ich den Marker genau ansprechen muss. Zum Glück sind wir hier in den Anfängerfragen...

Wie genau muss ich denn den zugehörigen Marker ansprechen? Nach dem Code von "fuss" muss ich ja auf jeden Fall folgendes schreiben:

```typoscript
  temp.kopf = TEXT      
      temp.kopf {
        data = levelmedia: -1, "slide"
        field.listNum = 0
        ifEmpty = fileadmin/images/kopf1.jpg
        wrap = background-image: url(uploads/media/|);
        }
```

Den Marker KOPF, der ja im HTML mit <div id="kopf" style="###KOPF###"> definiert ist, muss ich ja aber noch ansprechen, denn sonst funktioniert es nicht, denn er bleibt im Quelltext stehen. Was mach ich da nun genau hin? KOPF=TEXT? Damit spricht er zwar den Marker an (im Quelltext steht dann <div id="kopf" style="">), er schreibt aber nicht in die "" ""rein, was er soll, nämlich das "background-image: url..." Was also muss ich KOPF= zuweisen?

Wahrscheinlich seh ich den Wald vor lauter Bäumen nicht und bin jemanden mit einer Axt dann sehr dankbar... #paralyzed#

LG, Sarah

### [#23](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/23) · just2b · 2006-05-23

Hallo Sarah,

zuerst mal herzlich willkommen im Forum!
Es wär geschickter du würdest einen eigenen Thread aufmachen, aber egal

marks.KOPF < temp.kopf

lg georg

### [#24](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/24) · shue · 2006-05-23

Hallo Georg,

ja, den Gedanken an einen neuen Thread hatte ich auch - als ich gesehen habe, dass dieser ja schon den grünen Haken hat... In anderen Foren wird man wiederum für neue Threads ja virtuell geschlagen, wenn es welche zum selben Thema gibt... ;-)

marks.KOPF < temp.kopf  bzw. in meinem Fall KOPF < temp.kopf weil ich 10.marks außen stehen habe, geht nicht - damit spricht er den Marker nicht mehr an - er bleibt im Quelltext stehen mit style="###KOPF###". Hm... Jetzt sieht es so aus:

```typoscript
10.marks {
      #vorher allerlei andere Marker zugewiesen
      KOPF < temp.kopf
      temp.kopf = TEXT      
      temp.kopf {
        data = levelmedia: -1, "slide"
        field.listNum = 0
        ifEmpty = fileadmin/images/kopf1.jpg
        wrap = background-image: url(uploads/media/|);
        }
      #nachher allerlei andere Marker zugewiesen
    }
```

### [#25](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/25) · just2b · 2006-05-23

entweder du hast das temp-Objekt irgendwo, zB ganz am ende/beginn des setups stehen und weist es dann zu **oder** du schreibst gleich
marks.KOPF {
data...
...
}

hoffe ich bisschen zur erleutung beigetragen
lg georg

### [#26](https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content/26) · shue · 2006-05-24

Ja! Danke! Jetzt klappt es! Gestern Abend saß ich völlig auf der Leitung, aber heute hab ich es dann gleich hinbekommen.  :)

---

Quelle: „Bild als Wasserzeichen und darüber Content?“, typo3.net, https://www.typo3.net/d/40291-bild-als-wasserzeichen-und-darueber-content
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.