Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.

#1 01. Januar 2011 21:35

tbillert
kennt CMS/ms
Ort: Jena
Registriert: 27. Dezember 2010
Beiträge: 105
Webseite

[gelöst] Image captions: Bild zentrieren

Hallo nochmal,

ich habe nochmal eine Frage zum Stylen von Bildern. Meine Site benutzt image captions, um Bildern automatisch Bildunterschriften hinzuzufuegen.  Image captions habe ich nach

http://wiki.cmsmadesimple.org/index.php … aptions/de

installiert und angepasst. Daraus ergeben sich 2 Klassen, "leftcaption" und "rightcaption", die ich Bildern mitgebe, damit sie incl. captions links- oder rechtsbuendig angezeigt werden.

Das klappt alles, nur leider sehe ich keine Moeglichkeit, Bilder mit Captions zu zentrieren. Ich habe auch keinen Plan, wo die beiden Klassen definiert werden - nach Anleitung traegt man dazu was in "Stile"-Textbox des tinyMCE ein, das war's.

Ich habe mal unter

http://geojena.billert.de/index.php?page=testseite

insbesondere fuer meinen Website-Kompanion alle Moeglichkeiten der Bilddarstellung hinterlegt. Dort fehlen eben noch die 2 zentrierten Versionen, einmal "Bild mit Caption, zentriert" und "Lytebox mit Caption, zentriert". Hier mal der Code fuer die Bilder mit Captions:

<p style="text-align: center;"><strong>Bild mit Caption, zentriert:</strong></p>
<p> </p>
<p><strong>Bild mit Caption, linksbündig:<br /></strong></p>
<p><img class="leftcaption" title="Ein sehr gut erhaltenes kleines Exemplar von &lt;em&gt;Beneckeia tenuis&lt;em&gt;" src="uploads/images/Fossilien/beneckeia2.jpg" alt="Ein sehr gut erhaltenes kleines Exemplar von Beneckeia tenuis" width="480" height="268" /></p>
<p>Text rechts daneben</p>
<br class="clear" /><br />
<p style="text-align: right;"><strong>Bild mit Caption, rechtsbündig:</strong></p>
<p><img class="rightcaption" title="Ein sehr gut erhaltenes kleines Exemplar von &lt;em&gt;Beneckeia tenuis&lt;em&gt;" src="uploads/images/Fossilien/beneckeia2.jpg" alt="Ein sehr gut erhaltenes kleines Exemplar von Beneckeia tenuis" width="480" height="268" /></p>
<p>Text links daneben</p>
<br class="clear" /><br /> 

...und der fuer die Lyteboxes mit Caption:

<p style="text-align: center;"><strong>Lytebox mit Caption, zentriert:</strong></p>
<br class="clear" />
<p><strong>Lytebox mit Caption, linksbündig:</strong></p>
<p>{Lytebox href='uploads/images/Fossilien/beneckeia2.jpg' title='Ein sehr gut erhaltenes kleines Exemplar von <em>Beneckeia tenuis</em><br />(zum Vergrößern klicken)' text='' thumbsrc='uploads/images/Fossilien/beneckeia2.jpg' thumbextra='class="leftcaption" border=0'}</p>
<p>Text rechts daneben</p>
<br class="clear" />
<p><strong>Lytebox mit Caption, rechtsbündig:</strong></p>
<p>{Lytebox href='uploads/images/Fossilien/beneckeia2.jpg' title='Ein sehr gut erhaltenes kleines Exemplar von <em>Beneckeia tenuis</em><br />(zum Vergrößern klicken)' text='' thumbsrc='uploads/images/Fossilien/beneckeia2.jpg' thumbextra='class="rightcaption" border=0'}</p>
<p>Text rechts daneben</p>
<br class="clear" />

Kann mir jemand nen Tip geben, wie ich diese beiden Versionen zentrieren koennte?

Danke + Gruss,

Thomas.

Beitrag geändert von tbillert (19. Januar 2011 00:58)

Offline

#2 02. Januar 2011 08:32

Connie
Server-Pate
Ort: Gribow
Registriert: 12. Dezember 2010
Beiträge: 216
Webseite

Re: [gelöst] Image captions: Bild zentrieren

Hast du das Tutorial im Wiki angeschaut?

http://wiki.cmsmadesimple.org/index.php … aptions/de

da ist beschrieben wie das Template anzupassen ist..

das CSS findest du zum Download hier: http://dev.cmsmadesimple.org/project/files/443

