Описание механизма автоматической обработки всех изображений внутри DetailText элемента инфоблока, путем прогона всех изображений через собственную функцию
Поступила тут одна "хотелка" от клиента. спешу поделиться ее решением:)
Итак: есть сайт, на котором публикуется (точнее пока что планируется к публикации) огромное количество статей. В этих статьях по тексту контент-менеджеры могут накидывать какие-то изображения, поясняющие текст. НО! заниматься подгонкой изображений к читабельному виду для такого количества статей им то ли лень, то ли денег жалко ... и захотел клиент, чтобы все-таки изображения ужимались. причем, ужимались сервером, а не браузером клиента.
И вот родилась идея:
В компоненте детального вывода статьи в файле result_modifier создаю обработчик:
if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die(); $pattern="/<img[^>]+src=(\"|')(.+?)(\"|')[^>]*>/si"; preg_match_all($pattern,$arResult["DETAIL_TEXT"],$matches); $startfloat="right"; $arResult["DETAIL_TEXT"]=str_replace(SITE_SERVER_NAME,"",$arResult["DETAIL_TEXT"]); $arResult["DETAIL_TEXT"]=str_replace(str_replace("http://","http://www.",SITE_SERVER_NAME),"",$arResult["DETAIL_TEXT"]); foreach ($matches[0] as $k=>$image) { $imgSrc='<а class="fancy" href="'.$matches[2][$k].'">'; $imgSrc.=CFile::ShowImage($matches[2][$k], 300, 300, "style='float:".$startfloat.";margin:5px;'", "", false); $imgSrc.=" </а>"; $arResult["DETAIL_TEXT"]=str_replace($image,$imgSrc,$arResult["DETAIL_TEXT"]); if($startfloat=="right") $startfloat="left"; else $startfloat="right"; }
в итоге, все изображения ужимаются в 300 на 300, а если кто хочет - в fancybox (если конечно к вашему сайту подключена данная библиотека) может посмотреть в полном размере...
P.S. Спасибо другу моему, Андрею - великому гуру веб-мира, за постоянную помощь с регулярными выражениями (да и не только), с которыми я все никак не подружусь:(
ДОБАВЛЕНИЕ ОТ 22.03: оставляем у изображений title и alt.
Текст файла result_modifier немного видоизменился:
if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die(); $patternSRC="/[^>]+src=(\"|')(.+?)(\"|')[^>]*>/si"; $pattern2="/(alt|src|title)=(\"|')(.+?)(\"|')/si"; $pattern="/<img([^>]*)\/?>/si"; preg_match_all($pattern,$arResult["DETAIL_TEXT"],$matches); $modifiedImages=array(); foreach($matches[1] as $k=>$image){ preg_match_all($pattern2,$image,$Attrmatches); $attributes=array(); foreach($Attrmatches[1] as $kT=>$Tmp){ $attributes[$Tmp]=$Attrmatches[3][$kT]; } $modifiedImages[$matches[0][$k]]=$attributes; } $startfloat="right"; $arResult["DETAIL_TEXT"]=str_replace(SITE_SERVER_NAME,"",$arResult["DETAIL_TEXT"]); $arResult["DETAIL_TEXT"]=str_replace(str_replace("http://","http://www.",SITE_SERVER_NAME),"",$arResult["DETAIL_TEXT"]); foreach ($modifiedImages as $image=>$attributes) { $imgSrc='<a class="fancy" href="'.$attributes[" src"].'" title="'.$attributes["title"].'" >'; $imgSrc.=CFile::ShowImage($attributes["src"], 300, 300, "alt='".$attributes["alt"]."' title='".$attributes["title"]."' style='float:".$startfloat.";margin: 5px;'", "", false); $imgSrc.="</a>"; $arResult["DETAIL_TEXT"]=str_replace($image,$imgSrc,$arResult["DETAIL_TEXT"]); if($startfloat=="right") $startfloat="left"; else $startfloat="right"; }
Первым шагом выбираем все изображения из текста. А затем уже получаем все атрибуты для конкретного изображения и данные по изображению помещаем в массив.
А потом уже для каждого изображения делаем подмену в детальном тексте.
ДОБАВЛЕНИЕ ОТ 05.11.2017: подменяем у изображений title и alt.
В очередной доработке интернет-магазина под требования сео-оптимизации, поступила задача замены ALT-ов у изображений в новостях - ALT должен совпадать с названием товара. Все бы ничего, если бы изображения не были вставлены напрямую в текст новости. Для решения данной задачи написал небольшую подмену (заодно оставил и другие параметры изображения):
$patternSRC="/[^>]+src=(\"|')(.+?)(\"|')[^>]*>/si"; $pattern2="/(alt|src|title|width|height|align)=(\"|')(.+?)(\"|')/si"; $pattern="/<img([^>]*)\/?>/si"; preg_match_all($pattern,$arResult["DETAIL_TEXT"],$matches); $modifiedImages=array(); foreach($matches[1] as $k=>$image){ preg_match_all($pattern2,$image,$Attrmatches); $attributes=array(); foreach($Attrmatches[1] as $kT=>$Tmp){ $attributes[$Tmp]=$Attrmatches[3][$kT]; } $modifiedImages[$matches[0][$k]]=$attributes; } foreach ($modifiedImages as $image=>$attributes) { $img = '<img alt="'.$arResult['NAME'].'" src="'.$attributes['src'].'" title="'.$arResult['NAME'].'"' ; if(isset($attributes['width']) && floatval($attributes['width'])>0){ $img .= ' width="'.$attributes['width'].'"'; } if(isset($attributes['height']) && floatval($attributes['height'])>0){ $img .= ' height="'.$attributes['height'].'"'; } if(isset($attributes['align']) && strlen($attributes['align'])>0){ $img .= ' align="'.$attributes['align'].'"'; } $img .= '>'; $arResult["DETAIL_TEXT"]=str_replace($image,$img,$arResult["DETAIL_TEXT"]); }
Подайте заявку на разработку сайта на базе готового решения от компании 1С-Битрикс или одного из партнеров компании. Максимально подробно опишите, чему будет посвящен сайт, если это интернет-магазин - что он будет продавать, нужна ли мультиязычность, будут ли разные типы цен (розница, опт, крупный опт), будет ли интеграция с 1С, будет ли выгрузка товаров на различные торговые площадки...
Вы можете подать заявку на сопровождение вашего сайта на базе 1С-Битрикс. Сопровождение включает в себя: проверка актуальности обновлений сайта, проверка актуальности резервной копии, консультации по сайту. Опишите в заявке, какие еще объемы планируются на сопровождении и на какой срок вы планируете заключить договор на сопровождение - мы подберем подходящий вам бюджет на сопровождение
Вы можете подать заявку на выполнение определенного объема работ по сайту. Опишите в заявке объем работ. Это может быть разработка какого-то нового функционала, доработки по имеющемуся функционалу, доработки под требования сео-специалистов. На основании заявки вам будет сформирован бюджет работ, а также названы сроки на выполнение тех или иных работ.