initialize version 2.0.0

17 files changed, 261 insertions, 107 deletions

diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index b7031af..3fd2c58 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,12 +1,41 @@
 {{ define "main" }}
 
-<section class="section">
+<section class="feature-list section">
   <div class="container">
     <div class="row">
-      <div class="col-12">
-        {{ .Content }}
+      <div class="col-12 text-center mb-5">
+        <h1>{{.Title}}</h1>
       </div>
     </div>
+    {{ range $index, $element := (where .Site.RegularPages "Section" "blog") }}
+    {{- if ne (mod $index 2) 1 }}
+    <div class="row mb-40">
+      <div class="col-md-6 text-center mb-5 mb-lg-0">
+        <img class="img-fluid" src="{{ .Params.image | absURL }}" alt="">
+      </div>
+      <div class="col-md-6 align-self-center text-center text-md-left">
+        <div class="content">
+          <h4 class="subheading">{{ .Title | markdownify }}</h4>
+          <p>{{ .Summary }}</p>
+          <a href="{{ .Permalink }}" class="btn btn-main btn-main-sm">{{ i18n "read_more" }}</a>
+        </div>
+      </div>
+    </div>
+    {{- else }}
+    <div class="row mb-40">
+      <div class="col-md-6 order-md-1 order-2 align-self-center text-center text-md-left">
+        <div class="content">
+          <h4 class="subheading">{{ .Title | markdownify }}</h4>
+          <p>{{ .Summary }}</p>
+          <a href="{{ .Permalink }}" class="btn btn-main btn-main-sm">{{ i18n "read_more" }}</a>
+        </div>
+      </div>
+      <div class="col-md-6 order-md-2 order-1 text-center mb-5 mb-lg-0">
+        <img class="img-fluid" src="{{ .Params.image | absURL }}" alt="">
+      </div>
+    </div>
+    {{ end }}
+    {{ end }}
   </div>
 </section>
 
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index b7031af..de546a7 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -3,8 +3,16 @@
 <section class="section">
   <div class="container">
     <div class="row">
-      <div class="col-12">
-        {{ .Content }}
+      <div class="col-md-5 mb-4 mb-md-0">
+        <div class="sticky-image">
+          <img class="img-fluid w-100" src="{{ .Params.Image | absURL }}" alt="{{ .Title }}">
+        </div>
+      </div>
+      <div class="col-lg-6 col-md-7 offset-lg-1">
+        <h1 class="mb-4">{{.Title | markdownify}}</h1>
+        <div class="content">
+          {{.Content}}
+        </div>
       </div>
     </div>
   </div>
diff --git a/layouts/contact/list.html b/layouts/contact/list.html
new file mode 100644
index 0000000..69ea1d5
--- /dev/null
+++ b/layouts/contact/list.html
@@ -0,0 +1,43 @@
+{{ define "main" }}
+
+<section class="section">
+  <div class="container">
+    <div class="row justify-content-between">
+      {{ with .Params.office }}
+      <div class="col-lg-4 col-sm-6">
+        <h3 class="mb-4">{{ .title | markdownify }}</h3>
+        <p>{{ .content | markdownify }}</p>
+
+        <ul class="list-unstyled contact-list">
+          <li class="mb-3"><a href="tel:{{ .mobile }}"><i class="tf-ion-ios-telephone mr-2"></i>
+              {{ .mobile }}</a></li>
+          <li class="mb-3"><a href="mailto:{{ .email }}"><i class="tf-ion-email mr-2"></i>{{ .email }}</a></li>
+          <li class="mb-3"><i class="tf-ion-ios-location mr-2"></i>{{ .location }}
+          </li>
+        </ul>
+      </div>
+      {{ end }}
+      <div class="col-lg-3 col-sm-6">
+        {{ with .Params.opennig_hour }}
+        <h3 class="mb-4">{{ .title | markdownify }}</h3>
+        <ul class="list-unstyled">
+          {{ range .day_time }}
+          <li class="mb-2">{{ . | markdownify }}</li>
+          {{ end }}
+        </ul>
+        {{ end }}
+      </div>
+      <div class="col-lg-4">
+        <h3 class="mb-4">{{ .Title }}</h3>
+        <form action="{{ site.Params.contact_form_action }}" method="POST">
+          <input type="text" class="form-control mb-2" id="name" name="name" placeholder="Your Name">
+          <input type="email" class="form-control mb-2" id="email" name="email" placeholder="Your Email">
+          <textarea name="message" id="message" class="form-control mb-2" placeholder="Your Message"></textarea>
+          <button type="submit" value="send" class="btn btn-main btn-main-sm btn-block">{{ i18n "send" }}</button>
+        </form>
+      </div>
+    </div>
+  </div>
+</section>
+
+{{ end }}
\ No newline at end of file
diff --git a/layouts/index.html b/layouts/index.html
index da4c7b5..cebf095 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -6,12 +6,12 @@
 
   {{- partial "promo.html" . }}
 
