{ openzc:proinfo }

proinfo：产品详情调用，只能在产品详情页使用

可调用字段
参数说明

字段名称	说明
{openzc:proinfo field="products_id"/}	产品ID
{openzc:proinfo field="products_name/}	产品名称
{openzc:proinfo field="products_image/}	产品主图
{openzc:proinfo field="products_image_flip/}	产品副图（翻转图）
{openzc:proinfo field="products_price/}	产品价格
{openzc:proinfo field="products_type/}	产品类别
{openzc:proinfo field="products_quantity/}	产品数量
{openzc:proinfo field="products_model/}	产品模型编号
{openzc:proinfo field="sort_index/}	产品序号
{openzc:proinfo field="sort_index_type/}	产品排序奇偶数（odd/even）
{openzc:proinfo field="categories_name/}	产品所属分类名称
{openzc:proinfo field="categories_link/}	产品所属分类连接
{openzc:proinfo field="products_normal_price/}	产品价格
{openzc:proinfo field="product_price_discount/}	产品折扣内容
{openzc:proinfo field="products_original_price/}	产品原价
{openzc:proinfo field="products_flag/}	产品标识，sale(热销)、featured(特色)、specials(特价)
{openzc:proinfo field="products_image_full/}	产品原图，当使用imgsizer缩略图参数时，用到原图字段
{openzc:proinfo field="products_image_flip_full/}	产品副图原图
{openzc:proinfo field="sku_price_class/}	产品SKU 前端DIV class名称,用于ajax sku 价格变化
{openzc:proinfo field="products_description_preview/}	产品描述简介，只保留描述文本，已过滤掉图片以及其他html标签
{openzc:proinfo field="products_reviews_count/}	产品评论数量
{openzc:proinfo field="products_customers_count/}	产品评论人数
{openzc:proinfo field="products_rating/}	产品评分

参数名称	参数值	说明
field	字段	调用字段内容
imgsizer	100,100	"products_image"图片裁剪尺寸
bgcolor	#000000	图片裁剪后的背景颜色
desclen	200	产品概要描述“products_description_preview”的字符长度限制
separator	#	产品细节图片分隔符号，默认为“\|\|\|”

① 调用产品详情内容

产品页常用字段调用

预览
源码

Model: DPT
Availability: 1000 in Stock

Sample of Document Product Type

$0.93

(0 Customer Review)

Document Product Type is used for Documents that are also available for sale. You might wish to display brief peices of the Document then offer it for sale. This Product Type is also handy for downloa... ...

DESCRIPTION

Docum

ADDITIONAL INFORMATION

Documentation:

PDF - English, MS Word - English,

REVIEWS (0)

1 REVIEW FOR VARIABLE PRODUCT

Write a review

More Reviews


          
 <div class="row">
 	<!-- mobile product slider  -->
	<div class="tt-mobile-product-layout visible-xs">
		<div class="tt-mobile-product-slider arrow-location-center slick-animated-show-js">
			{openzc:mulimg imgsizer="375,469"}
			<div><img src="[field:products_image_detail/]" alt=""></div>
			{/openzc:mulimg}
		</div>
	</div>
	<!-- /mobile product slider  -->
 	<!--产品信息-->
 	<div class="container container-fluid-mobile">
	<div class="row">
	  <div class="col-6 hidden-xs">
		<div class="tt-product-vertical-layout">
		  <div class="tt-product-single-img">
			<div>
			  <button class="tt-btn-zomm tt-top-right"><i class="icon-f-86"></i></button>
			  <img class="zoom-product" src='{openzc:proinfo field="products_image"/}' data-zoom-image="{openzc:proinfo field='products_image'/}" alt=""> </div>
		  </div>
		  <div class="tt-product-single-carousel-vertical">
			<ul id="smallGallery" class="tt-slick-button-vertical  slick-animated-show-js">
			  {openzc:mulimg imgsizer="81,101"}
			  <li>
			    <a class="{openzc:if $field['sort_index']==1}zoomGalleryActive{/openzc:if}" href="#" data-image="[field:products_image_detail_full/]" data-zoom-image="[field:products_image_detail_full/]"><img src="[field:products_image_detail/]" alt=""></a>
			  </li>
			  {/openzc:mulimg}
			</ul>
		  </div>
		</div>
	  </div>
	  <div class="col-6">
		<div class="tt-product-single-info">
		  <div class="tt-add-info">
			<ul>
			  <li><span>Model:</span> {openzc:proinfo field="products_model"/}</li>
			  {openzc:if $products_info['products_quantity']>0}
			  <li><span>Availability:</span> {openzc:proinfo field="products_quantity"/} in Stock</li>
			  {else}
			  <li><span>Availability:</span> Out Stock</li>
			  {/openzc:if}
			</ul>
		  </div>
		  <h1 class="tt-title">{openzc:proinfo field="products_name"/}</h1>
		  <div class="tt-price"> <span class="new-price {openzc:proinfo field='sku_price_class'/}">{openzc:proinfo field="products_price"/}</span> </div>
		  <div class="tt-review">
			<div class="tt-rating"> {openzc:rating star='<i class="icon-star"></i>' half='<i class="icon-star-half"></i>' empty='<i class="icon-star-empty"></i>'/} </div>
			<a class="product-page-gotocomments-js" href="#">({openzc:proinfo field="products_reviews_count"/} Customer Review)</a> </div>
		  <div class="tt-wrapper text-black-50"> {openzc:proinfo field="products_description_preview" desclen="200"/}... ... </div>
		  {openzc:proinfo field="productPriceDiscount"/}
		  {openzc:if $products_info['productPriceDiscount']}
		  <div class="tt-wrapper">
			<div class="tt-countdown_box_02">
			  <div class="tt-countdown_inner">
				<div class="tt-countdown" data-date="{openzc:proinfo field='expires_date'/}" data-year="Yrs" data-month="Mths" data-week="Wk" data-day="Day" data-hour="Hrs" data-minute="Min" data-second="Sec"></div>
			  </div>
			</div>
		  </div>
		  {/openzc:if}
		  <div class="tt-swatches-container">
			<form action="{openzc:link name='FILENAME_PRODUCT_INFO' parameter=[action=>add_product]/}" method="post">
			  <input type="hidden" name="securityToken" value="{openzc:field.securityToken/}"/>
			  <input type="hidden" name="products_id" value="{openzc:proinfo field='products_id'/}"/>
			  {openzc:proattr options_id="1"}
			  <div class="tt-wrapper">
				<div class="tt-title-options">[field:options_name/]</div>
				<div class="form-default">
				  <div class="form-group">
					<select class="form-control" name="id[[field:options_id/]]">
					  {openzc:loopson}
					  <option value="[field:options_values_id/]">[field:options_values_name/]</option>
					  {/openzc:loopson}
					</select>
				  </div>
				</div>
			  </div>
			  {/openzc:proattr}
			  {openzc:proattr item="select,radio" no_options_id="1,2"}
			  <div class="tt-wrapper">
				<div class="tt-title-options">[field:options_name/]</div>
				<div class="form-default">
				  <div class="form-group">
					<select class="form-control" name="id[[field:options_id/]]">
					  {openzc:loopson}
					  <option value="[field:options_values_id/]">[field:options_values_name/]</option>
					  {/openzc:loopson}
					</select>
				  </div>
				</div>
			  </div>
			  {/openzc:proattr}
			  {openzc:proattr options_id="2"}
			  <div class="tt-wrapper">
				<div class="tt-title-options">[field:options_name/]:</div>
				<ul class="tt-options-swatch options-large">
				  {openzc:loopson}
				  <li> <a class="openzc-btn" data-input-checked="[field:options_input_id/]" href="javascript:void(0);" data-tooltip="[field:options_values_name/]" data-tposition="top"> [field:options_values_name/] </a>
					<input class="d-none" id="[field:options_input_id/]" type="radio" name="id[[field:options_id/]]" value="[field:options_values_id/]"/>
				  </li>
				  {/openzc:loopson}
				</ul>
			  </div>
			  {/openzc:proattr}
			  <div class="tt-wrapper">
				<div class="tt-row-custom-01">
				  <div class="col-item">
					<div class="tt-input-counter style-01"> <span class="minus-btn"></span>
					  <input type="text" name="cart_quantity" value="1" size="5">
					  <span class="plus-btn"></span> </div>
				  </div>
				  <div class="col-item">
					<button type="submit" class="btn btn-primary btn-lg rounded-20"><i class="icon-f-39"></i>ADD TO CART</button>
				  </div>
				</div>
			  </div>
			  <div class="tt-wrapper">
				<ul class="tt-list-btn">
				  <li><a class="btn-link openzc-btn" href="javascript:void(0);" data-action="addWishlist" data-id="{openzc:proinfo field='products_id'/}"><i class="icon-n-072"></i>ADD TO WISH LIST</a></li>
				  <li><a class="btn-link openzc-btn" href="javascript:void(0);" data-action="addCompare" data-id="{openzc:proinfo field='products_id'/}"><i class="icon-n-08"></i>ADD TO COMPARE</a></li>
				</ul>
			  </div>
			</form>
		  </div>
		  <div class="tt-collapse-block">
			<div class="tt-item">
			  <div class="tt-collapse-title">DESCRIPTION</div>
			  <div class="tt-collapse-content"> {openzc:proinfo field="products_description_preview" desclen="5"/} </div>
			</div>
			<div class="tt-item">
			  <div class="tt-collapse-title">ADDITIONAL INFORMATION</div>
			  <div class="tt-collapse-content">
				<table class="tt-table-03">
				  <tbody>
				  {openzc:proattr item="all"}
				  <tr>
					<td>[field:options_name/]:</td>
					<td>{openzc:loopson}[field:options_values_name/], {/openzc:loopson}</td>
				  </tr>
				  {/openzc:proattr}
				  </tbody>
				</table>
			  </div>
			</div>
			<div class="tt-item">
			  <div class="tt-collapse-title tt-poin-comments">REVIEWS ({openzc:proinfo field="products_reviews_count"/})</div>
			  <div class="tt-collapse-content">
				<div class="tt-review-block">
				  <div class="tt-row-custom-02">
					<div class="col-item">
					  <h2 class="tt-title"> 1 REVIEW FOR VARIABLE PRODUCT </h2>
					</div>
					<div class="col-item"> <a href="#">Write a review</a> </div>
				  </div>
				  <div class="tt-review-comments">
                    {openzc:reviews row="5"}
					<div class="tt-item">
					  <div class="tt-avatar"> <a href="#"></a> </div>
					  <div class="tt-content">
						<div class="tt-rating"> {openzc:rating star='<i class="icon-star"></i>' half='<i class="icon-star-half"></i>' empty='<i class="icon-star-empty"></i>'/} </div>
						<div class="tt-comments-info"> <span class="username">by <span>[field:customers_name/]</span></span> <span class="time">on [field:date_added/]</span> </div>
						<p> [field:reviews_text/] </p>
					  </div>
					</div>
					{/openzc:reviews}
                    </div>
				  <a href="{openzc:link name='FILENAME_PRODUCT_REVIEWS' parameter='auto'/}" class="btn btn-outline-primary mg-t-20"><i class="far fa-comment-dots"></i> More Reviews</a>
				</div>
			  </div>
			</div>
		  </div>
		</div>
	  </div>
	</div>
	</div>
</div>