layout de producto
This commit is contained in:
parent
c227fbe722
commit
57413d263e
4 changed files with 153 additions and 7 deletions
|
@ -156,6 +156,30 @@ remove:
|
|||
default:
|
||||
es: 'Quitar del carrito'
|
||||
en: 'Remove product'
|
||||
length_unit:
|
||||
type: 'string'
|
||||
required: true
|
||||
label:
|
||||
es: 'Unidad de medida de los productos'
|
||||
en: 'Measurement unit for products'
|
||||
help:
|
||||
es: ''
|
||||
en: ''
|
||||
default:
|
||||
es: 'mm'
|
||||
en: 'mm'
|
||||
weight_unit:
|
||||
type: 'string'
|
||||
required: true
|
||||
label:
|
||||
es: 'Unidad de medida para el peso de los productos'
|
||||
en: 'Measurement unit for products weight'
|
||||
help:
|
||||
es: ''
|
||||
en: ''
|
||||
default:
|
||||
es: 'gr'
|
||||
en: 'gr'
|
||||
back:
|
||||
type: 'string'
|
||||
required: true
|
||||
|
|
|
@ -94,8 +94,8 @@ width:
|
|||
es: 'Ancho'
|
||||
en: 'Width'
|
||||
help:
|
||||
es: 'En milímetros'
|
||||
en: 'In millimeters'
|
||||
es: 'En la unidad de medida que configuraste en el carrito'
|
||||
en: 'In measurement units configured in cart'
|
||||
height:
|
||||
type: 'number'
|
||||
writable: 'once'
|
||||
|
@ -103,17 +103,17 @@ height:
|
|||
es: 'Alto'
|
||||
en: 'Height'
|
||||
help:
|
||||
es: 'En milímetros'
|
||||
en: 'In millimeters'
|
||||
es: 'En la unidad de medida que configuraste en el carrito'
|
||||
en: 'In measurement units configured in cart'
|
||||
depth:
|
||||
type: 'number'
|
||||
writable: 'once'
|
||||
label:
|
||||
es: 'Profundidad (Lomo)'
|
||||
es: 'Profundidad'
|
||||
en: 'Depth'
|
||||
help:
|
||||
es: 'En milímetros'
|
||||
en: 'In millimeters'
|
||||
es: 'En la unidad de medida que configuraste en el carrito'
|
||||
en: 'In measurement units configured in cart'
|
||||
weight:
|
||||
type: 'number'
|
||||
required: true
|
||||
|
|
110
_layouts/product.html
Normal file
110
_layouts/product.html
Normal file
|
@ -0,0 +1,110 @@
|
|||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
<article
|
||||
itemscope itemtype="http://schema.org/Product"
|
||||
class="w-100 pb-5 h-entry">
|
||||
<div class="m-auto row no-gutters justify-content-center">
|
||||
<div class="col-10 col-lg-6">
|
||||
<picture>
|
||||
<img
|
||||
itemprop="image"
|
||||
class="img-fluid"
|
||||
src="{{ page.image.path | thumbnail: 316 }}"
|
||||
alt="{{ page.image.description | default: page.title }}" />
|
||||
</picture>
|
||||
|
||||
<div class="w-lg-50">
|
||||
<h4 class="sr-only">{{ site.i18n.libro.ficha }}</h4>
|
||||
|
||||
<ul class="border-bottom border-tl list-unstyled pt-5 gray-600">
|
||||
<li>
|
||||
<time
|
||||
class="dt-published"
|
||||
itemprop="datePublished"
|
||||
datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date_local: '%B %Y' }}</time>
|
||||
</li>
|
||||
|
||||
{% if page.width > 0 %}
|
||||
<li itemprop="width" itemscope="https://schema.org/QuantitativeValue">
|
||||
<span class="font-weight-bold">{{ site.data.layouts.product.width.label[site.lang }}</span>
|
||||
<span itemprop="value">{{ page.width }}</span>
|
||||
<span itemprop="unitText">{{ site.cart.length_unit | default: site.data.layouts.cart.length_unit.default[site.lang] }}</span>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{% if page.height > 0 %}
|
||||
<li itemprop="height" itemscope="https://schema.org/QuantitativeValue">
|
||||
<span class="font-weight-bold">{{ site.data.layouts.product.height.label[site.lang }}</span>
|
||||
<span itemprop="value">{{ page.height }}</span>
|
||||
<span itemprop="unitText">{{ site.cart.length_unit | default: site.data.layouts.cart.length_unit.default[site.lang] }}</span>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{% if page.depth > 0 %}
|
||||
<li itemprop="depth" itemscope="https://schema.org/QuantitativeValue">
|
||||
<span class="font-weight-bold">{{ site.data.layouts.product.depth.label[site.lang }}</span>
|
||||
<span itemprop="value">{{ page.depth }}</span>
|
||||
<span itemprop="unitText">{{ site.cart.length_unit | default: site.data.layouts.cart.length_unit.default[site.lang] }}</span>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{% if page.weight > 0 %}
|
||||
<li itemprop="weight" itemscope="https://schema.org/QuantitativeValue">
|
||||
<span class="font-weight-bold">{{ site.data.layouts.product.weight.label[site.lang }}</span>
|
||||
<span itemprop="value">{{ page.weight }}</span>
|
||||
<span itemprop="unitText">{{ site.cart.weight_unit | default: site.data.layouts.cart.weight_unit.default[site.lang] }}</span>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
|
||||
<div itemprop="offers">
|
||||
<div
|
||||
class="d-flex align-items-center justify-content-between mb-3 ml-1"
|
||||
{% include_cached cart_controller.html product=page %}
|
||||
itemscope itemtype="https://schema.org/Offer">
|
||||
|
||||
<meta itemprop="sku" content="{{ page.sku }}" />
|
||||
<meta itemprop="acceptedPaymentMethod" content="http://purl.org/goodrelations/v1#PayPal" />
|
||||
<meta itemprop="availableDeliveryMethod" content="http://purl.org/goodrelations/v1#Mail" />
|
||||
|
||||
{% if page.in_stock %}
|
||||
<meta itemprop="availability" content="https://schema.org/InStock" />
|
||||
{% else %}
|
||||
<meta itemprop="availability" content="https://schema.org/OutOfStock" />
|
||||
{% endif %}
|
||||
|
||||
<p>
|
||||
<span itemprop="price" data-stock-price>{{ page.price | floor }}</span>
|
||||
<span itemprop="priceCurrency" data-stock-currency>{{ site.cart.currency }}</span>
|
||||
</p>
|
||||
|
||||
<button
|
||||
data-action="cart#add"
|
||||
{{ page.in_stock | value_if: 'disabled' }}
|
||||
class="btn btn-primary btn-block">
|
||||
<span class="hide-when-disabled">{{ site.cart.add }}</span>
|
||||
<span class="show-when-disabled">{{ site.cart.out_of_stock | default: site.data.layouts.cart.out_of_stock.default[site.locale] }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-10 col-lg-6 black mt-5 mt-lg-0">
|
||||
<header>
|
||||
<h1 class="p-name" itemprop="name headline">{{ page.title }}</h1>
|
||||
<p class="lead p-summary" itemprop="description">{{ page.description }}</p>
|
||||
</header>
|
||||
|
||||
<div class="font-weight-light gray-600 lead text-md-justify hyphens-md e-content" itemprop="abstract">
|
||||
{{ content }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span hidden itemprop="identifier">{{ page.uuid }}</span>
|
||||
<a hidden class="u-url" itemprop="url" href="{{ page.url | absolute_url }}">{{ page.url | absolute_url }}</a>
|
||||
<meta itemprop="keywords" content="{{ page.categories | join: ',' }}{% unless page.categories == empty %},{% endunless %}{{ page.tags | join: ',' }}"/>
|
||||
</article>
|
|
@ -37,6 +37,18 @@ $directions: (top, right, bottom, left);
|
|||
&::-webkit-scrollbar { display: none; }
|
||||
}
|
||||
|
||||
:enabled {
|
||||
.show-when-disabled#{$infix} {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
:disabled {
|
||||
.hide-when-disabled#{$infix} {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
/// Un elemento cuadrado
|
||||
///
|
||||
/// @example html
|
||||
|
|
Loading…
Reference in a new issue