-  {{- partial "feature-list.html" . }}
+  {{- partial "about-product.html" . }}
 
-  {{- partial "gallery.html" . }}
+  {{- partial "products.html" . }}
 
-  {{- partial "call-to-action.html" . }}
+  {{- partial "subscription.html" . }}
 
   {{- partial "testimonials.html" . }}
 
-{{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/layouts/partials/feature-list.html b/layouts/partials/about-product.html
index e99aa27..6b8530a 100644
--- a/layouts/partials/feature-list.html
+++ b/layouts/partials/about-product.html
@@ -1,5 +1,7 @@
-{{ if site.Data.homepage.aboutProduct.enable }}
-{{ with site.Data.homepage.aboutProduct }}
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{ if $data.homepage.about_product.enable }}
+{{ with $data.homepage.about_product }}
 <section class="feature-list section">
   <div class="container">
     <div class="row">
diff --git a/layouts/partials/banner.html b/layouts/partials/banner.html
index bc3bb52..ccce7a5 100644
--- a/layouts/partials/banner.html
+++ b/layouts/partials/banner.html
@@ -1,9 +1,11 @@
-{{- if site.Data.homepage.banner.enable }}
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{- if $data.homepage.banner.enable }}
 <!-- hero area -->
 <section class="section">
 	<div class="container">
 		<div class="row">
-			{{- with site.Data.homepage.banner }}
+			{{- with $data.homepage.banner }}
 			<div class="col-md-6 text-center mb-5 mb-md-0">
 				<img class="img-fluid" src="{{ .image | absURL }}" alt="">
 			</div>
@@ -13,7 +15,7 @@
 					<p class="mb-4">{{ .content | markdownify }}</p>
 					{{- end }}
 					<button class="snipcart-add-item btn btn-main" 
-					  {{with site.Data.homepage.product }} data-item-id="{{ .name | urlize }}__{{ .price }}"
+					  {{with $data.homepage.product }} data-item-id="{{ .name | urlize }}__{{ .price }}"
 						data-item-name="{{ .name }}"
 						data-item-image="{{ .image | absURL }}"
 						data-item-price="{{ .price }}" data-item-url="{{ .Permalink }}" 
@@ -24,7 +26,7 @@
 						{{ if .sizes }} 
 						data-item-custom2-name="Choose Size"
 						data-item-custom2-options="{{ range $index, $element:= .sizes }}{{ if eq $index 0 }}{{ . | title }}{{ else }}|{{ . | title }}{{ end }}{{ end }}"
-						{{ end }}{{ end }}>{{ site.Data.homepage.banner.button }}</button>
+						{{ end }}{{ end }}>{{ $data.homepage.banner.button }}</button>
 				</div>
 			</div>
 		</div><!-- .row close -->
diff --git a/layouts/partials/features.html b/layouts/partials/features.html
index fa46e54..112147d 100644
--- a/layouts/partials/features.html
+++ b/layouts/partials/features.html
@@ -1,5 +1,7 @@
-{{- if site.Data.homepage.features.enable }}
-{{- with site.Data.homepage.features }}
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{- if $data.homepage.features.enable }}
+{{- with $data.homepage.features }}
 <section class="section" id="feature">
   <div class="container">
     <div class="row">
@@ -9,7 +11,7 @@
         </div>
       </div>
       <div class="col-md-4">
-        {{ range .leftSide }}
+        {{ range .left_side }}
         <div class="mb-40 text-center text-md-left">
           <i class="d-inlin-block h2 mb-10 {{ .icon }}"></i>
           <h4 class="font-weight-bold mb-2">{{ .title | markdownify }}</h4>
@@ -21,7 +23,7 @@
         <img class="img-fluid" src="{{ .image | absURL }}" alt="">
       </div>
       <div class="col-md-4">
