在当今这个信息爆炸的时代,网站建设已经成为了企业、个人展示自己的重要手段。而DedeCMS作为一款功能强大、易于使用的开源内容管理系统,受到了广大用户的喜爱。在DedeCMS中,专题图片的调用是网站建设中不可或缺的一部分。本文将为大家详细介绍DedeCMS专题图片调用的技巧与实战解析,帮助大家轻松掌握这一技能。
一、DedeCMS专题图片调用概述
1. 什么是专题图片?
专题图片是指在网站中用于展示某一主题内容的图片,它能够吸引用户的注意力,提升网站的整体视觉效果。在DedeCMS中,专题图片通常用于专题页面的头部、正文、侧边栏等位置。
2. 专题图片调用的作用
(1)增强视觉效果:专题图片能够使网站更具吸引力,提升用户体验。
(2)突出主题:通过专题图片的展示,可以更加直观地传达网站的主题内容。
(3)提高搜索引擎排名:合理运用专题图片,有助于提高网站在搜索引擎中的排名。
二、DedeCMS专题图片调用技巧
1. 选择合适的图片格式
在DedeCMS中,专题图片通常采用JPEG、PNG等格式。JPEG格式适合于照片类的图片,而PNG格式适合于图标、图形等图片。选择合适的图片格式,可以提高图片的加载速度。
2. 图片尺寸与分辨率
(1)图片尺寸:专题图片的尺寸应根据实际需求进行设置。一般来说,头部图片宽度为全屏宽度,高度为固定值;正文图片宽度为自适应,高度为固定值;侧边栏图片宽度为固定值,高度为自适应。
(2)图片分辨率:图片分辨率越高,图片质量越好。但过高的分辨率会导致图片文件过大,影响加载速度。建议图片分辨率为72dpi。
3. 图片优化
(1)压缩图片:使用图片压缩工具对图片进行压缩,减小图片文件大小,提高加载速度。
(2)使用CSS精灵技术:将多个图片合并为一个,减少HTTP请求次数,提高页面加载速度。
4. 图片水印
(1)添加水印:在图片上添加水印,可以保护图片版权。
(2)水印位置:水印位置应选择不易影响图片美观的位置,如图片角落。
三、DedeCMS专题图片调用实战解析
1. 头部图片调用
(1)在DedeCMS后台,找到“专题管理”模块。
(2)点击“添加专题”,填写专题信息。
(3)在“专题封面”处,选择或上传图片。
(4)保存专题,即可在网站中调用头部图片。
2. 正文图片调用
(1)在DedeCMS后台,找到“文章管理”模块。
(2)点击“添加文章”,填写文章信息。
(3)在“”编辑器中,插入图片。
(4)保存文章,即可在网站中调用正文图片。
3. 侧边栏图片调用
(1)在DedeCMS后台,找到“模板管理”模块。
(2)选择要编辑的模板,进入模板编辑界面。
(3)在模板代码中,找到侧边栏图片调用位置。
(4)将图片路径替换为实际图片路径。
(5)保存模板,即可在网站中调用侧边栏图片。
DedeCMS专题图片调用是网站建设中的一项重要技能。通过本文的介绍,相信大家对DedeCMS专题图片调用有了更深入的了解。在实际操作中,大家可以根据自己的需求,灵活运用这些技巧,打造出美观、实用的网站。希望本文对大家有所帮助!
dedecms列表调用内容多张图片
普通文章列表调用内容多张图片不能用图集模型的办法,需要自己写一个函数,在include/extend.func.php增加函数
functionGetpic($body)
{
$getpic='';
preg_match_all(“/(src)=[\”|'|]{0,}([^>]*\.(gif|jpg|bmp|png))/isU”,$body,$img_array);
$img_array=array_unique($img_array[2]);
if(count($img_array)>0)
{
foreach($img_arrayas$key=>$value)
{
$picname=preg_replace(“/[\”|'|]{1,}/”,'',$value);
$getpic.=”<p><imgsrc='”.$picname.”'border=0/></p>”;
}
}
else
{
$getpic=”<p>没有图片</p>”;
}
return$getpic;
}
列表页模版使用标签
{dede:listpagesize='10'addfields='body'}
<li><ahref='[field:arcurl/]'target='_blank'>
<spanclass=”title”>[field:title/]</span>
[field:bodyfunction='Getpic(@me)'/]
</a></li>
{/dede:list}
同时到网站后台-内容模型管理,修改普通文章模型附加列表字段增加body
保存后,就可以更新列表了,这样就能在列表页显示文章正文内所有图片
dedecms图片问题:前台调用后台图片,实现后台控制前台图片
这个简单,织梦后台有上传文件功能,你只需要吧所有图片都按顺序命名,比如:banner1.jpg、banner2.jpg、banner3.jpg等等,然后把图片传到指定的文件夹。
然后在后台的基本参数增加新变量,变量名为:cfg_banner,如下图
接着我们拿images文件夹为例子,模板中这样写:
<img src=”/images/banner{dede:global.cfg_banner/}.jpg”>
这样你只需在后台修改数字1、2、3、4就可以改变相应图片了
dedecms5.7调用图片出现严重失真,缩略图显示严重变形
首先在网站后台系统中设置网站缩略图尺寸大小和模板中调用图片最大尺寸相同.
再打开文件include/helpers/extend.helpes.php在最下面加上以下代码
if(! function_exists('thumb'))
{
function thumb($imgurl,$width,$height,$bg= true)
{
global$cfg_mainsite,$cfg_multi_site;
$thumb= eregi(“http://”,$imgurl)?str_replace($cfg_mainsite,'',$imgurl):$imgurl;
list($thumbname,$extname)= explode('.',$thumb);
$newthumb=$thumbname.'_'.$width.'_'.$height.'.'.$extname;
if(!$thumbname||!$extname||!file_exists(DEDEROOT.$thumb)) return$imgurl;
if(!file_exists(DEDEROOT.$newthumb))
{
include_once DEDEINC.'/image.func.php';
if($bg==true)
{
ImageResizeNew(DEDEROOT.$thumb,$width,$height, DEDEROOT.$newthumb);
}
else
{
ImageResize(DEDEROOT.$thumb,$width,$height, DEDEROOT.$newthumb);
}
}
return$cfg_multi_site=='Y'?$cfg_mainsite.$newthumb:$newthumb;
}
}
调用方法:
标签: [field:picname function='thumb(@me,$width,$height,$bg)'/]
参数说明:
$width:缩略图宽度(整数)
$height:缩略图高度(整数)
$bg:是否用空白填补,默认自动填补,背景填充颜色在系统-附件设置里(true/false)
举例:
调用长宽为100像素的缩略图:[field:picname function='thumb(@me,100,100)'/]
保留原有比例,不自动填充(不建议):[field:picname function='thumb(@me,100,100,false)'/]
再到 include/helpers/image.helpes.php中写入以下代码
/**
*缩图片自动生成函数,来源支持bmp、gif、jpg、png
*但生成的小图只用jpg或png格式
*@access public
*@param string$srcFile图片路径
*@param string$toW转换到的宽度
*@param string$toH转换到的高度
*@param string$toFile输出文件到
*@return string
*/
if(! function_exists('ImageResize'))
{
function ImageResize($srcFile,$toW,$toH,$toFile=””)
{
global$cfg_photo_type;
if($toFile==””)
{
$toFile=$srcFile;
}
$info=””;
$srcInfo= GetImageSize($srcFile,$info);
switch($srcInfo[2])
{
case 1:
if(!$cfg_photo_type['gif'])
{
return false;
}
$im= imagecreatefromgif($srcFile);
break;
case 2:
if(!$cfg_photo_type['jpeg'])
{
return false;
}
$im= imagecreatefromjpeg($srcFile);
break;
case 3:
if(!$cfg_photo_type['png'])
{
return false;
}
$im= imagecreatefrompng($srcFile);
break;
case 6:
if(!$cfg_photo_type['bmp'])
{
return false;
}
$im= imagecreatefromwbmp($srcFile);
break;
}
$srcW=ImageSX($im);
$srcH=ImageSY($im);
if($srcW<=$toW&&$srcH<=$toH)
{
return true;
}
//缩略生成并裁剪
$newW=$toH*$srcW/$srcH;
$newH=$toW*$srcH/$srcW;
if($newH>=$toH)
{
$ftoW=$toW;
$ftoH=$newH;
}
else
{
$ftoW=$newW;
$ftoH=$toH;
}
if($srcW>$toW||$srcH>$toH)
{
if(function_exists(“imagecreatetruecolor”))
{
@$ni= imagecreatetruecolor($ftoW,$ftoH);
if($ni)
{
imagecopyresampled($ni,$im,0,0,0,0,$ftoW,$ftoH,$srcW,$srcH);
}
else
{
$ni=imagecreate($ftoW,$ftoH);
imagecopyresized($ni,$im,0,0,0,0,$ftoW,$ftoH,$srcW,$srcH);
}
}
else
{
$ni=imagecreate($ftoW,$ftoH);
imagecopyresized($ni,$im,0,0,0,0,$ftoW,$ftoH,$srcW,$srcH);
}
//裁剪图片成标准缩略图
$new_imgx= imagecreatetruecolor($toW,$toH);
if($newH>=$toH)
{
imagecopyresampled($new_imgx,$ni,0,0,0,($newH-$toH)/2,$toW,$toH,$toW,$toH);
}
else
{
imagecopyresampled($new_imgx,$ni,0,0,($newW-$toW)/2,0,$toW,$toH,$toW,$toH);
}
switch($srcInfo[2])
{
case 1:
imagegif($new_imgx,$toFile);
break;
case 2:
imagejpeg($new_imgx,$toFile,85);
break;
case 3:
imagepng($new_imgx,$toFile);
break;
case 6:
imagebmp($new_imgx,$toFile);
break;
default:
return false;
}
imagedestroy($new_imgx);
imagedestroy($ni);
}
imagedestroy($im);
return true;
}
}
即可
QQ:51461981




