RJ45.jpg

Floating Text mit Bild

floating1.gif

Die Situation ist schnell erklärt: Wie kann man einen Text/ Text mit Bild u.a.m dazu bringen, einen anderen CP zu umfließen. Das Ergbins soll dann so wie im Bild zu sehen funktionieren. Mit dem phpWCMS u.a. der CP Text mit Bild "nur" mit einem standard.tmpl ausgeliefert :-(

 

Und genau an dieser Stelle setzte meine Idee ein, die ganze Sache fexibler zu machen. Hilfestellung kam von pepe (Danke für den Ansatz).

 

Das neue Template

nachfolgendes Template unter /template/inc_cntpart/imagetext/templatename.tmpl ablegen!


[IMAGETEXT]
<div class="image-with-text-floating">
     {IMAGETEXT}
</div>
[/IMAGETEXT]


frontend.css:

folgende CSS-Ergänzung einfügen:


.image-with-text-floating {
border:2px solid orange;
float:right;
margin-left:15px;
margin-top:5px;
padding:0.8em;
width:25%;}


Das Ergebnis:

Und wenn die obigen Ergänzungen erledigt sind, einfach zwei, drei CPs (TextMitBild) erstellen und eines davon mit dem neuen Template versehen. (Auwahlpopup: Vorlage im CP TextMitBild)

 

Achtung, die Reihenfolge, wer welchen Text umfließt hängt von der Reihenfolge der CPs ab, spielt einfach mal damit rum, dann bekommt man den Dreh schnell raus! Und einziger Hacken, der keiner ist, die Überschriften H!,2,3 sollten separat erzeugt werden, sonst hat man das Problem mit der Formatirung dieser Teile mit dem Floating Text.

Siehe unten: Die Überschrift habe ich her mit CP Einfacher Text erzeugt -Ende -Aus- Fertig.

Und so kann das Ergebnis aussehen:

floating1.gif

Lorem Ipsum ist ein einfacher Demo-Text für die Print- und Schriftindustrie. Lorem Ipsum ist in der Industrie bereits der Standard Demo-Text seit 1500, als ein unbekannter Schriftsteller eine Hand voll Wörter nahm und diese durcheinander warf um ein Musterbuch zu erstellen. Es hat nicht nur 5 Jahrhunderte überlebt, sondern auch in Spruch in die elektronische Schriftbearbe

Nachbarin.jpg

ebenfalls mit Lorem Ipsum.Lorem Ipsum ist ein einfacher Demo-Text für die Print- und Schriftindustrie. Lorem Ipsum ist in der Industrie bereits der Standard Demo-Text seit 1500, als ein unbekannter Schriftsteller eine Hand voll Wörter nahm und diese durcheinander warf um ein Musterbuch zu erstellen. Es hat nicht nur 5 Jahrhunderte überlebt, sondern auch in Spruch in die elektronische Schriftbearbeitung geschafft (bemerke, nahezu unverändert). Bekannt wurde es 1960, mit dem erscheinen von "Letraset", welches Passagen von Lorem Ipsum enhielt, so wie Desktop Software wie "Aldus PageMaker" - ebenfalls mit Lorem Ipsum.

Hier gehts weiter

Karussell.jpg

Curabitur vitae justo id lorem pharetra facilisis ut eget erat. Vivamus commodo egestas arcu ac adipiscing. Mauris lacinia, odio a dictum cursus, nibh turpis hend

Donec nisl leo, cursus nec posuere vel, malesuada sit amet magna. Fusce interdum sollicitudin bibendum! Praesent nunc tortor, laoreet eget aliquet sed, malesuada quis mi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut orci leo, eleifend vel blandit sit amet, volutpat nec velit. Curabitur consectetur, ante ac cursus vestibulum; libero turpis luctus arcu, non gravida lorem dui eu lorem. Duis sollicitudin interdum metus, quis feugiat est hendrerit at! Curabitur dignissim tellus nulla, ut pellentesque leo. Nullam

| zurück/back | Impressum | Sitemap | Kontakt | Datenschutz | © 2008 · Spielwiese · powered by PHPcms