-          {{ range .rightSide }}
+          {{ range .right_side }}
         <div class="mb-40 text-center text-md-left">
           <i class="d-inlin-block h2 mb-10 {{ .icon }}"></i>
           <h4 class="font-weight-bold mb-2">{{ .title | markdownify }}</h4>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 68d0b1d..d4593df 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -3,14 +3,11 @@
     <div class="row">
       <div class="col-md-12">
         <div class="block">
-          <a href="{{ site.BaseURL }}" class="footer-logo mb-4">{{ if site.Params.logo }} <img src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}"> {{ else }} {{ .Title }} {{ end }}</a>
+          <a href="{{ site.BaseURL | relLangURL }}" class="mb-4 d-inline-block">{{ if site.Params.logo }} <img src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}" {{with site.Params.logo_width}}width="{{.}}"{{end}}> {{ else }} {{ .Title }} {{ end }}</a>
           <ul class="list-inline footer-menu">
+            {{ range site.Menus.footer }}
             <li class="list-inline-item">
-              <a href="{{ site.BaseURL }}">{{ site.Params.home }}</a>
-            </li>
-            {{ range site.Menus.main }}
-            <li class="list-inline-item">
-              <a class="page-scroll" href="#{{ .URL }}">{{ .Name }}</a>
+              <a href="{{ .URL | absLangURL }}">{{ .Name }}</a>
             </li>
             {{ end }}
           </ul>
@@ -23,32 +20,13 @@
 
 
 <!-- Snipcart public key -->
-<div hidden id="snipcart" data-api-key="{{ site.Params.snipcart_api }}"></div>
+{{with site.Params.snipcart_api}}<div hidden id="snipcart" data-api-key="{{.}}"></div>{{end}}
 
 <!-- JS Plugins -->
 {{ range site.Params.plugins.js}}
-<script src="{{ .URL | absURL }}"></script>
+<script src="{{ .link | absURL }}"></script>
 {{ end }}
 
 <!-- Main Script -->
-{{ $script := resources.Get "script.js" }}
-<script src="{{ $script.Permalink }}"></script>
-
-<!-- google analitycs -->
-{{ with site.Params.google_analitycs_id }}
-<script>
-  (function (i, s, o, g, r, a, m) {
-    i['GoogleAnalyticsObject'] = r;
-    i[r] = i[r] || function () {
-      (i[r].q = i[r].q || []).push(arguments)
-    }, i[r].l = 1 * new Date();
-    a = s.createElement(o),
-      m = s.getElementsByTagName(o)[0];
-    a.async = 1;
-    a.src = g;
-    m.parentNode.insertBefore(a, m)
-  })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
-  ga('create', '{{ . }}', 'auto');
-  ga('send', 'pageview');
-</script>
-{{ end }}
\ No newline at end of file
+{{ $script := resources.Get "js/script.js" }}
+<script src="{{ $script.Permalink }}"></script>
\ No newline at end of file
diff --git a/layouts/partials/gallery.html b/layouts/partials/gallery.html
deleted file mode 100644
index c849fc6..0000000
--- a/layouts/partials/gallery.html
+++ /dev/null
@@ -1,29 +0,0 @@
-{{ if site.Data.homepage.gallery.enable }}
-{{ with site.Data.homepage.gallery }}
-<section class="gallery" id="gallery">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-12">
-        <div class="heading">
-          <h2>{{ .title | markdownify }}</h2>
-        </div>
-
-        <div class="gallery-slider">
-          {{- $basePath := relURL .directory }}
-          {{- range .images }}
-          <div class="block">
-            <div class="gallery-overlay">
-              <a href="{{ $basePath }}/{{ . }}" class="image-popup gallery-popup">
-                <i class="tf-ion-ios-search"></i>
-              </a>
-            </div>
-            <img class="img-fluid" src="{{ $basePath }}/{{ . }}" alt="">
-          </div>
-          {{- end }}
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-{{ end }}
-{{ end }}
\ No newline at end of file
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index fc44793..d7749f1 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -10,15 +10,22 @@
 
   {{ "<!-- plugins -->" | safeHTML }}
   {{ range site.Params.plugins.css }}
-  <link rel="stylesheet" href="{{ .URL | absURL }} ">
+  <link rel="stylesheet" href="{{ .link | absURL }} ">
   {{ end }}
 
   {{ "<!-- Main Stylesheet -->" | safeHTML }}
