candice-womp

{{#InStock}}
  {{#HasBulk}}
    <!-- Show Product Price Info and Bulk Add To Cart -->
  {{/HasBulk}}
  {{^HasBulk}}
    <!-- Show Product Price Info and Add To Cart -->
  {{/HasBulk}}
{{/InStock}}
{{^InStock}}
  <!-- Show Out of Stock Message and Notify Me Button -->

candice-womp

<amp-list layout="fill" src="https://mysite.com/productID.json" template="addToCart" items="." single-item>
<template type="amp-mustache" id="addToCart">
	<div class="productCard">
		<div class="productImg">
			<amp-img layout="responsive" height="16" width="9" src="{{Img}}"></amp-img>
		</div>
		<h2 class="productName">{{ProductName}}</h2>
		<div class="productInfo">
				<div class="productPrice">{{ProductPrice}}</div>
				<div class="productSavings">{{ProductSavingPercentage}}</div>

candice-womp

{
	"Product": {
		"ID": 123456,
		"Img": "/img/ProductImg.jpg",
		"ProductName": "A Cool Product",
		"ProductPrice": "$0.99",
		"ProductSavingPercentage": "83%",
		"InStock": true,
		"HasBulk": false
	}

candice-womp

<amp-list layout="fill" src="https://mysite.com/productID.json" template="addToCart" items="." single-item>
	<template type="amp-mustache" id="addToCart"></template>
</amp-list>

candice-womp

<amp-list layout="fill" src="https://mysite.com/productID.json" template="addToCart" items="." single-item>
<template type="amp-mustache" id="addToCart">
	<div class="productCard">
		<div class="productImg">
			<amp-img layout="responsive" height="16" width="9" src="{{Img}}"></amp-img>
		</div>
		<h2 class="productName">{{ProductName}}</h2>
		<div class="productInfo">
			{{#InStock}}
				<div class="productPrice">{{ProductPrice}}</div>