<!-- 引入html代码 -->
<!doctype html>
<html class="no-js" lang="zxx">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>{$zan.field.seo_title}</title>
<meta name="description" content="{$zan.field.seo_description}" />
<meta name="keywords" content="{$zan.field.seo_keywords}" />
<link href="{zan:global name='web_ico' /}" rel="shortcut icon" type="image/x-icon" />
{zan:static file="skin/css/vendor.css" /}
{zan:static file="skin/css/main.css" /}
{zan:static file="skin/css/simple-line-icons.css" /}
{zan:static file="skin/js/jquery-3.7.0.min.js" /}
</head>
<body>
<div class="wrapper">
<!-- 页头 -->
{zan:include file="header.htm" /}
<!-- 页头 -->
<!-- -->
<section class="breadcrumb-area bg-image bg-100" e-page="pro">
<!-- 标题 -->
<h1 class="page__title">{$zan.field.typeid|gettoptype=###,'typename'}</h1>
<!-- 标题 -->
<!-- 文本 -->
<p class="page__desc"><em class="zan-edit" e-id="pro1" e-type="text">
{zan:uitext e-id='pro1' e-page="pro"}
{$field.value}
{zan:else /}Yoga and Gym wear{/zan:uitext}</em> <br> <em class="zan-edit" e-id="pro2"
e-type="text">{zan:uitext e-id='pro2' e-page="pro"}
{$field.value}
{zan:else /}up to{/zan:uitext}</em> <strong class="zan-edit" e-id="pro3"
e-type="text">{zan:uitext e-id='pro3' e-page="pro"}
{$field.value}
{zan:else /}39%{/zan:uitext}</strong> <em class="zan-edit" e-id="pro4" e-type="text">{zan:uitext
e-id='pro4' e-page="pro"}
{$field.value}
{zan:else /}off
{/zan:uitext}</em>
</p>
<!-- 文本 -->
<!-- 图片上传 -->
<div class="zan-edit" e-id="pro5" e-type="upload">
{zan:uiupload e-id='pro5' e-page='pro' id='field'}
{$field.value}
{zan:else /}<img src="{zan:global name='web_templets_pc' /}/skin/images/breadcrumb-2.png"
class="breadcrumb-img">{/zan:uiupload}
</div>
<!-- 图片上传 -->
</section>
<main class="main-content-wrapper" e-page="npro">
<div class="page-content-inner ptb--8r">
<!-- 产品详情 -->
<section class="product-summary-area bg-color ptb--8r mb--8r" data-bg-color="#f7f8fe">
<div class="container container-2">
<div class="row no-gutters product-summary-row-2">
<!-- 产品图 -->
<div class="product-main-image mb-md--5r">
<div class="product-gallery product-gallery--2">
<div class="product-gallery__large-image">
<div class="trinity-element-carousel main-slider image-popup"
data-slick-options='{
"slidesToShow": 1,
"slidesToScroll": 1,
"infinite": true,
"arrows": false,
"asNavFor": ".nav-slider"
}'>
{zan:volist name="$zan.field.image_list"}
<figure class="product-gallery__image zoom">
<img src="{$field.image_url}" alt="{$field.intro}">
<div class="product-gallery__actions">
<a href="{$field.image_url}" class="action-btn popup-btn"><i
class="fa fa-eye"></i></a>
</div>
</figure>
{/zan:volist}
</div>
</div>
<div class="product-gallery__nav-image">
<div class="trinity-element-carousel nav-slider product-slide-nav"
data-slick-options='{
"slidesToShow": 3,
"slidesToScroll": 1,
"autoplay": true,
"autoplaySpeed": 2000,
"swipe": true,
"infinite": true,
"focusOnSelect": true,
"asNavFor": ".main-slider"
}' data-slick-responsive='[
{
"breakpoint":992,
"settings": {
"slidesToShow": 4
}
},
{
"breakpoint":768,
"settings": {
"slidesToShow": 3
}
},
{
"breakpoint":481,
"settings": {
"slidesToShow": 2
}
}
]'>
{zan:volist name="$zan.field.image_list"}
<figure class="product-gallery__nav-image--single">
<img src="{$field.image_url}" alt="{$field.intro}"
style="width: 65px; height: 141px;">
</figure>
{/zan:volist}
</div>
</div>
</div>
</div>
<!-- 产品图 -->
<div class="product-main-details">
<!-- 商品购买参数 -->
<div class="product-summary product-summary--2">
<h3 class="product-title">{$zan.field.title}</h3>
{zan:sppurchase id='field' currentstyle='active'}
<div class="product-price-wrapper">
<span class="price-label">{zan:lang name='diy373' /}:</span>
<span class="new-price">
{zan:global name='web_currency_unit|get_currency_unit' /}
{$field.users_price}
</span>
<span class="old-price">
{zan:global name='web_currency_unit|get_currency_unit'/}
{$field.crossed_price}</span>
</div>
<div class="product-short-desc">
<p>{$zan.field.short_content}</p>
</div>
<!-- 产品规格 -->
<div class="product-filters-wrapper">
{zan:volist name="$field.ReturnData" id='field2'}
<div class="product-filter product-filter--color">
<span class="product-filter__label">{$field2.spec_name}:</span>
<ul class="product-swatch-list color-swatch-list"
style="display: block;">
{zan:volist name="$field2.spec_value" id='field3'}
<li>
<a href="JavaScript:void(0);" class="{$field3.SpecClass}"
{$field3.SpecData}>{$field3.spec_value}</a>
</li>
{/zan:volist}
</ul>
</div>
{/zan:volist}
</div>
<!-- 产品规格 -->
<!-- 下单数量 -->
<form action="#" class="product-quantity">
<label class="quantity-label" for="qty-sum">
{zan:lang name='diy389'/}:
</label>
<div class="quantity">
<input class="quantity-input cart-plus-minus-box" nvalue="1" type="text"
{$field.UpdateQuantity}>
</div>
</form>
<!-- 下单数量 -->
<!-- 添加购物车,立即购买 -->
<div class="product-action">
<a class="btn" href="JavaScript:void(0);" {$field.ShopAddCart}>
购物车 {zan:lang name='sys315' /}
</a>
<a class="btn" style="background-color: #c71d1d;" href="JavaScript:void(0);" {$field.BuyNow}> 立即购买{zan:lang name='sys314' /}
</a>
<!-- 收藏 -->
{zan:collect id='collect' cancel="Add To Wishlist" collect="Add To Wishlist"}
<a class="btn btn-outline" {$collect.onclick}>
收藏{$collect.cancel}
</a>
{$collect.hidden}
{/zan:collect}
<!-- 收藏 -->
</div>
<!-- 添加购物车,立即购买 -->
{$field.hidden}
{/zan:sppurchase}
</div>
<!-- 商品购买参数 -->
</div>
</div>
</div>
</section>
<!-- 产品详情 -->
<section class="producta-data-tab-area mb--7r5">
<div class="row">
<div class="col-12">
<div class="product-data-tab tab-style-2">
<!-- 规格，描述，评论 -->
<div class="nav nav-tabs" id="product-tab" role="tablist">
<a class="nav-link active" id="nav-description-tab" data-toggle="tab"
href="#nav-description" role="tab" aria-selected="true">
<span class="zan-edit" e-id="npro4" e-type="text">
{zan:uitext e-id='npro4' e-page="npro"}
{$field.value}
{zan:else /}
{/zan:uitext}</span>
</a>
<a class="nav-link" id="nav-specification-tab" data-toggle="tab"
href="#nav-specification" role="tab" aria-selected="true">
<span class="zan-edit" e-id="npro6" e-type="text">
{zan:uitext e-id='npro6' e-page="npro"}
{$field.value}
{zan:else /}
Specification
{/zan:uitext}</span>
</a>
<a class="nav-link" id="nav-reviews-tab" data-toggle="tab" href="#nav-reviews"
role="tab" aria-selected="true">
<span class="zan-edit" e-id="npro5" e-type="text">
{zan:uitext e-id='npro5' e-page="npro"}
{$field.value}
{zan:else /}
Reviews
{/zan:uitext}</span>
</a>
</div>
<!-- 规格，描述，评论 -->
<div class="tab-content" id="product-tabContent">
<!-- 正文内容 -->
<div class="tab-pane fade show active" id="nav-description" role="tabpanel"
aria-labelledby="nav-description-tab">
<div class="product-description">
{$zan.field.content}
</div>
</div>
<!-- 正文内容 -->
<!-- 产品规格 -->
<div class="tab-pane" id="nav-specification" role="tabpanel"
aria-labelledby="nav-specification-tab">
<div class="table-content table-responsive">
<table class="table shop_attributes">
<tbody>
{zan:attribute type='default'}
<tr>
<th>{$attr.name}</th>
<td>{$attr.value}</td>
</tr>
{/zan:attribute}
</tbody>
</table>
</div>
</div>
<!-- 产品规格 -->
<!-- 留言本 -->
<div class="tab-pane" id="nav-reviews" role="tabpanel"
aria-labelledby="nav-reviews-tab">
<div class="product-reviews">
<div id="global_editor_contents">
{zan:comment aid='$zan.field.aid' id='c_field'}
<div class='evalute' {$c_field.CommentID}></div>
{$c_field.hidden}
{/zan:comment}
</div>
</div>
</div>
<!-- 留言本 -->
</div>
</div>
</div>
</div>
</section>
<section class="related-product-area">
<div class="row mb--4r5">
<div class="col-sm-6 text-sm-left text-center mb-xs--20">
<h2 class="text-uppercase"> <span class="font-weight-light">{zan:lang name='crumb53'
/}</span></h2>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="trinity-element-carousel" data-slick-options='{
"spaceBetween": 30,
"slidesToShow": 5,
"slidesToScroll": 1,
"arrows": true,
"appendArrows": ".tty-slick-text"
}' data-slick-responsive='[
{"breakpoint": 1750, "settings": {
"slidesToShow": 4
}},
{"breakpoint": 1199, "settings": {
"slidesToShow": 3
}},
{"breakpoint": 991, "settings": {
"slidesToShow": 2
}},
{"breakpoint": 575, "settings": {
"slidesToShow": 1
}}
]'>
<!-- 推荐产品 -->
{zan:artlist titlelen='12' id='field'}
<div class="item">
<div class="trinity-product">
<div class="product-inner">
<figure class="product-image">
<div class="product-image-holder">
<a href="{$field.arcurl}">
<img src="{$field.litpic}" alt="{$field.title}">
</a>
</div>
<div class="trinity-product-action">
<div class="product-action">
<a href="JavaScript:void(0);" class="btn add_to_cart_btn"
style="padding: 6px 13px;"
{$field.ShopAddCart}>{zan:lang name='sys315' /}</a>
<!-- 单条文档 -->
<div class="action-btn-group">
{zan:arcview aid='$field.aid' id='field2'}
{zan:collect id="collect" cancel="<i
class='fa fa-heart-o'></i>" collect="<i
class='fa fa-heart'></i>"}
<a {$collect.onclick}>{$collect.cancel}</a>
{$collect.hidden}
{/zan:collect}
{/zan:arcview}
<a {$field.openGoodsDetails}>
<i class="fa fa-eye"></i>
</a>
</div>
<!-- 单条文档 -->
</div>
</div>
</figure>
<div class="product-info text-center">
<h3 class="product-title">
<a href="{$field.arcurl}">{$field.title}</a>
</h3>
<div
class="product-info-bottom d-flex justify-content-between align-items-center flex-md-row flex-column">
<div class="product-price-wrapper mb-sm--10">
<span class="price-text">{zan:lang name='diy373' /}: </span>
<span class="new-price">{zan:global
name='web_currency_unit|get_currency_unit'
/}{$field.users_price}</span>
<span class="old-price">{zan:global
name='web_currency_unit|get_currency_unit'
/}{$field.crossed_price}</span>
</div>
</div>
</div>
</div>
</div>
</div>
{/zan:artlist}
<!-- 推荐产品 -->
</div>
</div>
</div>
</section>
</div>
</main>
{zan:include file="footer.htm" /}
</div>
</body>
</html>
<!-- 引入h -->