-  {{ $styles := resources.Get "style.css" | minify }}
+  {{ $styles := resources.Get "scss/style.scss" | toCSS | minify }}
   <link rel="stylesheet" href="{{ $styles.Permalink }}" media="screen">
 
   {{ "<!--Favicon-->" | safeHTML }}
   <link rel="shortcut icon" href="{{ `images/favicon.png` | absURL }} " type="image/x-icon">
   <link rel="icon" href="{{ `images/favicon.png` | absURL }} " type="image/x-icon">
 
+  {{ with .Params.image }}
+  <meta property="og:image" content="{{ . | absURL }}" />
+  {{ end }}
+  {{ template "_internal/opengraph.html" . }}
+  {{ template "_internal/google_analytics.html" . }}
+  {{ template "_internal/google_analytics_async.html" . }}
+
 </head>
\ No newline at end of file
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 2f2d049..95ce357 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -2,23 +2,47 @@
 <header class="sticky-top bg-white">
   <div class="container">
     <nav class="navbar navbar-expand-lg navbar-light">
-      <a class="navbar-brand" href="{{ site.BaseURL }}">{{ if site.Params.logo }} <img src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}"> {{ else }} {{ site.Title }} {{ end }}</a>
+      <a class="navbar-brand" href="{{ site.BaseURL }}">{{ if site.Params.logo }} <img src="{{ site.Params.logo | absURL }}" alt="{{ site.Title }}" {{with site.Params.logo_width}}width="{{.}}"{{end}}> {{ else }} {{ site.Title }} {{ end }}</a>
       <button class="navbar-toggler border-0" type="button" data-toggle="collapse" data-target="#navigation"
         aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
       </button>
 
-      <div class="collapse navbar-collapse" id="navigation">
-        <ul class="navbar-nav ml-auto text-center text-lg-left">
+      <div class="collapse navbar-collapse text-center" id="navigation">
+        <ul class="navbar-nav ml-auto">
+          {{ range site.Menus.home }}
           <li class="nav-item">
-            <a class="nav-link" href="{{ site.BaseURL }}">{{ site.Params.home }}</a>
+            <a class="nav-link page-scroll" href="{{site.BaseURL | absLangURL}}#{{ .URL }}">{{ .Name }}</a>
           </li>
+          {{ end }}
           {{ range site.Menus.main }}
           <li class="nav-item">
-            <a class="nav-link page-scroll" href="#{{ .URL }}">{{ .Name }}</a>
+            <a class="nav-link page-scroll" href="{{ .URL | absLangURL }}">{{ .Name }}</a>
           </li>
           {{ end }}
         </ul>
+        
+        <!-- Language List -->
+        {{ if .IsTranslated }}
+        <select class="m-2 border-0" id="select-language" onchange="location = this.value;">
+          {{ $siteLanguages := .Site.Languages}}
+          {{ $pageLang := .Page.Lang}}
+          {{ range .Page.AllTranslations }}
+          {{ $translation := .}}
+          {{ range $siteLanguages }}
+          {{ if eq $translation.Lang .Lang }}
+          {{ $selected := false }}
+          {{ if eq $pageLang .Lang}}
+          <option id="{{ $translation.Language }}" value="{{ $translation.Permalink }}" selected>{{ .LanguageName }}
+          </option>
+          {{ else }}
+          <option id="{{ $translation.Language }}" value="{{ $translation.Permalink }}">{{ .LanguageName }}</option>
+          {{ end }}
+          {{ end }}
+          {{ end }}
+          {{ end }}
+        </select>
+        {{ end }}
       </div>
     </nav>
   </div>
