There are questions remain, We'll search for the answers together. But one thing we known for sure,the future is not set!

【原创文章】修正ecshop相册图片title属性和自动给图片添加alt,title属性

ecshop 百蔬君 13607℃ 已收录 0评论

ecshop的相册大图有一个title属性,在百蔬网显示不正常,它将font属性也带进了属性值里面,导致显示不是很友好,如图

Snap1

 

这个<font color=#fe0000>代码在这里带入了title属性并显示了出来。这个可能和各自的ecshop皮肤有关,问题在于这里的titile属性调用了stylename。

\wwwroot\themes\你的主题\goods.dwt

  <!--商品图片和相册 start-->
 <div class="imgInfo">
 <a href="{$pictures.0.img_url}" id="zoom1" class="MagicZoom MagicThumb" title="{$goods.goods_name|escape:html}">
 <img src="{$goods.goods_img}" alt="{$goods.goods_name|escape:html}" width="310px;" height="310px"/>
 </a>
 可以看到这里的title调用的是$goods.goods_style_name,修改为goods_name就好了。具体为
      <!--商品图片和相册 start-->
 <div class="imgInfo">
 <a href="{$pictures.0.img_url}" id="zoom1" class="MagicZoom MagicThumb" title="{$goods.goods_name|escape:html}">
 <img src="{$goods.goods_img}" alt="{$goods.goods_name|escape:html}" width="310px;" height="310px"/>
 </a><!--商品图片和相册 start-->
后台更新一下缓存,就显示正常了。

商品详情页中的图片alt属性是比较重要的,他是百度等搜索引擎识别图片的一个重要途径,但是很多时候,我们上传图片的时候并没有设置这个alt属性,作为补救措施,我们一般可以把商品的标题作为这个alt属性的值,实现方法很简单,借用网上朋友分享的办法,一句话搞定。
修改include/lib_goods.php文件,在函数get_goods_info中

/* 修正商品图片 */ 
$row['goods_img']   = get_image_path($goods_id, $row['goods_img']); 
$row['goods_thumb'] = get_image_path($goods_id, $row['goods_thumb'], true);

下面添加代码

$row['goods_desc'] = preg_replace('/alt=([\'|\"]){2}/','alt="'.$row['goods_name'].'"',$row['goods_desc']);

这样,如果商品描述中alt为alt=””这样的代码,就会被替换成alt=”商品标题”,利于搜索引擎对图片的识别。

到了这里,我们当然可以更进一步了,把商品详情页中图片的title也加上了,修改上面这句代码就好

$row['goods_desc'] = preg_replace('/alt=([\'|\"]){2}/','alt="'.$row['goods_name'].'" title="'.$row['goods_name'].'"',$row['goods_desc']);

这样,当鼠标移动到图片上面的时候,就会显示这张图片是什么了,如图
Snap2

 切记:一定要更新缓存哦,效果马上就出来了,更新缓存,才会重新编译dwt文件。have a enjoy!

转载请注明:百蔬君 » 【原创文章】修正ecshop相册图片title属性和自动给图片添加alt,title属性

喜欢 (2)or分享 (0)
发表我的评论
取消评论

请证明您不是机器人(^v^):

表情