FCE Mapping Problem mit a- und img-Tags

hallo forum,

beim mapping stoße ich zurzeit immer wieder auf dasselbe problem. hoffe, ihr könnt mir weiterhelfen.

relevanter teil meines html-templates:

<div>
  <img src="img/test.gif" alt="" />
  <br />
  <a href="" class="link-01">
    <img src="img/test.gif" alt="" />
  </a>
  <br />
  <a href="" class="link-02">Das ist ein Link</a>
</div>

das <div> enthält also
1.) ein bild
2.) ein verlinktes bild (a-tag hat zur orientierung die class "link-01")
3.) einen textlink (a-tag hat zur orientierung die class "link-02")

für mein flexible content element mappe ich nun folgendermaßen:

ROOT: <div>INNER, (ALL)
Img above: <img alt="" />, (ALL)
Link1: <a>ATTR:href, a:attr:href
Img: <a>INNER, *:inner
Link2: <a>ATTR:href, a:attr:href
Text: <a>INNER, *:inner

das zweite (verlinkte) bild (Img) muss ich anscheinend *:inner auf den umschließenden a-tag mappen, da (ALL) direkt auf den img-tag sofort eine warnung erzeugt <!>

nun füge ich das flexible content element als seiteninhalt ein und befülle es folgendermaßen:

Img above: above.gif
Link1: www.google.at
Img: link-img.jpg
Link2: www.typo3.org
Text: Hier gehts zu Typo3

betrachtet man den quelltext entsteht dann aber (für mich unverständlicherweise) folgendes:

<!--  CONTENT ELEMENT, uid:44/templavoila_pi1 [begin] -->
  <a name="44"></a>
  <a href="http://www.typo3.org" target="_top">
    <img src="uploads/tx_templavoila/above.gif" alt="" title="" border="0" height="18" width="69" />
  </a>
  <br />
  <a href="http://www.google.at" class="link-01"></a>
  <a href="http://www.typo3.org" target="_top">
    <img src="uploads/tx_templavoila/link-img.jpg" alt="" title="" border="0" height="60" width="80" />
  </a>
  <br />
  <a href="http://www.typo3.org" class="link-02">Hier gehts zu Typo3</a>
<!--  CONTENT ELEMENT, uid:44/templavoila_pi1 [end] -->

es wird also der zweite link (Link2), der eigentlich nur für den textlink gedacht ist, um jedes einzelne inhaltselement (Img above und Img) gelegt. und Link1, der eigentlich für das verlinkte bild (Img) gedacht war steht als leeres Element vor dem Bild.

ich wäre euch sehr zu dank verpflichtet, wenn mir jemand erklären könnte wo mein fehler liegt!!!

danke!
sami

hm.

bin nach einiger recherche nun auf die to do list zu templavoila gestoßen:
http://typo3.org/documentation/document-library/doc_tut_ftb1/ToDo_of_TemplaVoila/

Mapping will fail if you map an attribute which is in a tag containing others. There might be other bugs as well, slightly confusing.

daran wird's wohl liegen.

falls jemand eine idee hat wie ich das anders mit templavoila lösen könnte (img in a-tag), wäre ich recht dankbar!

lg, s.

hi sami
probier mal mit containern ala

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td> 
	<a href="#"><img src="bild.gif" alt="derAlt" width="" height="" border="0" /></a>
	</td>
  </tr>
  <tr>
    <td>
	<a href="#">schau mal da</a>
	</td>
  </tr>
</table>

auf der selben ebene:
a tag ist ein container/set inner, href ein attribut mit linkfield
eine ebene tiefer, also im container setzt du dann das img /set outer als element
für den Textlink:
den container setzt du auf die <tr> oder <td> und dann im container:
a href ein attribut mit linkfield
a tag element mit plain input field/set inner

Dein Beispiel modifiziert

<body>
    <div>
      <div>
        <img src="img/test.gif" alt="" />
     </div>
      <div>
     <a href="" class="link-01">
          <img src="img/test.gif" alt="" />
        </a>
     </div>
      <div>
        <a href="" class="link-02">Das ist ein Link</a>
      </div>
</div> 
</body>

bei deinem beispiel musst du also noch einen umschliessenden html-tag setzen, z.B. ein neues div oder einen span um den text
wenn du die root auf den Body setzt und einen section container um das erste div legst mit set inner und die container dann mit set outer um die inneren div, dann kannst du immer neue links und textlinks dazugenerieren im BE

grüsse kilian

hallo kilian,

danke für den vorschlag! kann ich mir gut vorstellen, dass es mit zusätzlichen containern auch funktionieren könnte.

ich hab's aber nicht probiert, da ich es mittlerweile schon anders (mit ein bisschen css hicksi-hacksi) gelöst hab.

der quelltext schaut jetzt so aus (ohne das erste bild):

<div>
  <img src="img/test.gif" alt="" />
  <a href="" class="link-01">Bild vergrößern</a>
  <a href="" class="link-02">Das ist ein Link</a>
</div>

dadurch, dass kein a-tag, dessen href-attribut ich mappen möchte ein html element enthält, funktioniert das mapping tadellos.

im css blende ich die schrift (mit großem text-indent) vom ersten link aus und lege den link (mit position:relative) über das bild.

vereinfacht also so:

a.link-01 {
  display:block;
  height:60px;
  width:60px;
  position:relative;
  top:-60px;
  text-indent:-5000px;
  background:url(../img/img-plus.gif) 0 50px no-repeat;
}

hat zwar nix mehr mit typo3 zu tun, aber vielleicht interessiert's ja trotzdem wen...

danke nochmal für die hilfe!

lg, simone

Hallo,

wenn ich ein <img>-Tag als imagefield mappe bringt mir das nur einen Bildupload.

Wie kann ich diesen aber noch um eine Auswahlmöglichkeit "float left", "float right", "center, rechtsbündig, linksbündig" ergänzen? Z.B. so dass die Auswahl eines dieser Zustände dem <img>-Tag dann noch eine class "floatleft" usw. hinzufügt.
Dann könnte ich diese Klasse ganz exakt per CSS kontrollieren (ich möchte nicht mit den default-Inhaltselementen von Typo3 arbeiten).

Ich habe durch googeln nicht so die richtige Lösung dafür gefunden und hoffe mir kann hier jemand sagen, wie man das bewerkstelligen kann...