为了能够使用lazy loading，我需要修改tt_news'图像输出的src属性，如下所示：
<img src="/foo/bar/baz.png" … /> // <-- before
<img data-original="/foo/bar/baz.png" … /> // <-- after, no src!
我试过了：
plugin.tt_news.displayList.content_stdWrap {
parseFunc < lib.parseFunc_RTE
HTMLparser = 1
HTMLparser.keepNonMatchedTags = 1
HTMLparser.tags.img.fixAttrib.src.unset = 1
}
但无济于事
src属性复制到data-original。那么，除了把头发拉出来，我该怎么办？
这不能通过typoscript解决，因为src属性在cImage函数中是硬编码的：
$theValue = '<img src="' . htmlspecialchars($GLOBALS['TSFE']->absRefPrefix .
t3lib_div::rawUrlEncodeFP($info[3])) . '" width="' . $info[0] . '" height="' . $info[1] . '"' .
$this->getBorderAttr(' border="' . intval($conf['border']) . '"') .
$params .
($altParam) . ' />';
我看到修改src属性的唯一方法是通过用户函数。 tt_news为用户函数提供了一个钩子，允许自定义处理图像（参见class.tx_ttnews.php的第2150行）。
例：
插入以下typoscript：
includeLibs.user_ttnewsImageMarkerFunc = fileadmin/templates/php/user_ttnewsImageMarkerFunc.php
plugin.tt_news.imageMarkerFunc = user_ttnewsImageMarkerFunc->ttnewsImageMarkerFunc
而文件user_ttnewsImageMarkerFunc.php包含：
<?php
class user_ttnewsImageMarkerFunc {
/**
* Fills the image markers with data.
*
* @param array $paramArray: $markerArray and $config of the current news item in an array
* @param [type] $conf: ...
* @return array the processed markerArray
*/
function ttnewsImageMarkerFunc($paramArray, $conf) {
$markerArray = $paramArray[0];
$lConf = $paramArray[1];
$pObj = &$conf['parentObj'];
$row = $pObj->local_cObj->data;
$imageNum = isset($lConf['imageCount']) ? $lConf['imageCount'] : 1;
$imageNum = t3lib_div::intInRange($imageNum, 0, 100);
$theImgCode = '';
$imgs = t3lib_div::trimExplode(',', $row['image'], 1);
$imgsCaptions = explode(chr(10), $row['imagecaption']);
$imgsAltTexts = explode(chr(10), $row['imagealttext']);
$imgsTitleTexts = explode(chr(10), $row['imagetitletext']);
reset($imgs);
if ($pObj->config['code'] == 'SINGLE') {
$markerArray = $this->getSingleViewImages($lConf, $imgs, $imgsCaptions, $imgsAltTexts, $imgsTitleTexts, $imageNum, $markerArray, $pObj);
} else {
$imageMode = (strpos($textRenderObj, 'LATEST') ? $lConf['latestImageMode'] : $lConf['listImageMode']);
$suf = '';
if (is_numeric(substr($lConf['image.']['file.']['maxW'], - 1))) { // 'm' or 'c' not set by TS
if ($imageMode) {
switch ($imageMode) {
case 'resize2max' :
$suf = 'm';
break;
case 'crop' :
$suf = 'c';
break;
case 'resize' :
$suf = '';
break;
}
}
}
// only insert width/height if it is not given by TS and width/height is empty
if ($lConf['image.']['file.']['maxW'] && ! $lConf['image.']['file.']['width']) {
$lConf['image.']['file.']['width'] = $lConf['image.']['file.']['maxW'] . $suf;
unset($lConf['image.']['file.']['maxW']);
}
if ($lConf['image.']['file.']['maxH'] && ! $lConf['image.']['file.']['height']) {
$lConf['image.']['file.']['height'] = $lConf['image.']['file.']['maxH'] . $suf;
unset($lConf['image.']['file.']['maxH']);
}
$cc = 0;
foreach ($imgs as $val) {
if ($cc == $imageNum)
break;
if ($val) {
$lConf['image.']['altText'] = $imgsAltTexts[$cc];
$lConf['image.']['titleText'] = $imgsTitleTexts[$cc];
$lConf['image.']['file'] = 'uploads/pics/' . $val;
$theImgCode .= str_replace('src="', 'class="lazy" data-original="', $pObj->local_cObj->IMAGE($lConf['image.'])) . $pObj->local_cObj->stdWrap($imgsCaptions[$cc], $lConf['caption_stdWrap.']);
}
$cc++;
}
if ($cc) {
$markerArray['###NEWS_IMAGE###'] = $pObj->local_cObj->wrap($theImgCode, $lConf['imageWrapIfAny']);
} else {
$markerArray['###NEWS_IMAGE###'] = $pObj->local_cObj->stdWrap($markerArray['###NEWS_IMAGE###'], $lConf['image.']['noImage_stdWrap.']);
}
}
if ($pObj->debugTimes) {
$pObj->hObj->getParsetime(__METHOD__);
}
// debug($markerArray, '$$markerArray ('.__CLASS__.'::'.__FUNCTION__.')', __LINE__, __FILE__, 2);
return $markerArray;
}
/**
* Fills the image markers for the SINGLE view with data. Supports Optionssplit for some parameters
*
* @param [type] $lConf: ...
* @param [type] $imgs: ...
* @param [type] $imgsCaptions: ...
* @param [type] $imgsAltTexts: ...
* @param [type] $imgsTitleTexts: ...
* @param [type] $imageNum: ...
* @return array $markerArray: filled markerarray
*/
function getSingleViewImages($lConf, $imgs, $imgsCaptions, $imgsAltTexts, $imgsTitleTexts, $imageNum, $markerArray, $pObj) {
$marker = 'NEWS_IMAGE';
$sViewSplitLConf = array();
$tmpMarkers = array();
$iC = count($imgs);
// remove first img from image array in single view if the TSvar firstImageIsPreview is set
if (($iC > 1 && $pObj->config['firstImageIsPreview']) || ($iC >= 1 && $pObj->config['forceFirstImageIsPreview'])) {
array_shift($imgs);
array_shift($imgsCaptions);
array_shift($imgsAltTexts);
array_shift($imgsTitleTexts);
$iC--;
}
if ($iC > $imageNum) {
$iC = $imageNum;
}
// get img array parts for single view pages
if ($pObj->piVars[$pObj->config['singleViewPointerName']]) {
/**
* TODO
* does this work with optionsplit ?
*/
$spage = $pObj->piVars[$pObj->config['singleViewPointerName']];
$astart = $imageNum * $spage;
$imgs = array_slice($imgs, $astart, $imageNum);
$imgsCaptions = array_slice($imgsCaptions, $astart, $imageNum);
$imgsAltTexts = array_slice($imgsAltTexts, $astart, $imageNum);
$imgsTitleTexts = array_slice($imgsTitleTexts, $astart, $imageNum);
}
if ($pObj->conf['enableOptionSplit']) {
if ($lConf['imageMarkerOptionSplit']) {
$ostmp = explode('|*|', $lConf['imageMarkerOptionSplit']);
$osCount = count($ostmp);
}
$sViewSplitLConf = $pObj->processOptionSplit($lConf, $iC);
}
// reset markers for optionSplitted images
for ($m = 1; $m <= $imageNum; $m++) {
$markerArray['###' . $marker . '_' . $m . '###'] = '';
}
$cc = 0;
foreach ($imgs as $val) {
if ($cc == $imageNum)
break;
if ($val) {
if (! empty($sViewSplitLConf[$cc])) {
$lConf = $sViewSplitLConf[$cc];
}
// if (1) {
// $lConf['image.']['imgList.'] = '';
// $lConf['image.']['imgList'] = $val;
// $lConf['image.']['imgPath'] = 'uploads/pics/';
// debug($lConf['image.'], ' ('.__CLASS__.'::'.__FUNCTION__.')', __LINE__, __FILE__, 3);
//
// $imgHtml = $pObj->local_cObj->IMGTEXT($lConf['image.']);
//
// } else {
$lConf['image.']['altText'] = $imgsAltTexts[$cc];
$lConf['image.']['titleText'] = $imgsTitleTexts[$cc];
$lConf['image.']['file'] = 'uploads/pics/' . $val;
$imgHtml = str_replace('src="', 'class="lazy" data-original="', $pObj->local_cObj->IMAGE($lConf['image.'])) . $pObj->local_cObj->stdWrap($imgsCaptions[$cc], $lConf['caption_stdWrap.']);
// }
//debug($imgHtml, '$imgHtml ('.__CLASS__.'::'.__FUNCTION__.')', __LINE__, __FILE__, 3);
if ($osCount) {
if ($iC > 1) {
$mName = '###' . $marker . '_' . $lConf['imageMarkerOptionSplit'] . '###';
} else { // fall back to the first image marker if only one image has been found
$mName = '###' . $marker . '_1###';
}
$tmpMarkers[$mName]['html'] .= $imgHtml;
$tmpMarkers[$mName]['wrap'] = $lConf['imageWrapIfAny'];
} else {
$theImgCode .= $imgHtml;
}
}
$cc++;
}
if ($cc) {
if ($osCount) {
foreach ($tmpMarkers as $mName => $res) {
$markerArray[$mName] = $pObj->local_cObj->wrap($res['html'], $res['wrap']);
}
} else {
$markerArray['###' . $marker . '###'] = $pObj->local_cObj->wrap($theImgCode, $lConf['imageWrapIfAny']);
}
} else {
if ($lConf['imageMarkerOptionSplit']) {
$m = '_1';
}
$markerArray['###' . $marker . $m . '###'] = $pObj->local_cObj->stdWrap($markerArray['###' . $marker . $m . '###'], $lConf['image.']['noImage_stdWrap.']);
}
// debug($sViewSplitLConf, '$sViewSplitLConf ('.__CLASS__.'::'.__FUNCTION__.')', __LINE__, __FILE__, 2);
return $markerArray;
}
}
?>
大多数代码都是从class.tx_ttnews.php复制的。重要的一行如下（在两个函数中的每个函数中）：
str_replace('src="', 'class="lazy" data-original="', $pObj->local_cObj->IMAGE($lConf['image.']))
然后你会得到以下图片标签：
<img class="lazy" data-original="uploads/pics/myimage.jpg" width="110" height="70" border="0" alt="" />
在2019年，tt_news仍然存在。我使用它与TYPO3 8 LTS，github的版本，因为它不再在官方扩展库中。 （对于新项目使用“新闻”）
所以我认为，因为tt_news必须在TYPO3 9中更新，所以通过改变tt_news / Classes / Plugin / TtNews.php来直接破解代码是合法的：
--- a/Classes/Plugin/TtNews.php
+++ b/Classes/Plugin/TtNews.php
@@ -2621,6 +2621,7 @@ class TtNews extends AbstractPlugin
$markerArray['###NEWS_IMAGE###'] = $this->local_cObj->stdWrap($markerArray['###NEWS_IMAGE###'],
$lConf['image.']['noImage_stdWrap.']);
}
+ $markerArray['###NEWS_IMAGE###'] = $this->LazyLoading($markerArray['###NEWS_IMAGE###']);
}
}
@@ -2632,6 +2633,13 @@ class TtNews extends AbstractPlugin
}
+ function LazyLoading($html){
+ $html = str_replace('src="', 'class="lazy" data-original="', $html);
+ return $html;
+ }
+
+
/**
* Fills the image markers for the SINGLE view with data. Supports Optionssplit for some parameters
*