diff --git a/layouts/partials/products.html b/layouts/partials/products.html
new file mode 100644
index 0000000..a84e6ba
--- /dev/null
+++ b/layouts/partials/products.html
@@ -0,0 +1,28 @@
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{ if $data.homepage.products.enable }}
+<section class="gallery" id="products">
+  <div class="container">
+    <div class="row">
+      <div class="col-md-12">
+        <div class="heading">
+          <h2>{{ $data.homepage.products.title | markdownify }}</h2>
+        </div>
+
+        <div class="gallery-slider">
+          {{ range (where .Site.RegularPages "Section" "products") }}
+          <div class="block">
+            <div class="gallery-overlay">
+              <a href="{{ .Permalink }}" class="gallery-popup">
+                <i class="tf-ion-ios-search"></i>
+              </a>
+            </div>
+            <img class="img-fluid" src="{{ .Params.image | absURL }}" alt="{{.Title}}">
+          </div>
+          {{ end }}
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
+{{ end }}
\ No newline at end of file
diff --git a/layouts/partials/promo.html b/layouts/partials/promo.html
index d620905..24ce8dd 100644
--- a/layouts/partials/promo.html
+++ b/layouts/partials/promo.html
@@ -1,5 +1,7 @@
-{{ if site.Data.homepage.promo.enable }}
-{{ with site.Data.homepage.promo }}
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{ if $data.homepage.promo.enable }}
+{{ with $data.homepage.promo }}
 <section class="bg-orange section">
   <div class="container">
     <div class="row">
diff --git a/layouts/partials/call-to-action.html b/layouts/partials/subscription.html
index 6878913..f38475f 100644
--- a/layouts/partials/call-to-action.html
+++ b/layouts/partials/subscription.html
@@ -1,16 +1,21 @@
-{{- if site.Data.homepage.cta.enable }}
-{{- with site.Data.homepage.cta }}
-<section class="call-to-action section bg-opacity" style="background-image: url('{{ .bgImage | absURL }}');">
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{- if $data.homepage.subscription.enable }}
+{{- with $data.homepage.subscription }}
+<section class="call-to-action section bg-opacity" style="background-image: url('{{ .bg_image | absURL }}');">
   <div class="container">
     <div class="row">
       <div class="col-lg-6 col-md-8 text-center mx-auto">
         <h2 class="subheading text-white">{{ .title | markdownify }}</h2>
         <p class="text-white">{{ .content | markdownify }}</p>
         <div class="input-group">
-          <form name="contact" {{ if .args }}{{ .args | safeHTMLAttr }}{{ else }}action="#"{{ end }} class="w-100">
+          <form action="{{ site.Params.mailchimp_form_action }}" method="post" class="w-100" name="mc-embedded-subscribe-form" target="_blank">
             <input type="email" id="email" class="form-control" name="email" placeholder="{{ .placeholder }}"
               required>
-            <button class="btn btn-main btn-submit" type="submit">Subscribe</button>
+            <button class="btn btn-main btn-submit" type="submit" name="subscribe">{{i18n "subscribe"}}</button>
+            <div style="position: absolute; left: -5000px;" aria-hidden="true">
+              <input type="text" name="{{ site.Params.mailchimp_form_name }}" tabindex="-1">
+            </div>
           </form>
         </div><!-- /input-group -->
       </div>
@@ -18,4 +23,4 @@
   </div>
 </section><!-- #call-to-action close -->
 {{- end }}
-{{- end }}
+{{- end }}
\ No newline at end of file
diff --git a/layouts/partials/testimonials.html b/layouts/partials/testimonials.html
index 9fd7854..0ea0cad 100644
--- a/layouts/partials/testimonials.html
+++ b/layouts/partials/testimonials.html
@@ -1,14 +1,16 @@
-{{ if site.Data.homepage.testimonial.enable }}
+{{ $data := index .Site.Data .Site.Language.Lang }}
+
+{{ if $data.homepage.testimonial.enable }}
 <section class="testimonials section" id="testimonial">
   <div class="container">
-    {{ with site.Data.homepage.testimonial }}
+    {{ with $data.homepage.testimonial }}
     <div class="row justify-content-center">
       <div class="col-12">
         <div class="heading">
           <h2>{{ .title | markdownify }}</h2>
         </div>
       </div>
-      {{ range .testimonialItem }}
+      {{ range .testimonial_item }}
       <div class="col-lg-4 col-sm-6 mb-5 mb-lg-0 text-center">
         <div class="testimonial-block">
           <i class="tf-ion-quote"></i>
@@ -23,18 +25,6 @@
       {{ end }}
     </div>
     {{ end }}
