• 七角七分博客欢迎大家光临

织梦仿产品展示页产品图集调用方法参考

综合资讯 七七 2年前 (2022-03-21) 0个评论

网上看到的一个方法,CSS得自己写,大致内容如 下,可供参考。

织梦仿产品图集调用这个一直困扰我这个技术渣渣多年,请教别人只是教了一个大概半天了还是木有搞懂,于是自己去免费的织梦模板网站下了一个网站模板借来参考具体如下代码:

<div class="cpright">
<div class="rtop">
<h5><a href="{dede:field name='typeurl'/}">{dede:field name='typename' function="GetTypeName(@me)"/}</a></h5>
<span><em>您的位置:</em>{dede:field name='position'/}</span>
</div>
<div class="pro_main">
<div id="printableview">
<div class="pleft">
<div class="mainbox">
<div class="maincont">
<!-- prodetailsinfo -->
<div class="prodetailsinfo">
<div class="proviewbox">
{dede:field name='imgurls' alt='图片输出区'}
<div class="probigshow"> <a class="jqzoom" href="[field:imgsrc/]"> <img src="[field:imgsrc/]" alt="" class="js_goods_image_url" style="width: 300px;" /></a> </div>
{/dede:field}
<div class="div_prothumb">
<div class="thumbporbox">
<ul class="ul_prothumb" id="img_list">
{dede:productimagelist} 
<li><a href="[field:imgsrc/]" target="_blank"><img longdesc="[field:imgsrc/]" src="[field:imgsrc/]"></a></li>
{/dede:productimagelist}
</ul>
</div>
<span class="span_prev span_prevb">prev</span><span class="span_next span_nextb">next</span>
</div>
</div>
<!-- prodbaseinfo_a -->

 

 

我们需要用到的调用代码如下:当然目前其他展示类型的网站我还没有去测试,适用于那种图片放大器展示功能的代码调用:
我们要用到的如下调用代码:

<div class=”proviewbox”>
<!–我们要用到的这部分代码开始–>
{dede:field name=’imgurls’ alt=’图片输出区’}
<div class=”probigshow”> <a class=”jqzoom” href=”[field:imgsrc/]”> <img src=”[field:imgsrc/]” alt=”” class=”js_goods_image_url” style=”width: 300px;” /></a>
{/dede:field}
<!–我们要用到的这部分代码结束–>
</div>

<ul class=”ul_prothumb” id=”img_list”>
<!–我们要用到的这部分代码开始–>
{dede:productimagelist}
<li><a href=”[field:imgsrc/]” target=”_blank”><img longdesc=”[field:imgsrc/]” src=”[field:imgsrc/]”></a></li>
{/dede:productimagelist}
<!–我们要用到的这部分代码结束–>
</ul>

 

原来网站的产品详情页展示效果:
织梦仿产品展示页产品图集调用方法参考

我仿站的测试产品展示内容效果:(图片我是放的两张的一样的)
织梦仿产品展示页产品图集调用方法参考

 

喜欢 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址