ich erinnere mich, dass ich auch mal mit diesem Teil versucht habe, es mittig zu setzen, weiss aber nicht mehr ob und wie ich es gemacht habe, habe mir nichts notiert, habs auch nirgends im Einsatz

Beitrag geändert von Connie (02. Januar 2011 08:34)

Offline

#3 02. Januar 2011 12:54

tbillert
kennt CMS/ms
Ort: Jena
Registriert: 27. Dezember 2010
Beiträge: 105
Webseite

Re: [gelöst] Image captions: Bild zentrieren

Hallo Connie,

danke, ja, die Seiten kenne ich. Nach der Anleitung im Wiki habe ich Imagecaptions ja installiert. Und das CSS hatte ich uebernommen, darin steuert man aber nur Farben, Textstil etc. der Captions und Bilderrahmen.

Wenn ich mal wuesste, wo die beiden Klassen fuer links- und rechtsbuendige Bilder mit Captions zu finden sind (in den CSS steht dazu nichts), dann koennte ich mir da ja was abkupfern. In der Anleitung im Wiki kommen die nur hier vor:

Füge folgenden Text in die "Stile" Textbox ein: (Image:Styles textbox):
Bildunterschrift=caption; Bildunterschrift (rechts)=rightcaption; Bildunterschrift (links)=leftcaption;

Danach stehen sie in tinyMCE im CSS-Dropdown in den Bildeingenschaften zur Verfuegung. Es gibt noch eine 3. Klasse "caption", die hilft aber auch nicht (Bild steht ebenfalls links).

So, eben habe ich beim Schreiben des Beitrags was ganz simples probiert: einfach das Bild in Captions in ein <center></center> gesetzt. Das klappt. Kann man leider nicht via tinyMCE machen, wenn man dort das Bild markiert und den "Zentriert"-Button klickt, dann wird das Bild in einen <p style="text-align: center;"></p> gepackt, was nichts hilft. Das geht auch mit einer Lytebox incl. Captions.

AAAABER: einmal in WYSIWYG zurueckgeschaltet und gespeichert, und weg ist der <center>-Tag - und weg auch die Zentriertung. Ich finde tinyMCE nicht wirklich angenehm. Leider soll mal jemand die Site pflegen, der kaum Ahnung von HTML hat, so dass eine WYSIWYG-Loesung schon ein Muss ist.

Ach ja, und aus <em> macht das Dingen weiterhin &lt;em&gt; - baeh.

Hat noch jemand Ideen? Vielleicht gibt es eine vernuenftige Alternative zu tinyMCE?

Gruss,

Thomas.

Offline

#4 19. Januar 2011 00:57

tbillert
kennt CMS/ms
Ort: Jena
Registriert: 27. Dezember 2010
Beiträge: 105
Webseite

Re: [gelöst] Image captions: Bild zentrieren

Offline

#5 19. Januar 2011 08:55

owr_web
Server-Pate
Registriert: 16. Dezember 2010
Beiträge: 543

Re: [gelöst] Image captions: Bild zentrieren

Auch wenns schon gelöst ist:

Betreffend die Umformatierungen im tiny - hast du es schon mit benutzerdefinierten Listenfeldern versucht?

Erweiterungen -> tinyMCE ->Weitere Optionen
Die ich drinnen hab (ich mach es mit einigen smarty so) wird z.B. die { auch als solche übernommen und nicht als entity. So könntest du auch dem Nutzer einige automatisierte Dinge mit auf den Weg geben, die für ihn eine Erleichterung sind.

Offline

#6 19. Januar 2011 10:09

tbillert
kennt CMS/ms
Ort: Jena
Registriert: 27. Dezember 2010
Beiträge: 105
Webseite

Re: [gelöst] Image captions: Bild zentrieren

Hallo owr_web,

diesen Tip hatte ich auch schon bekommen. Brauche ich nun nicht mehr, da die Loesung mit fancybox und imagecaption fuer den Anwender von tinyMCE komplett transparent ist:

- caption wird erzeugt, sobald etwas im ALT-Tag (Feld "Beschreibung") des Bildes steht
- fuer eine fancybox-Anzeige fuege ich das kleine Bild ganz normal ein, mache da einen Link auf das grosse drauf und setze die ID des Links noch entsprechend, so dass das System erkennen kann, dass das eine fancybox werden soll.

Ansonsten lassen sich die so eingefuegten Bilder ganz normal ueber die Absatzausrichtung auf der Seite platzieren, soweit ich das bisher getestet habe. Eine sehr zufriedenstellende Loesung!

Gruss,

Thomas.

Offline