-    <div class="row mt-100">
-      <div class="col-md-12 text-center">
-        <button class="snipcart-add-item btn btn-main" {{with site.Data.homepage.product }}
-          data-item-id="{{ .name | urlize }}__{{ .price }}" data-item-name="{{ .name }}"
-          data-item-image="{{ .image | absURL }}" data-item-price="{{ .price }}" data-item-url="{{ .Permalink }}"
-          {{ if .colors }} data-item-custom1-name="Choose Color"
-          data-item-custom1-options="{{ range $index, $element:= .colors }}{{ if eq $index 0 }}{{ . | title }}{{ else }}|{{ . | title }}{{ end }}{{ end }}"
-          {{ end }} {{ if .sizes }} data-item-custom2-name="Choose Size"
-          data-item-custom2-options="{{ range $index, $element:= .sizes }}{{ if eq $index 0 }}{{ . | title }}{{ else }}|{{ . | title }}{{ end }}{{ end }}"
-          {{ end }}{{ end }}>Grab You Product Now</button>
-      </div>
-    </div>
   </div>
 </section>
 {{ end }}
\ No newline at end of file
diff --git a/layouts/products/list.html b/layouts/products/list.html
new file mode 100644
index 0000000..012ae30
--- /dev/null
+++ b/layouts/products/list.html
@@ -0,0 +1,26 @@
+{{ define "main" }}
+
+<section class="section gallery">
+  <div class="container">
+    <div class="row">
+      <div class="col-12 text-center mb-5">
+        <h1>{{.Title}}</h1>
+      </div>
+      {{ range (where .Site.RegularPages "Section" "products") }}
+      <div class="col-lg-3 col-md-4 col-sm-6 mb-4">
+        <div class="block">
+          <div class="gallery-overlay">
+            <a href="{{ .Permalink }}" class="gallery-popup">
+              <i class="tf-ion-ios-search"></i>
+            </a>
+          </div>
+          <img class="img-fluid" src="{{ .Params.image | absURL }}" alt="{{.Title}}">
+        </div>
+        <h4 class="text-center">{{.Title}}</h4>
+      </div>
+      {{ end }}
+    </div>
+  </div>
+</section>
+
+{{ end }}
\ No newline at end of file
diff --git a/layouts/products/single.html b/layouts/products/single.html
new file mode 100644
index 0000000..67d1840
--- /dev/null
+++ b/layouts/products/single.html
@@ -0,0 +1,37 @@
+{{ define "main" }}
+
+<section class="section">
+  <div class="container">
+    <div class="row">
+      <div class="col-md-5 mb-4 mb-md-0">
+        <div class="sticky-image">
+          <img class="img-fluid w-100" src="{{ .Params.Image | absURL }}" alt="{{ .Title }}">
+        </div>
+      </div>
+      <div class="col-lg-6 col-md-7 offset-lg-1">
+        <h1 class="mb-4">{{ .Title }}</h1>
+        <p><strong>Colors:</strong> {{delimit .Params.colors ", "}}</p>
+        <p><strong>Sizes:</strong> {{delimit .Params.sizes ", "}}</p>
+        <p class="price py-4">{{if .Params.discount_price}}{{site.Params.currency}}{{.Params.discount_price}}{{else}}{{site.Params.currency}}{{.Params.price}}{{end}}
+        {{if .Params.discount_price}}<s class="price">{{site.Params.currency}}{{ .Params.price }}</s>{{end}}
+        </p>
+        <button class="snipcart-add-item btn btn-main mb-5" 
+					  data-item-id="{{ .Title | urlize }}__{{if .Params.discount_price}}{{.Params.discount_price}}{{else}}{{.Params.price}}{{end}}"
+						data-item-name="{{ .Title }}"
+						data-item-image="{{ .Params.image | absURL }}"
+						data-item-price="{{if .Params.discount_price}}{{.Params.discount_price}}{{else}}{{.Params.price}}{{end}}" data-item-url="{{ .Permalink }}" 
+						{{ if .Params.colors }}
+						data-item-custom1-name="Choose Color"
+						data-item-custom1-options="{{ range $index, $element:= .Params.colors }}{{ if eq $index 0 }}{{ . | title }}{{ else }}|{{ . | title }}{{ end }}{{ end }}"
+						{{ end }}
+						{{ if .Params.sizes }}
+						data-item-custom2-name="Choose Size"
+						data-item-custom2-options="{{ range $index, $element:= .Params.sizes }}{{ if eq $index 0 }}{{ . | title }}{{ else }}|{{ . | title }}{{ end }}{{ end }}"
+            {{ end }}>{{ i18n "add_to_cart"}}</button>
+            <div class="content">{{.Content}}</div>
+      </div>
+    </div>
+  </div>
+</section>
+
+{{ end }}
\ No newline at end of file