[TYPO3-german] RTE-Bilder mit Bildunterschrift aus title
Jochen Overwien
jochen.overwien at gmx.de
Sat Feb 15 22:50:35 CET 2014
Hallo,
und nun hier meine Lösung mit der Custom transformation API -
Inspiration war
http://www.typo3.net/forum/thematik/zeige/thema/19909/seite/2/.
1. Schritt
Eine Datei "custom_transformation.inc" in fileadmin/ erstellen. Inhalt:
<?php
/*
Custom RTE transformation
*/
class user_transformation {
var $pObj;
var $transformationKey = 'tx_mytransform';
var $conf;
function initConfig() {
$this->conf =
$this->pObj->procOptions['usertrans.'][$this->transformationKey.'.'];
}
function transform_db($value) {
$this->initConfig();
if ($this->conf['extractImageTitle']){
$value = preg_replace('#<img.+?title="([^"]*)".*?/?>#i', '<img $0<div
class="bu">$1</div>', $value);
}
return $value;
}
function transform_rte($value) {
$this->initConfig();
if ($this->conf['extractImageTitle']){
$value = preg_replace('#<div.+?class="bu">.*?/?>#i', '', $value);
}
return $value;
}
}
?>
2. transformation key in der localconf.php registrieren
$TYPO3_CONF_VARS['SC_OPTIONS']['t3lib/class.t3lib_parsehtml_proc.php']['transformation']['tx_mytransform']
= 'fileadmin/custom_transformation.inc:user_transformation';
3. TSconfig
RTE.config.tt_content.bodytext.proc.overruleMode = ts_css,tx_mytransform
RTE.config.tt_content.bodytext.types.text.proc.overruleMode =
ts_css,tx_mytransform
RTE.config.tt_content.bodytext.types.textpic.proc.overruleMode =
ts_css,tx_mytransform
RTE.config.tt_news.bodytext < RTE.config.tt_content.bodytext
RTE.default.proc.usertrans.tx_mytransform = 1
RTE.default.proc.usertrans.tx_mytransform.extractImageTitle= 1
4. CSS
.bu {float: left}
Was passiert bei der obigen Transformation?
Die function transform_db sucht alle img-tags und ließt den jeweiligen
title-Attributwert (der in meinem Fall aus DAM kommt) aus. Dieser wird
in einem <div class=bu">...</div> ausgegeben. Durch das Speichern in der
Datenbank erfolgt die Ausgabe gestylt durch das CSS auf der Website.
Damit im RTE dieser Untertitel jedoch nicht ausgegeben wird, löscht die
function transform_rte wieder das komplette <div class=bu">...</div>
wieder. Der Redakteur sieht also im RTE nur das Bild und seinen normalen
Text.
Durch
RTE.config.tt_news.bodytext < RTE.config.tt_content.bodytext
wird die Transformation auch für tt_news übernommen.
Zunächst erfüllt diese Transformation meine Anforderungen.
Schön wäre noch eine Checkbox im RTE 'title als Bildunterschrift
rendern?'. Mal schauen.
Jochen
-------- Original-Nachricht --------
Betreff: Re: [TYPO3-german] RTE-Bilder mit Bildunterschrift aus title
Von: derSven <kreativ at dersven.de>
An: German TYPO3 Userlist <typo3-german at lists.typo3.org>
Datum: 12.02.2014 10:37
> Hallo.
>
> ich verwende tx_news und habe ebenfalls die Projektanforderung innerhalb
> des RTE Bilder einfügen zu können.
> Und auch die Option das man das Title Feld als Bildunterschrift anhängt.
>
> Ich habe eine "schmutzige" Javascript-Lösung gebastelt. Weil mir keine
> TS Lösung zur Hand lag. Es ist wohl nihct ganz trival.
>
> Und es nervt wenn dann immer erzählt wird das es vom Redakteur doch
> einfacher sei, mit IRRE und CEs das zu machen. Es sind halt emens mehr
> klicks und fenster mit Feldern nötig um eben ein Text in den Text zu
> setzen.
>
> Es funktioniert schon ganz gut. wenn man dem Redakteur so einschränken
> will das er nur Bilder im Text einbringen darf, die nur linksbündig
> sind. Also gefragt ist oft weniger als mehr.
>
>
> $('.news-text-wrap img').wrap('<figure
> class="csc-textpic-image"></figure>');
> $('.news-text-wrap img').after('<figcaption></figcaption>');
> $('.news-text-wrap .csc-rtetextpic-image').wrap('<div
> class="csc-rtetextpic-imagewrap"></div>')
>
> /// -- --- ///
>
> var anzahlBilder = $('.csc-textpic-text img').length;
> var altArray = [];
>
> for(var i=0; i < anzahlBilder; i++) {
> altArray[i] = $('.csc-textpic-text img:eq('+ i +')').attr('alt');
> $('.csc-textpic-text figcaption:eq('+ i +')').text(altArray[i]);
> }
>
> Grüße Sven
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
More information about the TYPO3-german
mailing list