Browse Source

模版更新

moshaorui 4 months ago
parent
commit
7a1c380707

+ 4 - 2
app/Admin/Controllers/DistAdminDistributorController.php

@@ -188,6 +188,7 @@ class DistAdminDistributorController extends AdminController
                     //如果appearance_id有变化,则更新模版与变量
                     if ($form->model()->appearance_id != $form->input('appearance_id')) {
                         $id = $form->model()->id;
+                        //更新模版与变量
                         DistAppearance::switchTheme($form->input('appearance_id'), $id);
                     }
                 }
@@ -197,10 +198,11 @@ class DistAdminDistributorController extends AdminController
                 if ($form->isCreating()) {
                     //创建后创建默认分类
                     $newId = $form->getKey();
+                    $appearanceId = $form->input('appearance_id');
                     //初始化分销商
-                    DistAdminDistributor::initDist($form->input('appearance_id'),$newId);
+                    DistAdminDistributor::initDist($appearanceId,$newId);
                     //更新模版与变量
-                    DistAppearance::switchTheme($form->input('appearance_id'), $newId);
+                    DistAppearance::switchTheme($appearanceId, $newId);
                 }
             });
         });

+ 2 - 1
app/Admin/Controllers/DistAppearanceTemplateController.php

@@ -4,6 +4,7 @@ namespace App\Admin\Controllers;
 
 use App\Admin\Repositories\DistAdminDistributor;
 use App\Admin\Repositories\DistAppearance;
+use App\Admin\Repositories\DistAppearancePublishList;
 use App\Admin\Repositories\DistAppearanceTemplate;
 use Dcat\Admin\Form;
 use Dcat\Admin\Grid;
@@ -48,7 +49,7 @@ class DistAppearanceTemplateController extends AdminController
                 $appearanceId = $request->get('appearance_id');
                 $distId = $request->get('dist_id');
                 $distDomain = DistAdminDistributor::getDomain($distId);
-                DistAppearanceTemplate::publish($appearanceId,$distId);
+                DistAppearancePublishList::publish($appearanceId,$distId);
                 return ['status'=>1,'domain'=>$distDomain];
             } else if ($request->get('act') == 'get_appearance_id') {
                 $distId = $request->get('dist_id');

+ 2 - 0
app/Admin/Repositories/DistAppearance.php

@@ -58,6 +58,8 @@ class DistAppearance extends EloquentRepository
     public static function switchTheme($appearanceId,$distId) {
         DistAppearanceTemplate::copyTemplateToDist($appearanceId, $distId);
         DistAppearanceVariable::copyAppearanceVariable($appearanceId, $distId);
+        //发报到正式环境
+        DistAppearancePublishList::publish($appearanceId,$distId);
         return true;
     }
 

+ 13 - 0
app/Admin/Repositories/DistAppearancePublishList.php

@@ -34,4 +34,17 @@ class DistAppearancePublishList extends EloquentRepository
             $model->save();
         }
     }
+
+    /*
+     * 发布模版与变量
+     */
+    public static function publish($appearanceId,$distId) {
+        //同步模版到正式表
+        DistAppearanceTemplate::syncAppearanceTemplates($appearanceId,$distId);
+        //同步变量到正式表
+        DistAppearanceVariable::syncAppearanceVariables($appearanceId, $distId);
+        //发布版本号
+        DistAppearancePublishList::publishVersion($appearanceId,$distId);
+        return true;
+    }
 }

+ 3 - 63
app/Admin/Repositories/DistAppearanceTemplate.php

@@ -142,71 +142,11 @@ class DistAppearanceTemplate extends EloquentRepository
      */
     public static function syncAppearanceTemplates($appearanceId,$distId)
     {
-        $appearanceId = intval($appearanceId);
-        $distId = intval($distId);
-
-        $criteria = ['dist_id' => $distId, 'appearance_id' => $appearanceId];
-
-        $tmpModel = new Model();
-        $tempRecords = $tmpModel
-            ->where($criteria)
-            ->get();
-
-        $siteModel = new SiteAppearanceTemplate();
-        $siteRecords = $siteModel
-            ->where($criteria)
-            ->get()
-            ->keyBy('id'); // Use IDs as keys for easier comparison
-
-
-        foreach ($tempRecords as $tempRecord) {
-            $siteRecord = $siteRecords->get($tempRecord->id);
-            if ($siteRecord) {
-                // If record exists in `site_appearance_template`, check for updates
-                if ($tempRecord->updated_at > $siteRecord->updated_at) {
-                    $siteModel->where('id', $siteRecord->id)
-                        ->update([
-                            'file_name' => $tempRecord->file_name,
-                            'file_path' => $tempRecord->file_path,
-                            'content' => $tempRecord->content,
-                            'updated_at' => Carbon::now(),
-                        ]);
-                }
-            } else {
-                // If record does not exist, insert it
-                $siteModel->insert([
-                    'id' => $tempRecord->id,
-                    'dist_id' => $tempRecord->dist_id,
-                    'appearance_id' => $tempRecord->appearance_id,
-                    'file_name' => $tempRecord->file_name,
-                    'file_path' => $tempRecord->file_path,
-                    'content' => $tempRecord->content,
-                    'created_at' => Carbon::now(),
-                    'updated_at' => Carbon::now(),
-                    'template_code' => $tempRecord->template_code,
-                ]);
-            }
-        }
-
-        // Delete records from `site_appearance_template` that don’t match `dist_id=1` and `appearance_id=1`
-        $siteModel
-            ->where($criteria)
-            ->whereNotIn('id', $tempRecords->pluck('id')->toArray())
-            ->delete();
+        $model = new Model();
+        return $model->syncAppearanceTemplates($appearanceId,$distId);
     }
 
-    /*
-     * 发布模版与变量
-     */
-    public static function publish($appearanceId,$distId) {
-        //同步模版
-        self::syncAppearanceTemplates($appearanceId,$distId);
-        //同步变量
-        DistAppearanceVariable::syncAppearanceVariables($appearanceId, $distId);
-        //发布版本号
-        DistAppearancePublishList::publishVersion($appearanceId,$distId);
-        return true;
-    }
+
 
 
 }

+ 2 - 58
app/Admin/Repositories/DistAppearanceVariable.php

@@ -50,64 +50,8 @@ class DistAppearanceVariable extends EloquentRepository
      * 同步变量到正式表
      */
     public static function syncAppearanceVariables($appearanceId,$distId) {
-        $appearanceId = intval($appearanceId);
-        $distId = intval($distId);
-
-        // Define criteria for filtering
-        $criteria = ['dist_id' => $distId, 'appearance_id' => $appearanceId];
-
-        $tmpModel = new Model();
-        // Retrieve records from both tables
-        $tempVariables = $tmpModel
-            ->where($criteria)
-            ->get();
-
-        $siteModel = new SiteAppearanceVariable();
-        $siteVariables = $siteModel
-            ->where($criteria)
-            ->get()
-            ->keyBy('id'); // Use IDs as keys for easier comparison
-
-        foreach ($tempVariables as $tempVariable) {
-            $siteVariable = $siteVariables->get($tempVariable->id);
-
-            if ($siteVariable) {
-                // If record exists in `site_appearance_variable`, check for updates
-                if ($tempVariable->updated_at > $siteVariable->updated_at) {
-                    $siteModel
-                        ->where('id', $siteVariable->id)
-                        ->update([
-                            'variable_name' => $tempVariable->variable_name,
-                            'variable_value' => $tempVariable->variable_value,
-                            'variable_type' => $tempVariable->variable_type,
-                            'template_code' => $tempVariable->template_code,
-                            'variable_code' => $tempVariable->variable_code,
-                            'updated_at' => Carbon::now(),
-                        ]);
-                }
-            } else {
-                // If record does not exist, insert it
-                $siteModel->insert([
-                    'id' => $tempVariable->id,
-                    'dist_id' => $tempVariable->dist_id,
-                    'appearance_id' => $tempVariable->appearance_id,
-                    'variable_name' => $tempVariable->variable_name,
-                    'variable_value' => $tempVariable->variable_value,
-                    'variable_type' => $tempVariable->variable_type,
-                    'template_code' => $tempVariable->template_code,
-                    'variable_code' => $tempVariable->variable_code,
-                    'created_at' => Carbon::now(),
-                    'updated_at' => Carbon::now(),
-                ]);
-            }
-        }
-
-        // Delete records from `site_appearance_variable` that don’t match `dist_id=1` and `appearance_id=1`
-        $siteModel
-            ->where($criteria)
-            ->whereNotIn('id', $tempVariables->pluck('id')->toArray())
-            ->delete();
-
+      $model = new Model();
+      return $model->syncAppearanceVariables($appearanceId,$distId);
     }
 
 }

+ 2 - 0
app/Distributor/Repositories/DistAppearance.php

@@ -25,6 +25,8 @@ class DistAppearance extends EloquentRepository
     public static function switchTheme($appearanceId,$distId) {
         DistAppearanceTemplate::copyTemplateToDist($appearanceId, $distId);
         DistAppearanceVariable::copyAppearanceVariable($appearanceId, $distId);
+        //发报到正式环境
+        DistAppearancePublishList::publish($appearanceId, $distId);
         return true;
     }
 

+ 14 - 0
app/Distributor/Repositories/DistAppearancePublishList.php

@@ -2,6 +2,7 @@
 
 namespace App\Distributor\Repositories;
 
+
 use App\Models\DistAppearancePublishList as Model;
 use Dcat\Admin\Repositories\EloquentRepository;
 
@@ -38,4 +39,17 @@ class DistAppearancePublishList extends EloquentRepository
             $model->save();
         }
     }
+
+    /*
+     * 发布模版与变量
+     */
+    public static function publish($appearanceId,$distId) {
+        //同步模版
+        DistAppearanceTemplate::syncAppearanceTemplates($appearanceId,$distId);
+        //同步变量
+        DistAppearanceVariable::syncAppearanceVariables($appearanceId, $distId);
+        //发布版本号
+        DistAppearancePublishList::publishVersion();
+        return true;
+    }
 }

+ 33 - 0
app/Distributor/Repositories/DistAppearanceTemplate.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace App\Distributor\Repositories;
+
+use App\Admin\Repositories\DistAppearanceTemplateLog;
+use App\Models\DistAppearanceTemplate as Model;
+use App\Models\SiteAppearanceTemplate;
+use Dcat\Admin\Repositories\EloquentRepository;
+use Illuminate\Support\Carbon;
+
+class DistAppearanceTemplate extends EloquentRepository
+{
+    /**
+     * Model.
+     *
+     * @var string
+     */
+    protected $eloquentClass = Model::class;
+
+
+    /*
+     * 同步模版到正式表上
+     */
+    public static function syncAppearanceTemplates($appearanceId,$distId)
+    {
+        $model = new Model();
+        return $model->syncAppearanceTemplates($appearanceId,$distId);
+    }
+
+
+
+
+}

+ 28 - 0
app/Distributor/Repositories/DistAppearanceVariable.php

@@ -0,0 +1,28 @@
+<?php
+
+namespace App\Distributor\Repositories;
+
+use App\Models\DistAppearanceVariable as Model;
+use App\Models\SiteAppearanceVariable;
+use Dcat\Admin\Repositories\EloquentRepository;
+use Illuminate\Support\Carbon;
+
+class DistAppearanceVariable extends EloquentRepository
+{
+    /**
+     * Model.
+     *
+     * @var string
+     */
+    protected $eloquentClass = Model::class;
+
+
+    /*
+     * 同步变量到正式表
+     */
+    public static function syncAppearanceVariables($appearanceId,$distId) {
+        $model = new Model();
+        return $model->syncAppearanceVariables($appearanceId,$distId);
+    }
+
+}

+ 58 - 0
app/Models/DistAppearanceTemplate.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use Carbon\Carbon;
 use Dcat\Admin\Traits\HasDateTimeFormatter;
 
 use Illuminate\Database\Eloquent\Model;
@@ -37,4 +38,61 @@ WHERE `dist_id` = {$baseDistId} AND `appearance_id` = {$appearanceId};
         return true;
     }
 
+
+
+    public function syncAppearanceTemplates($appearanceId,$distId)
+    {
+        $appearanceId = intval($appearanceId);
+        $distId = intval($distId);
+
+        $criteria = ['dist_id' => $distId, 'appearance_id' => $appearanceId];
+
+        $tmpModel = $this;
+        $tempRecords = $tmpModel
+            ->where($criteria)
+            ->get();
+
+        $siteModel = new SiteAppearanceTemplate();
+        $siteRecords = $siteModel
+            ->where($criteria)
+            ->get()
+            ->keyBy('id'); // Use IDs as keys for easier comparison
+
+
+        foreach ($tempRecords as $tempRecord) {
+            $siteRecord = $siteRecords->get($tempRecord->id);
+            if ($siteRecord) {
+                // If record exists in `site_appearance_template`, check for updates
+                if ($tempRecord->updated_at > $siteRecord->updated_at) {
+                    $siteModel->where('id', $siteRecord->id)
+                        ->update([
+                            'file_name' => $tempRecord->file_name,
+                            'file_path' => $tempRecord->file_path,
+                            'content' => $tempRecord->content,
+                            'updated_at' => Carbon::now(),
+                        ]);
+                }
+            } else {
+                // If record does not exist, insert it
+                $siteModel->insert([
+                    'id' => $tempRecord->id,
+                    'dist_id' => $tempRecord->dist_id,
+                    'appearance_id' => $tempRecord->appearance_id,
+                    'file_name' => $tempRecord->file_name,
+                    'file_path' => $tempRecord->file_path,
+                    'content' => $tempRecord->content,
+                    'created_at' => Carbon::now(),
+                    'updated_at' => Carbon::now(),
+                    'template_code' => $tempRecord->template_code,
+                ]);
+            }
+        }
+
+        // Delete records from `site_appearance_template` that don’t match `dist_id=1` and `appearance_id=1`
+        $siteModel
+            ->where($criteria)
+            ->whereNotIn('id', $tempRecords->pluck('id')->toArray())
+            ->delete();
+    }
+
 }

+ 62 - 0
app/Models/DistAppearanceVariable.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use Carbon\Carbon;
 use Dcat\Admin\Traits\HasDateTimeFormatter;
 
 use Illuminate\Database\Eloquent\Model;
@@ -57,4 +58,65 @@ WHERE `dist_id` = {$baseDistId} AND `appearance_id` = {$appearanceId};
         return self::where('appearance_id', $appearanceId)->where('dist_id', $distId)->delete();
     }
 
+    public  function syncAppearanceVariables($appearanceId,$distId) {
+        $appearanceId = intval($appearanceId);
+        $distId = intval($distId);
+
+        // Define criteria for filtering
+        $criteria = ['dist_id' => $distId, 'appearance_id' => $appearanceId];
+
+        $tmpModel = $this;
+        // Retrieve records from both tables
+        $tempVariables = $tmpModel
+            ->where($criteria)
+            ->get();
+
+        $siteModel = new SiteAppearanceVariable();
+        $siteVariables = $siteModel
+            ->where($criteria)
+            ->get()
+            ->keyBy('id'); // Use IDs as keys for easier comparison
+
+        foreach ($tempVariables as $tempVariable) {
+            $siteVariable = $siteVariables->get($tempVariable->id);
+
+            if ($siteVariable) {
+                // If record exists in `site_appearance_variable`, check for updates
+                if ($tempVariable->updated_at > $siteVariable->updated_at) {
+                    $siteModel
+                        ->where('id', $siteVariable->id)
+                        ->update([
+                            'variable_name' => $tempVariable->variable_name,
+                            'variable_value' => $tempVariable->variable_value,
+                            'variable_type' => $tempVariable->variable_type,
+                            'template_code' => $tempVariable->template_code,
+                            'variable_code' => $tempVariable->variable_code,
+                            'updated_at' => Carbon::now(),
+                        ]);
+                }
+            } else {
+                // If record does not exist, insert it
+                $siteModel->insert([
+                    'id' => $tempVariable->id,
+                    'dist_id' => $tempVariable->dist_id,
+                    'appearance_id' => $tempVariable->appearance_id,
+                    'variable_name' => $tempVariable->variable_name,
+                    'variable_value' => $tempVariable->variable_value,
+                    'variable_type' => $tempVariable->variable_type,
+                    'template_code' => $tempVariable->template_code,
+                    'variable_code' => $tempVariable->variable_code,
+                    'created_at' => Carbon::now(),
+                    'updated_at' => Carbon::now(),
+                ]);
+            }
+        }
+
+        // Delete records from `site_appearance_variable` that don’t match `dist_id=1` and `appearance_id=1`
+        $siteModel
+            ->where($criteria)
+            ->whereNotIn('id', $tempVariables->pluck('id')->toArray())
+            ->delete();
+
+    }
+
 }

+ 49 - 0
resources/appearance/OceanWP/__product_list_1.liquid

@@ -0,0 +1,49 @@
+
+<div class="row cols-xs-space cols-sm-space cols-md-space">
+{% for item in products %}
+    {% comment %}{{ item.title }} - {{ item.sku }}{% endcomment %}
+
+    <div class="col-lg-4">
+        <div class="block product no-border z-depth-2-top z-depth-2--hover">
+            <div class="block-image ">
+                <a  href="/products/{{ item.id }}" target="_blank" >
+
+                    {% if item.images and item.images[0].image_url %}
+                        <img src="{{ site.image_base_url }}{{ item.images[0].image_url | append: '?x-oss-process=image/resize,m_lfit,h_200' }}"
+                             class="img-center default-image-thumbnail">
+                    {% else %}
+                        <div class="img-center default-image-thumbnail no-image-placeholder-thumbnail">
+                            <span>No Image</span>
+                        </div>
+                    {% endif %}
+                </a>
+                <span class="product-ribbon product-ribbon-right product-ribbon--style-1 bg-blue text-uppercase">New</span>
+            </div>
+
+            <div class="block-body text-center">
+                <h3 class="heading heading-5 strong-600 text-capitalize">
+                    <a  href="/products/{{ item.id }}" target="_blank" >
+                        {{ item.title | strip_html }}
+                    </a>
+                </h3>
+                <p class="product-description">
+                    {{ item.content | strip_html | truncate: 20 | default: "No description " }}
+                </p>
+                {% comment %}<div class="product-colors mt-2">{% endcomment %}
+                    {% comment %}<div class="color-switch float-wrapper">{% endcomment %}
+                        {% comment %}<a href="#" class="bg-purple"></a>{% endcomment %}
+                        {% comment %}<a href="#" class="bg-pink"></a>{% endcomment %}
+                        {% comment %}<a href="#" class="bg-blue"></a>{% endcomment %}
+                    {% comment %}</div>{% endcomment %}
+                {% comment %}</div>{% endcomment %}
+                <div class="product-buttons mt-4">
+                    <a href="/products/{{ item.id }}" class="btn  btn-gray-dark btn-circle px-4" target="_blank">
+                        Explore
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+{% endfor %}
+</div>
+

+ 72 - 0
resources/appearance/OceanWP/_footer.liquid

@@ -0,0 +1,72 @@
+<!-- _footer.template -->
+<footer id="footer" class="footer">
+    <div class="footer-top">
+        <div class="container">
+            <div class="row cols-xs-space cols-sm-space cols-md-space">
+                <div class="col-lg-5">
+                    <div class="col">
+
+                        <span class="clearfix"></span>
+                        {% comment %}<span class="heading heading-sm c-gray-light strong-400">Mietubl</span>{% endcomment %}
+                        <h4>
+                            {{site.dist.site_name }}
+                        </h4>
+
+                        <div class="copyright mt-4">
+                            <p>
+                                {{site.dist.copy_right | raw  }}
+                            </p>
+                        </div>
+                    </div>
+                </div>
+                {% for menu in site.menus_footer %}
+                    {% if menu.show %}
+                        <div class="col-lg-2">
+                            <div class="col">
+                                <h4 class="heading heading-xs strong-600 text-uppercase mb-1">
+                                    {{ menu.title }}
+                                </h4>
+
+                                <ul class="footer-links">
+                                    {% for child in menu.children %}
+                                        {% if child.show %}
+                                            <li>
+                                                <a href="{{ child.uri }}" title="{{ child.title }}">
+                                                    {{ child.title }}
+                                                </a>
+                                            </li>
+                                        {% endif %}
+                                    {% endfor %}
+                                </ul>
+                            </div>
+                        </div>
+                    {% endif %}
+                {% endfor %}
+
+                <div class="col-lg-3">
+                    <div class="col">
+                        <h4 class="heading heading-xs strong-600 text-uppercase mb-1">
+                            Get in touch
+                        </h4>
+
+                        <ul class="social-media social-media--style-1-v4">
+                            <li>
+                                <a href="{{ site.dist.facebook }}" class="facebook" target="_blank" data-toggle="tooltip" data-original-title="Facebook">
+                                    <i class="fa fa-facebook"></i>
+                                </a>
+                            </li>
+                            <li>
+                                <a href="{{ site.dist.instagram }}" class="instagram" target="_blank" data-toggle="tooltip" data-original-title="Instagram">
+                                    <i class="fa fa-instagram"></i>
+                                </a>
+                            </li>
+
+                            </li>
+
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</footer>

+ 64 - 0
resources/appearance/OceanWP/_footer_js.liquid

@@ -0,0 +1,64 @@
+<!-- _footer_js.template -->
+
+<!-- SCRIPTS -->
+<!-- Core -->
+<script src="/static/js/jquery.min.js"></script>
+<script src="/static/js/popper.min.js"></script>
+<script src="/static/js/bootstrap.min.js"></script>
+<script src="/static/js/slidebar.js"></script>
+<script src="/static/js/classie.js"></script>
+
+<!-- Bootstrap Extensions -->
+<script src="/static/js/bootstrap-growl.min.js"></script>
+<script src="/static/js/scrollpos-styler.js"></script>
+
+<!-- Plugins: Sorted A-Z -->
+<script src="/static/js/adaptive-backgrounds.js"></script>
+<script src="/static/js/jquery.countdown.min.js"></script>
+<script src="/static/js/dropzone.min.js"></script>
+<script src="/static/js/jquery.easypiechart.min.js"></script>
+<script src="/static/js/jquery.fancybox.min.js"></script>
+<script src="/static/js/flatpickr.min.js"></script>
+<script src="/static/js/flip.min.js"></script>
+<script src="/static/js/footer-reveal.min.js"></script>
+<script src="/static/js/jquery.gradientify.min.js"></script>
+<script src="/static/js/headroom.min.js"></script>
+<script src="/static/js/jquery.headroom.min.js"></script>
+<script src="/static/js/input-mask.min.js"></script>
+<script src="/static/js/instafeed.js"></script>
+<script src="/static/js/jquery.countto.js"></script>
+<script src="/static/js/nouislider.min.js"></script>
+<script src="/static/js/paraxify.min.js"></script>
+<script src="/static/js/select2.min.js"></script>
+<script src="/static/js/sticky-kit.min.js"></script>
+<script src="/static/js/swiper.min.js"></script>
+<script src="/static/js/autosize.min.js"></script>
+<script src="/static/js/typeahead.bundle.min.js"></script>
+<script src="/static/js/typed.min.js"></script>
+<script src="/static/js/vide.min.js"></script>
+<script src="/static/js/viewportchecker.min.js"></script>
+<script src="/static/js/wow.min.js"></script>
+
+<!-- Isotope -->
+<script src="/static/js/isotope.min.js"></script>
+<script src="/static/js/imagesloaded.pkgd.min.js"></script>
+
+<!-- RS5.0 Core JS Files -->
+<script src="/static/js/jquery.themepunch.tools.min.js"></script>
+<script src="/static/js/jquery.themepunch.revolution.min.js"></script>
+<script src="/static/js/revolution-slider-shop-electronics.js"></script>
+
+<script src="/static/js/revolution.extension.actions.min.js"></script>
+<script src="/static/js/revolution.extension.carousel.min.js"></script>
+<script src="/static/js/revolution.extension.kenburn.min.js"></script>
+<script src="/static/js/revolution.extension.layeranimation.min.js"></script>
+<script src="/static/js/revolution.extension.migration.min.js"></script>
+<script src="/static/js/revolution.extension.navigation.min.js"></script>
+<script src="/static/js/revolution.extension.parallax.min.js"></script>
+<script src="/static/js/revolution.extension.slideanims.min.js"></script>
+<script src="/static/js/revolution.extension.video.min.js"></script>
+
+<!-- App JS -->
+<script src="/static/js/main.min.js"></script>
+
+

+ 113 - 0
resources/appearance/OceanWP/_header.liquid

@@ -0,0 +1,113 @@
+<!-- _header.template -->
+
+<div class="header">
+    <!-- Top Bar -->
+    <div class="top-navbar">
+        <div class="container">
+            <div class="row">
+                <div class="col-md-6">
+
+                </div>
+
+                <div class="col-md-6">
+                    <nav class="top-navbar-menu">
+                        <ul class="top-menu">
+
+                        </ul>
+                    </nav>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Global Search -->
+    <section id="sctGlobalSearch" class="global-search global-search-overlay">
+        <div class="container">
+            <div class="global-search-backdrop mask-dark--style-2"></div>
+
+            <!-- Search form -->
+            <form class="form-horizontal form-global-search z-depth-2-top" role="form">
+                <div class="px-4">
+                    <div class="row">
+                        <div class="col-12">
+                            <input type="text" class="search-input" placeholder="Type and hit enter ...">
+                        </div>
+                    </div>
+                </div>
+                <a href="#" class="close-search" data-toggle="global-search" title="Close search bar"></a>
+            </form>
+        </div>
+    </section>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar--bold navbar--style-2 navbar-light bg-default  navbar--shadow">
+        <div class="container navbar-container">
+            <!-- Brand/Logo -->
+            <a class="navbar-brand" href="/">
+
+
+                {% if site.dist.logo %}
+                    <img src="{{ site.image_base_url }}{{ site.dist.logo }}" alt="logo" class="" alt="mtb" style="height: 50px;">
+                {% else %}
+                    <div class="logo-placeholder no-image-logo-thumbnail">
+                        No Logo
+                    </div>
+                {% endif %}
+
+            </a>
+
+            <div class="d-inline-block">
+                <!-- Navbar toggler  -->
+                <button class="navbar-toggler hamburger hamburger-js hamburger--spring" type="button" data-toggle="collapse" data-target="#navbar_main" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
+                    <span class="hamburger-box">
+                        <span class="hamburger-inner"></span>
+                    </span>
+                </button>
+            </div>
+
+            <div class="collapse navbar-collapse align-items-center justify-content-center" id="navbar_main">
+                <!-- Navbar search - For small resolutions -->
+                <div class="navbar-search-widget b-xs-bottom py-3 d-lg-none d-none">
+                    <form class="" role="form">
+                        <div class="input-group input-group-lg">
+                            <input type="text" class="form-control" placeholder="Search for...">
+                            <span class="input-group-btn">
+                <button class="btn btn-base-3" type="button">Go!</button>
+                </span>
+                        </div>
+                    </form>
+                </div>
+
+                <!-- Navbar links -->
+
+    <!-------------menus--------------->
+                <ul class="navbar-nav">
+                    {% for menu in site.menus_header %}
+                        <li class="nav-item dropdown {% if menu.children and menu.children.size == 0 %}megamenu{% endif %}">
+                            <a class="nav-link {% if menu.children and menu.children.size > 0 %}dropdown-toggle{% endif %}"
+                               href="{% if menu.children and menu.children.size > 0 %}#{% else %}{{ menu.uri }}{% endif %}"
+                               {% if menu.children and menu.children.size > 0 %}data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"{% endif %}>
+                                {{ menu.title }}
+                            </a>
+                            {% if menu.children and menu.children.size > 0 %}
+                                <div class="dropdown-menu dropdown-menu-xl py-0 px-0 overflow--hidden" aria-labelledby="navbar_{{ menu.id }}_dropdown">
+                                    <div class="list-group rounded">
+                                        {% for child in menu.children %}
+                                            <a href="{% if child.children and child.children.size > 0 %}#{% else %}{{ child.uri }}{% endif %}"
+                                               class="list-group-item list-group-item-action d-flex align-items-center">
+                                                <div class="list-group-content">
+                                                    <div class="list-group-heading heading heading-6 mb-1">{{ child.title }}</div>
+                                                    <p class="text-sm mb-0">{{ child.title }}</p>
+                                                </div>
+                                            </a>
+                                        {% endfor %}
+                                    </div>
+                                </div>
+                            {% endif %}
+                        </li>
+                    {% endfor %}
+                </ul>
+            </div>
+        </div>
+    </nav>
+</div>

+ 40 - 0
resources/appearance/OceanWP/_header_css.liquid

@@ -0,0 +1,40 @@
+<!-- _header_css.template -->
+
+<!-- Bootstrap -->
+<link rel="stylesheet" href="/static/css/bootstrap.min.css" type="text/css">
+
+<!-- Fonts -->
+<link href="/static/css/af9117b70d024d9bab98a2f93152186d.css" rel="stylesheet">
+
+<!-- Plugins -->
+<link rel="stylesheet" href="/static/css/swiper.min.css">
+<link rel="stylesheet" href="/static/css/hamburgers.min.css" type="text/css">
+<link rel="stylesheet" href="/static/css/animate.min.css" type="text/css">
+<link rel="stylesheet" href="/static/css/jquery.fancybox.min.css">
+
+<!-- Icons -->
+<link rel="stylesheet" href="/static/css/font-awesome.min.css" type="text/css">
+<link rel="stylesheet" href="/static/css/ionicons.min.css" type="text/css">
+<link rel="stylesheet" href="/static/css/line-icons.css" type="text/css">
+<link rel="stylesheet" href="/static/css/line-icons-pro.css" type="text/css">
+
+<!-- Linea Icons -->
+<link rel="stylesheet" href="/static/css/linea-icons.css" type="text/css">
+<link rel="stylesheet" href="/static/css/linea-icons_1.css" type="text/css">
+<link rel="stylesheet" href="/static/css/linea-icons_2.css" type="text/css">
+<link rel="stylesheet" href="/static/css/linea-icons_3.css" type="text/css">
+
+<!-- Global style (main) -->
+<link id="stylesheet" type="text/css" href="/static/css/main.min.css" rel="stylesheet" media="screen">
+
+{% comment %}<!-- Custom style - Remove if not necessary -->{% endcomment %}
+{% comment %}<link type="text/css" href="../../assets/css/custom-style.css" rel="stylesheet">{% endcomment %}
+
+<!-- Favicon -->
+<link href="/static/images/favicon.png" rel="icon" type="image/png">
+
+
+<!-- RS5.0 -->
+<link rel="stylesheet" href="/static/css/settings.css">
+<link rel="stylesheet" href="/static/css/layers.css">
+<link rel="stylesheet" href="/static/css/navigation.css">

+ 95 - 0
resources/appearance/OceanWP/collection_list.liquid

@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="robots" content="index, follow">
+<meta name="author" content="Mietubl">
+<meta name="description" content="{{ tag.seo_description }}">
+<meta name="keywords" content="{{tag.seo_keywords}}">
+<title>{{tag.seo_title}}</title>
+{% include '_header_css.liquid' %}
+</head>
+<body>
+
+<!-- MAIN WRAPPER -->
+<div class="body-wrap shop-default shop-cards shop-tech">
+    <div id="st-container" class="st-container">
+
+        <div class="st-pusher">
+            <div class="st-content">
+                <div class="st-content-inner">
+                    <!-- HEADER -->
+                    {% include '_header.liquid' %}
+                    <!-- END: HEADER -->
+
+                    <section class="slice sct-color-1">
+                        <div class="container">
+                            <div class="row align-items-center">
+                                <div class="col-12" >
+                                    <h3 class="heading heading-6 strong-600 text-uppercase mb-0 text-center">{{ tag.name }}</h3>
+                                </div>
+
+                            </div>
+
+                            <div class="row cols-md-space cols-sm-space cols-xs-space">
+
+                                {% for item in pages %}
+                                    <div class="col-lg-4 col-wrapper--spaced-y">
+                                        <div class="card z-depth-2-top">
+                                            <div class="card-image">
+                                                <div class="view view-first">
+                                                    <a href="/pages/{% if item.slug %}{{ item.slug }}{% else %}{{ item.id }}{% endif %}">
+
+                                                        {% if item.cover_image %}
+                                                            <img src="{{ site.image_base_url }}{{ item.cover_image }}" alt="Cover Image " class="default-image-thumbnail" >
+                                                        {% else %}
+                                                            <div class="img-center default-image-thumbnail"
+                                                                 style="width: 100%; height: 200px; background-color: #e0e0e0; display: flex; justify-content: center; align-items: center; color: #555;">
+                                                                <span>No Image</span>
+                                                            </div>
+                                                        {% endif %}
+
+                                                    </a>
+                                                </div>
+                                            </div>
+
+                                            <div class="card-body">
+                                                <h3 class="heading heading-5 strong-500 mb-0">
+                                                    <a href="/pages/{% if item.slug %}{{ item.slug }}{% else %}{{ item.id }}{% endif %}">{{ item.title | strip_html }}</a>
+                                                </h3>
+                                            </div>
+
+                                            <div class="card-footer">
+                                                <div class="row">
+
+                                                    <div class="col text-right">
+                                                        <ul class="inline-links inline-links--style-2">
+                                                            <li>
+                                                                {{item.post_date }}
+                                                            </li>
+                                                        </ul>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {% endfor %}
+
+
+
+
+
+                            </div>
+                        </div>
+                    </section>    <!-- FOOTER -->
+                    {% include '_footer.liquid' %}
+                </div>
+            </div>
+        </div><!-- END: st-pusher -->
+    </div><!-- END: st-container -->
+</div><!-- END: body-wrap -->
+<a href="#" class="back-to-top btn-back-to-top"></a>
+{% include '_footer_js.liquid' %}
+</body>
+</html>

+ 126 - 0
resources/appearance/OceanWP/contact_create.liquid

@@ -0,0 +1,126 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="robots" content="index, follow">
+<meta name="description" content="{{ site.dist.seo_description }}">
+<meta name="keywords" content="{{ site.dist.seo_keywords }}">
+<meta name="author" content="Mietubl">
+<title>{{ site.dist.seo_title }}</title>
+{% include '_header_css.liquid' %}
+</head>
+<body>
+
+<!-- MAIN WRAPPER -->
+<div class="body-wrap shop-default shop-cards shop-tech">
+    <div id="st-container" class="st-container">
+
+        <div class="st-pusher">
+            <div class="st-content">
+                <div class="st-content-inner">
+                    <!-- HEADER -->
+                    {% include '_header.liquid' %}
+                    <!-- END: HEADER -->
+
+                    <section class="slice">
+                        <div class="container">
+                            <div class="text-center">
+                                <h2 class="heading heading-2 strong-400">
+                                    Contact us for help
+                                </h2>
+                                <p>
+                                    Please call us or complete the form below and we'll get to you shortly.
+                                </p>
+                                <a href="" class="btn btn-styled btn-xl btn-base-1 btn-icon-left mt-4">
+                                    <i class="fa fa-mobile"></i>Contact : {{ site.dist.contact_number }}
+                                </a>
+                                <span class="clearfix"></span>
+                                <a href="" class="btn btn-styled btn-xl btn-base-1 btn-icon-left mt-4">
+                                    <i class="fa fa-mobile"></i>Hotline: {{ site.dist.service_hotline }}
+                                </a>
+                                <span class="clearfix"></span>
+                                <small>Get support by calling the 24h helpline.</small>
+                            </div>
+                        </div>
+                    </section>
+
+                    <section class="slice pt-0 sct-color-1">
+                        <div class="container">
+                            <div class="row justify-content-center">
+                                <div class="col-lg-8">
+                                    <!-- Contact form -->
+                                    <form id="form_contact" data-action="/contact" class="form-default" role="form">
+                                        <input type="hidden" name="_token" value="{{ csrf_token }}">
+                                        <div class="row">
+                                            <div class="col-md-6">
+                                                <div class="form-group has-feedback">
+                                                    <label for="" class="text-uppercase c-gray-light">Your name</label>
+                                                    <input type="text" name="customer_name" class="form-control form-control-lg" required>
+                                                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                                                    <div class="help-block with-errors"></div>
+                                                </div>
+                                            </div>
+                                            <div class="col-md-6">
+                                                <div class="form-group has-feedback">
+                                                    <label for="" class="text-uppercase c-gray-light">Email address</label>
+                                                    <input type="email" name="email" class="form-control form-control-lg" required>
+                                                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                                                    <div class="help-block with-errors"></div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="row">
+                                            <div class="col-md-6">
+                                                <div class="form-group has-feedback">
+                                                    <label for="" class="text-uppercase c-gray-light">Company name</label>
+                                                    <input type="text" name="company_name" class="form-control form-control-lg">
+                                                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                                                    <div class="help-block with-errors"></div>
+                                                </div>
+                                            </div>
+                                            <div class="col-sm-6">
+                                                <div class="form-group has-feedback">
+                                                    <label for="" class="text-uppercase c-gray-light">Phone/whats_app</label>
+                                                    <input type="text" name="whats_app" class="form-control form-control-lg" required>
+                                                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                                                    <div class="help-block with-errors"></div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="row">
+                                            <div class="col-md-12">
+                                                <div class="form-group has-feedback">
+                                                    <label for=""  class="text-uppercase c-gray-light">Message</label>
+                                                    <textarea name="content" class="form-control no-resize" rows="5" required></textarea>
+                                                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                                                    <div class="help-block with-errors"></div>
+                                                </div>
+                                            </div>
+                                        </div>
+
+                                        <div class="">
+
+
+                                            <button type="reset" class="btn-reset d-none"></button>
+                                            <button type="submit" class="btn btn-styled btn-base-1 mt-4">Send message</button>
+                                        </div>
+                                    </form>
+                                </div>
+                            </div>
+                        </div>
+                    </section>
+
+
+                    {% include '_footer.liquid' %}
+                </div>
+            </div>
+        </div><!-- END: st-pusher -->
+    </div><!-- END: st-container -->
+</div><!-- END: body-wrap -->
+<a href="#" class="back-to-top btn-back-to-top"></a>
+{% include '_footer_js.liquid' %}
+</body>
+</html>

+ 383 - 0
resources/appearance/OceanWP/home.liquid

@@ -0,0 +1,383 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="robots" content="index, follow">
+<meta name="description" content="{{ site.dist.seo_description }}">
+<meta name="keywords" content="{{ site.dist.seo_keywords }}">
+<meta name="author" content="Mietubl">
+<title>{{ site.dist.seo_title }}</title>
+{% include '_header_css.liquid' %}
+</head>
+<body>
+
+<!-- MAIN WRAPPER -->
+<div class="body-wrap shop-default shop-cards shop-tech">
+    <div id="st-container" class="st-container">
+
+        <div class="st-pusher">
+            <div class="st-content">
+                <div class="st-content-inner">
+                    <!-- HEADER -->
+                    {% include '_header.liquid' %}
+                    <!-- END: HEADER -->
+
+                    <!-- REVOLUTION SLIDER -->
+                    <div id="rev_slider_1_wrapper" class="rev_slider_wrapper fullwidthbanner-container" data-alias="image-hero39" data-source="gallery">
+<!-- START REVOLUTION SLIDER 5.3.0.2 fullwidth mode -->
+	<div id="rev_slider_1" class="rev_slider fullwidthabanner" style="display:none;" data-version="5.3.0.2" >
+		<ul>
+			<li data-index="rs-1" data-transition="slidevertical" data-slotamount="1" data-hideafterloop="0" data-hideslideonmobile="off"  data-easein="default" data-easeout="default" data-masterspeed="1500"  data-thumb="../../images/slider/concept-1-100x50.jpg"  data-rotate="0"  data-fstransition="fade" data-fsmasterspeed="1500" data-fsslotamount="7" data-saveperformance="off"  data-title="Intro" data-param1="" data-param2="" data-param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data-param9="" data-param10="" data-description="">
+				<!-- MAIN IMAGE -->
+				<img src="static/picture/iphone-1.jpg"  alt=""  data-bgposition="top center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina>
+
+				<!-- LAYER NR. 2 -->
+				<div class="tp-caption title--style-1 c-white tp-resizeme" id="slide-1-layer-2"
+					data-x="['right','right','right','right']" data-hoffset="['0','0','50','50']"
+					data-y="['middle','middle','middle','middle']" data-voffset="['0','0','0','0']"
+					data-fontsize="['16','16','16','16']"
+					data-lineheight="['16','16','16','16']"
+					data-width="[300, 300, 300, 300]"
+					data-height="none"
+					data-whitespace="nowrap"
+					data-type="text"
+					data-responsive_offset="on"
+					data-frames='[{"from":"x:-50px;opacity:0;","speed":1000,"to":"o:1;","delay":500,"ease":"Power2.easeOut"},{"delay":"wait","speed":1500,"to":"opacity:0;","ease":"Power4.easeIn"}]'
+					data-textAlign="['left','left','left','left']"
+					data-paddingtop="[0,0,0,0]"
+					data-paddingright="[0,0,0,0]"
+					data-paddingbottom="[0,0,0,0]"
+					data-paddingleft="[0,0,0,0]"
+					style="z-index: 11; white-space: nowrap;text-transform:left;">
+
+					<span class="text-uppercase strong-400">No more waiting</span>
+
+				</div>
+
+				<div class="tp-caption title--style-1 c-white tp-resizeme" id="slide-1-layer-3"
+					data-x="['right','right','right','right']" data-hoffset="['0','0','50','50']"
+					data-y="['middle','middle','middle','middle']" data-voffset="['70','70','70','70']"
+					data-fontsize="['40','40','40','40']"
+					data-lineheight="['50','40','40','40']"
+					data-width="[300, 300, 300, 300]"
+					data-height="none"
+					data-whitespace="nowrap"
+					data-type="text"
+					data-responsive_offset="on"
+					data-frames='[{"from":"x:-50px;opacity:0;","speed":1000,"to":"o:1;","delay":1000,"ease":"Power2.easeOut"},{"delay":"wait","speed":1500,"to":"opacity:0;","ease":"Power4.easeIn"}]'
+					data-textAlign="['left','left','left','left']"
+					data-paddingtop="[0,0,0,0]"
+					data-paddingright="[0,0,0,0]"
+					data-paddingbottom="[0,0,0,0]"
+					data-paddingleft="[0,0,0,0]"
+					style="z-index: 11; white-space: nowrap;text-transform:left;">
+
+					<span class="strong-400">
+						Say hello to
+					</span>
+					<br>
+					<span class="strong-600">
+						the new Phone X
+					</span>
+
+				</div>
+
+				<!-- LAYER NR. 5 -->
+				<div class="tp-caption" id="slide-1-layer-5"
+					data-x="['right','right','right','right']" data-hoffset="['0','0','50','50']"
+					data-y="['middle','middle','middle','middle']" data-voffset="['180','180','180','180']"
+					data-fontsize="['40','40','40','40']"
+					data-lineheight="['50','50','50','50']"
+					data-width="[300, 300, 300, 300]"
+					data-height="none"
+					data-whitespace="nowrap"
+					data-type="text"
+					data-responsive_offset="on"
+					data-frames='[{"from":"x:-50px;opacity:0;","speed":1000,"to":"o:1;","delay":1500,"ease":"Power2.easeOut"},{"delay":"wait","speed":1500,"to":"opacity:0;","ease":"Power4.easeIn"}]'
+					data-textAlign="['left','left','left','left']"
+					data-paddingtop="[0,0,0,0]"
+					data-paddingright="[0,0,0,0]"
+					data-paddingbottom="[0,0,0,0]"
+					data-paddingleft="[0,0,0,0]"
+					style="z-index: 11; white-space: nowrap;text-transform:left;">
+
+					<a href="#" class="btn btn-base-1 btn-circle">View Details</a>
+
+				</div>
+			</li>
+
+			<!-- SLIDE 2 -->
+			<li data-index="rs-2" data-transition="slidevertical" data-slotamount="1" data-hideafterloop="0" data-hideslideonmobile="off"  data-easein="default" data-easeout="default" data-masterspeed="1500"  data-thumb="../../images/slider/concept-1-100x50.jpg"  data-rotate="0"  data-fstransition="fade" data-fsmasterspeed="1500" data-fsslotamount="7" data-saveperformance="off"  data-title="Intro" data-param1="" data-param2="" data-param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data-param9="" data-param10="" data-description="">
+				<!-- MAIN IMAGE -->
+				<img src="static/picture/macbook-1.jpg"  alt=""  data-bgposition="center center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina>
+
+				<!-- LAYER NR. 2 -->
+				<div class="tp-caption title--style-1 c-white tp-resizeme" id="slide-2-layer-2"
+					data-x="['right','right','right','right']" data-hoffset="['0','0','50','50']"
+					data-y="['middle','middle','middle','middle']" data-voffset="['0','0','0','0']"
+					data-fontsize="['16','16','16','16']"
+					data-lineheight="['16','16','16','16']"
+					data-width="[300, 300, 300, 300]"
+					data-height="none"
+					data-whitespace="nowrap"
+					data-type="text"
+					data-responsive_offset="on"
+					data-frames='[{"from":"x:-50px;opacity:0;","speed":1000,"to":"o:1;","delay":500,"ease":"Power2.easeOut"},{"delay":"wait","speed":1500,"to":"opacity:0;","ease":"Power4.easeIn"}]'
+					data-textAlign="['left','left','left','left']"
+					data-paddingtop="[0,0,0,0]"
+					data-paddingright="[0,0,0,0]"
+					data-paddingbottom="[0,0,0,0]"
+					data-paddingleft="[0,0,0,0]"
+					style="z-index: 11; white-space: nowrap;text-transform:left;">
+
+					<span class="text-uppercase strong-400">It's here</span>
+
+				</div>
+
+				<div class="tp-caption title--style-1 c-white tp-resizeme" id="slide-2-layer-3"
+					data-x="['right','right','right','right']" data-hoffset="['0','0','50','50']"
+					data-y="['middle','middle','middle','middle']" data-voffset="['70','70','70','70']"
+					data-fontsize="['40','40','40','40']"
+					data-lineheight="['50','40','40','40']"
+					data-width="[300, 300, 300, 300]"
+					data-height="none"
+					data-whitespace="nowrap"
+					data-type="text"
+					data-responsive_offset="on"
+					data-frames='[{"from":"x:-50px;opacity:0;","speed":1000,"to":"o:1;","delay":1000,"ease":"Power2.easeOut"},{"delay":"wait","speed":1500,"to":"opacity:0;","ease":"Power4.easeIn"}]'
+					data-textAlign="['left','left','left','left']"
+					data-paddingtop="[0,0,0,0]"
+					data-paddingright="[0,0,0,0]"
+					data-paddingbottom="[0,0,0,0]"
+					data-paddingleft="[0,0,0,0]"
+					style="z-index: 11; white-space: nowrap;text-transform:left;">
+
+					<span class="strong-400">
+						Introducing
+					</span>
+					<br>
+					<span class="strong-600">
+						the new Macbook Pro
+					</span>
+
+				</div>
+
+				<!-- LAYER NR. 5 -->
+				<div class="tp-caption" id="slide-2-layer-5"
+					data-x="['right','right','right','right']" data-hoffset="['0','0','50','50']"
+					data-y="['middle','middle','middle','middle']" data-voffset="['180','180','180','180']"
+					data-fontsize="['40','40','40','40']"
+					data-lineheight="['50','50','50','50']"
+					data-width="[300, 300, 300, 300]"
+					data-height="none"
+					data-whitespace="nowrap"
+					data-type="text"
+					data-responsive_offset="on"
+					data-frames='[{"from":"x:-50px;opacity:0;","speed":1000,"to":"o:1;","delay":1500,"ease":"Power2.easeOut"},{"delay":"wait","speed":1500,"to":"opacity:0;","ease":"Power4.easeIn"}]'
+					data-textAlign="['left','left','left','left']"
+					data-paddingtop="[0,0,0,0]"
+					data-paddingright="[0,0,0,0]"
+					data-paddingbottom="[0,0,0,0]"
+					data-paddingleft="[0,0,0,0]"
+					style="z-index: 11; white-space: nowrap;text-transform:left;">
+
+					<a href="#" class="btn btn-base-1 btn-circle">View Details</a>
+
+				</div>
+			</li>
+		</ul>
+		<div class="tp-bannertimer tp-bottom" style="visibility: hidden !important;"></div>
+	</div>
+</div><!-- END REVOLUTION SLIDER -->
+
+                    <section class="slice sct-color-2">
+                        <div class="container">
+                            <div class="section-title section-title--style-1 text-center">
+                                <h3 class="section-title-inner heading-3 strong-600 text-capitalize">
+                                    <span>Featured products</span>
+                                </h3>
+                            </div>
+
+                           {% product  mode="list" limit=3 template='__product_list_1.liquid' %}
+
+                        </div>
+                    </section>
+
+                    {% comment %}<section class="slice sct-color-2">{% endcomment %}
+                        {% comment %}<div class="container">{% endcomment %}
+                            {% comment %}<div class="row align-items-end pb-100">{% endcomment %}
+                                {% comment %}<div class="col-lg-8 order-lg-2">{% endcomment %}
+                                    {% comment %}<div class="block block-image-holder">{% endcomment %}
+                                        {% comment %}<div class="block-image">{% endcomment %}
+                                            {% comment %}<img src="static/picture/img-promo-wide-2.jpg" class="img-fluid">{% endcomment %}
+                                        {% comment %}</div>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+{% comment %}{% endcomment %}
+                                {% comment %}<div class="col-lg-4 order-lg-1">{% endcomment %}
+                                    {% comment %}<div class="feature feature--boxed-border floating-content floating-content--2 float--right mb--100 feature--bg-1 z-depth-2-top">{% endcomment %}
+                                        {% comment %}<div class="py-4 px-3">{% endcomment %}
+                                            {% comment %}<h2 class="heading heading-3 strong-600">{% endcomment %}
+                                                {% comment %}Listening to Music{% endcomment %}
+                                            {% comment %}</h2>{% endcomment %}
+                                            {% comment %}<span class="clearfix"></span>{% endcomment %}
+                                            {% comment %}<p class="mt-4 line-height-1_8">{% endcomment %}
+                                                {% comment %}Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.{% endcomment %}
+                                            {% comment %}</p>{% endcomment %}
+{% comment %}{% endcomment %}
+                                            {% comment %}<div class="btn-container mt-4">{% endcomment %}
+                                                {% comment %}<a href="#" class="btn btn-lg btn-gray-dark btn-circle px-4">Explore</a>{% endcomment %}
+                                                {% comment %}<a href="#" class="btn btn-lg btn-base-1 btn-circle btn-icon-left px-4">{% endcomment %}
+                                                    {% comment %}<i class="icon ion-bag"></i> Buy now{% endcomment %}
+                                                {% comment %}</a>{% endcomment %}
+                                            {% comment %}</div>{% endcomment %}
+                                        {% comment %}</div>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+                            {% comment %}</div>{% endcomment %}
+                        {% comment %}</div>{% endcomment %}
+                    {% comment %}</section>{% endcomment %}
+
+                    {% comment %}<section class="slice sct-color-2">{% endcomment %}
+                        {% comment %}<div class="container">{% endcomment %}
+                            {% comment %}<div class="row align-items-start">{% endcomment %}
+                                {% comment %}<div class="col-lg-8">{% endcomment %}
+                                    {% comment %}<div class="block block-image-holder">{% endcomment %}
+                                        {% comment %}<div class="block-image">{% endcomment %}
+                                            {% comment %}<img src="static/picture/img-promo-wide-1.jpg" class="img-fluid">{% endcomment %}
+                                        {% comment %}</div>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+{% comment %}{% endcomment %}
+                                {% comment %}<div class="col-lg-4">{% endcomment %}
+                                    {% comment %}<div class="feature feature--boxed-border floating-content floating-content--2 float--left top-0 mt--100 feature--bg-1 z-depth-2-top">{% endcomment %}
+                                        {% comment %}<div class="py-4 px-3">{% endcomment %}
+                                            {% comment %}<h2 class="heading heading-3 strong-600">{% endcomment %}
+                                                {% comment %}Dreaming in Colors{% endcomment %}
+                                            {% comment %}</h2>{% endcomment %}
+                                            {% comment %}<span class="clearfix"></span>{% endcomment %}
+                                            {% comment %}<p class="mt-4 line-height-1_8">{% endcomment %}
+                                                {% comment %}Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.{% endcomment %}
+                                            {% comment %}</p>{% endcomment %}
+{% comment %}{% endcomment %}
+                                            {% comment %}<div class="btn-container mt-4">{% endcomment %}
+                                                {% comment %}<a href="#" class="btn btn-lg btn-gray-dark btn-circle px-4">Explore</a>{% endcomment %}
+                                                {% comment %}<a href="#" class="btn btn-lg btn-base-1 btn-circle btn-icon-left px-4">{% endcomment %}
+                                                    {% comment %}<i class="icon ion-bag"></i> Buy now{% endcomment %}
+                                                {% comment %}</a>{% endcomment %}
+                                            {% comment %}</div>{% endcomment %}
+                                        {% comment %}</div>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+                            {% comment %}</div>{% endcomment %}
+                        {% comment %}</div>{% endcomment %}
+                    {% comment %}</section>{% endcomment %}
+
+
+
+                    <section class="slice-lg has-bg-cover bg-size-cover" style="background-image: url(static/images/img-slider-1.jpg);">
+                        <div class="mask mask-base-1--style-1"></div>
+                        <div class="container">
+                            <div class="row justify-content-center">
+                                <div class="col-6 text-center">
+                                    <h2 class="heading heading-1 strong-600 c-white">
+                                        Join the biggest sales of the year
+                                    </h2>
+                                    <p class="c-white trong-300 mt-4">
+                                        Lorem ipsum dolor sit amet adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna. There is only that moment, and the incredible certainty that everything under the sun has been written by one hand only.
+                                    </p>
+
+                                    <div class="btn-container mt-5">
+                                        <a href="/page/sales" class="btn btn-styled btn-white btn-outline btn-circle px-5" target="_blank">Learn more</a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </section>
+
+                    {% comment %}<section class="slice sct-color-1">{% endcomment %}
+                        {% comment %}<div class="container">{% endcomment %}
+                            {% comment %}<div class="row align-items-center">{% endcomment %}
+                                {% comment %}<div class="col-lg-6 ml-lg-auto order-lg-2">{% endcomment %}
+                                    {% comment %}<img src="static/picture/img-product-lg-1.jpg" class="img-fluid">{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+{% comment %}{% endcomment %}
+                                {% comment %}<div class="col-lg-5 order-lg-1">{% endcomment %}
+                                    {% comment %}<div class="">{% endcomment %}
+                                        {% comment %}<h3 class="heading heading-2 strong-600">The most beautiful colors you've ever seen</h3>{% endcomment %}
+{% comment %}{% endcomment %}
+                                        {% comment %}<p class=" c-gray-light mt-4">{% endcomment %}
+                                            {% comment %}There is only that moment, and the incredible certainty that everything under the sun has been written by one hand only.{% endcomment %}
+                                        {% comment %}</p>{% endcomment %}
+{% comment %}{% endcomment %}
+                                        {% comment %}<div class="btn-container mt-5">{% endcomment %}
+                                            {% comment %}<a href="#" class="btn btn-base-1 btn-circle btn-icon-left px-4" data-scroll-to="#scrollToSection">{% endcomment %}
+                                                {% comment %}<i class="icon ion-android-cart"></i> Add to cart{% endcomment %}
+                                            {% comment %}</a>{% endcomment %}
+                                            {% comment %}<a href="#" class="btn btn-base-3 btn-circle btn-icon-left px-4" data-scroll-to="#scrollToSection">{% endcomment %}
+                                                {% comment %}Learn more{% endcomment %}
+                                            {% comment %}</a>{% endcomment %}
+                                        {% comment %}</div>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+                            {% comment %}</div>{% endcomment %}
+                        {% comment %}</div>{% endcomment %}
+                    {% comment %}</section>{% endcomment %}
+
+
+                    {% comment %}<section class="slice-sm bg-base-1">{% endcomment %}
+                        {% comment %}<div class="container sct-inner">{% endcomment %}
+                            {% comment %}<div class="row cols-xs-space cols-sm-space cols-md-space">{% endcomment %}
+                                {% comment %}<div class="col-lg-4 b-lg-right b-inverse">{% endcomment %}
+                                    {% comment %}<div class="px-3 py-3 text-lg-center">{% endcomment %}
+                                        {% comment %}<h3 class="heading heading-sm c-base-text-1 strong-600 text-uppercase ls-1">Free shipping in 48/72H</h3>{% endcomment %}
+                                        {% comment %}<p class="c-white alpha-8 line-height-1_6">{% endcomment %}
+                                            {% comment %}Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod{% endcomment %}
+                                        {% comment %}</p>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+{% comment %}{% endcomment %}
+                                {% comment %}<div class="col-lg-4 b-lg-right b-inverse">{% endcomment %}
+                                    {% comment %}<div class="px-3 py-3 text-lg-center">{% endcomment %}
+                                        {% comment %}<h3 class="heading heading-sm c-base-text-1 strong-600 text-uppercase ls-1">Free returns</h3>{% endcomment %}
+                                        {% comment %}<p class="c-white alpha-8 line-height-1_6">{% endcomment %}
+                                            {% comment %}Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod{% endcomment %}
+                                        {% comment %}</p>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+{% comment %}{% endcomment %}
+                                {% comment %}<div class="col-lg-4">{% endcomment %}
+                                    {% comment %}<div class="px-3 py-3 text-lg-center">{% endcomment %}
+                                        {% comment %}<h3 class="heading heading-sm c-base-text-1 strong-600 text-uppercase ls-1">Secure payment</h3>{% endcomment %}
+                                        {% comment %}<ul class="inline-links mt-2">{% endcomment %}
+                                            {% comment %}<li>{% endcomment %}
+                                                {% comment %}<img src="static/picture/visa.png" width="30" class="img-grayscale">{% endcomment %}
+                                            {% comment %}</li>{% endcomment %}
+                                            {% comment %}<li>{% endcomment %}
+                                                {% comment %}<img src="static/picture/mastercard.png" width="30" class="img-grayscale">{% endcomment %}
+                                            {% comment %}</li>{% endcomment %}
+                                            {% comment %}<li>{% endcomment %}
+                                                {% comment %}<img src="static/picture/maestro.png" width="30" class="img-grayscale">{% endcomment %}
+                                            {% comment %}</li>{% endcomment %}
+                                            {% comment %}<li>{% endcomment %}
+                                                {% comment %}<img src="static/picture/paypal.png" width="30" class="img-grayscale">{% endcomment %}
+                                            {% comment %}</li>{% endcomment %}
+                                        {% comment %}</ul>{% endcomment %}
+                                    {% comment %}</div>{% endcomment %}
+                                {% comment %}</div>{% endcomment %}
+                            {% comment %}</div>{% endcomment %}
+                        {% comment %}</div>{% endcomment %}
+                    {% comment %}</section>{% endcomment %}
+
+                    <!-- FOOTER -->
+                    {% include '_footer.liquid' %}
+                </div>
+            </div>
+        </div><!-- END: st-pusher -->
+    </div><!-- END: st-container -->
+</div><!-- END: body-wrap -->
+<a href="#" class="back-to-top btn-back-to-top"></a>
+{% include '_footer_js.liquid' %}
+</body>
+</html>

+ 0 - 20
resources/appearance/OceanWP/index.html

@@ -1,20 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Ace Editor Example</title>
-    <style>
-        #editor {
-            height: 600px; /* 设置编辑器的高度 */
-            width: 800px; /* 设置编辑器的宽度 */
-            border: 1px solid #ddd; /* 可选边框样式 */
-        }
-    </style>
-</head>
-
-<body>
-    <h1>Ace Editor Example</h1>
-
-</body>
-</html>11

+ 94 - 0
resources/appearance/OceanWP/pages_detail.liquid

@@ -0,0 +1,94 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="robots" content="index, follow">
+<meta name="author" content="Mietubl">
+<meta name="description" content="{{ page.seo_description }}">
+<meta name="keywords" content="{{page.seo_keywords}}">
+<title>{{page.seo_title}}</title>
+
+{% include '_header_css.liquid' %}
+</head>
+<body>
+
+<!-- MAIN WRAPPER -->
+<div class="body-wrap shop-default shop-cards shop-tech">
+    <div id="st-container" class="st-container">
+
+
+
+        <div class="st-pusher">
+            <div class="st-content">
+                <div class="st-content-inner">
+                    <!-- HEADER -->
+                    {% include '_header.liquid' %}
+                    <!-- END: HEADER -->
+
+                    <section class="slice sct-color-1">
+                        <div class="container">
+
+
+
+                            <section class="slice-sm sct-color-1">
+                                <div class="container container-xs">
+                                    <div class="block block-post">
+                                        <div class="block-body block-post-body">
+                                            <h1>
+                                                {{ page.title | raw }}
+                                            </h1>
+
+                                            {{page.content | raw }}
+
+                                            {% comment %}<div class="tagcloud tagcloud--style-1 clearfix">{% endcomment %}
+                                                {% comment %}<a href="#"><span>Rooms</span></a>{% endcomment %}
+                                                {% comment %}<a href="#"><span>Simple</span></a>{% endcomment %}
+                                                {% comment %}<a href="#"><span>Decorated</span></a>{% endcomment %}
+                                                {% comment %}<a href="#"><span>Wood</span></a>{% endcomment %}
+                                            {% comment %}</div>{% endcomment %}
+                                        </div>
+
+
+
+                                    <!-- Comment form -->
+
+                                </div>
+                        </div>
+                    </section>
+
+
+                        </div>
+                    </section>
+
+                    <!-- FOOTER -->
+                    {% include '_footer.liquid' %}
+                </div>
+            </div>
+        </div><!-- END: st-pusher -->
+    </div><!-- END: st-container -->
+</div><!-- END: body-wrap -->
+<a href="#" class="back-to-top btn-back-to-top"></a>
+{% include '_footer_js.liquid' %}
+
+<!-- Isotope -->
+<script src="/static/js/isotope.min.js"></script>
+<script src="/static/js/imagesloaded.pkgd.min.js"></script>
+
+<!-- Deso Slide -->
+<script src="/static/js/jquery.desoslide.min.js"></script>
+<script>
+    $('#slideshow').desoSlide({
+        thumbs: $('#slideshow_thumbs .swiper-slide > a'),
+        thumbEvent: 'click',
+        first: 0,
+        effect: 'none',
+        overlay: 'none',
+        controls: {
+            show: false,
+            keys: false
+        },
+    });
+</script>
+</body>
+</html>

+ 138 - 0
resources/appearance/OceanWP/products_categories.liquid

@@ -0,0 +1,138 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="robots" content="index, follow">
+<meta name="description" content="{{ category.seo_description }}">
+<meta name="keywords" content="{{category.seo_keywords}}">
+<title>{{category.seo_title}}</title>
+<meta name="author" content="Mietubl">
+{% include '_header_css.liquid' %}
+</head>
+<body>
+
+<!-- MAIN WRAPPER -->
+<div class="body-wrap shop-default shop-cards shop-tech">
+    <div id="st-container" class="st-container">
+
+
+
+        <div class="st-pusher">
+            <div class="st-content">
+                <div class="st-content-inner">
+                    <!-- HEADER -->
+                    {% include '_header.liquid' %}
+                    <!-- END: HEADER -->
+
+                    <section class="slice sct-color-2">
+                        <div class="container">
+                            <h4 class="heading heading-xs text-uppercase strong-600 mb-0 text-center">
+                                Trending
+                            </h4>
+                            <div class="section-title section-title--style-1 text-center mt-1">
+                                <h3 class="section-title-inner heading-3 strong-600 line-height-1_6">
+                                    <span>{{category.name}}</span>
+                                </h3>
+                                <span class="section-title-delimiter clearfix d-none"></span>
+                            </div>
+
+                            <div class="row-wrapper">
+                                <div class="row cols-xs-space cols-sm-space cols-md-space">
+                                    {% for item in products %}
+
+                                    <div class="col-lg-3 col-md-6 col-wrapper--spaced-y">
+                                        <div class="card card-product z-depth-1-top z-depth-2--hover">
+                                            <div class="card-body">
+                                                <h2 class="heading heading-6 strong-600 mt-2 mb-3">
+                                                    <a  href="/products/{{ item.id }}" target="_blank" >
+                                                        {{ item.title | strip_html }}
+                                                    </a>
+                                                </h2>
+
+                                                <div class="card-image swiper-js-container">
+                                                    <div class="">
+                                                        <div class="swiper-container" data-swiper-items="1" data-swiper-space-between="0">
+                                                            <div class="swiper-wrapper">
+                                                                <div class="swiper-slide">
+                                                                    <a  href="/products/{{ item.id }}" target="_blank" >
+
+
+                                                                    {% if item.images and item.images[0].image_url %}
+                                                                        <img src="{{ site.image_base_url }}{{ item.images[0].image_url | append: '?x-oss-process=image/resize,m_lfit,h_200' }}"
+                                                                             class="img-fluid img-center img-primary default-image-thumbnail-small">
+                                                                    {% else %}
+                                                                        <div class="img-fluid img-center img-primary default-image-thumbnail-small no-image-placeholder-thumbnail-small">
+                                                                            <span>No Image</span>
+                                                                        </div>
+                                                                    {% endif %}
+                                                                    </a>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+
+                                                <div class="mt-3">
+
+                                                    <p class="product-description mt-3 mb-0" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
+                                                        {{ item.content | strip_html| strip_newlines | truncate: 20 | default: "No description " }}
+                                                    </p>
+                                                </div>
+                                            </div>
+                                            <div class="card-footer">
+                                                <div class="product-buttons">
+                                                    <div class="row align-items-center">
+                                                        <div class="col-2"></div>
+                                                        <div class="col-8">
+                                                            <a  href="/products/{{ item.id }}" target="_blank" >
+                                                            <button type="button" class="btn btn-block btn-base-1 btn-circle btn-icon-left">
+                                                                View Details
+                                                            </button>
+                                                            </a>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+
+                                    {% endfor %}
+                                </div>
+
+                            </div>
+
+                            {% comment %}<div class="pt-5">{% endcomment %}
+                                {% comment %}<nav aria-label="Product pagination">{% endcomment %}
+                                    {% comment %}<ul class="pagination pagination--style-2 justify-content-center">{% endcomment %}
+                                        {% comment %}<li class="page-item disabled">{% endcomment %}
+                                            {% comment %}<a class="page-link" href="#" tabindex="-1">Previous</a>{% endcomment %}
+                                        {% comment %}</li>{% endcomment %}
+                                        {% comment %}<li class="page-item"><a class="page-link" href="#">1</a></li>{% endcomment %}
+                                        {% comment %}<li class="page-item"><a class="page-link" href="#">2</a></li>{% endcomment %}
+                                        {% comment %}<li class="page-item"><a class="page-link" href="#">3</a></li>{% endcomment %}
+                                        {% comment %}<li class="page-item">{% endcomment %}
+                                            {% comment %}<a class="page-link" href="#">Next</a>{% endcomment %}
+                                        {% comment %}</li>{% endcomment %}
+                                    {% comment %}</ul>{% endcomment %}
+                                {% comment %}</nav>{% endcomment %}
+                            {% comment %}</div>{% endcomment %}
+                        </div>
+                    </section>
+
+
+
+
+
+
+                    <!-- FOOTER -->
+                    {% include '_footer.liquid' %}
+                </div>
+            </div>
+        </div><!-- END: st-pusher -->
+    </div><!-- END: st-container -->
+</div><!-- END: body-wrap -->
+<a href="#" class="back-to-top btn-back-to-top"></a>
+{% include '_footer_js.liquid' %}
+</body>
+</html>

+ 241 - 0
resources/appearance/OceanWP/products_detail.liquid

@@ -0,0 +1,241 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<meta name="robots" content="index, follow">
+<meta name="author" content="Mietubl">
+<meta name="description" content="{{ product.seo_description }}">
+<meta name="keywords" content="{{product.seo_keywords}}">
+<title>{{product.seo_title}}</title>
+
+
+{% include '_header_css.liquid' %}
+</head>
+<body>
+
+
+<!-- MAIN WRAPPER -->
+<div class="body-wrap shop-default shop-cards shop-tech">
+    <div id="st-container" class="st-container">
+
+
+
+        <div class="st-pusher">
+            <div class="st-content">
+                <div class="st-content-inner">
+                    <!-- HEADER -->
+                    {% include '_header.liquid' %}
+                    <!-- END: HEADER -->
+
+                    <section class="slice sct-color-1">
+                        <div class="container">
+                            <!-- Product gallery and Description -->
+                            <div class="row cols-xs-space cols-sm-space cols-md-space">
+                                <div class="col-lg-6">
+                                    <div class="gallery-container">
+                                        <div id="slideshow" class="gallery-top no-padding bg-transparent"></div>
+                                        <div id="slideshow_thumbs" class="swiper-js-container gallery-thumbs gallery-thumbs--style-1 mt-4">
+                                            <div class="swiper-container" data-swiper-items="5" data-swiper-space-between="10" data-swiper-xs-items="3" data-swiper-xs-space-between="10" data-swiper-sm-items="4" data-swiper-sm-space-between="10">
+                                                <div class="swiper-wrapper">
+
+                                                    {% for item in product.images %}
+                                                        <div class="swiper-slide">
+                                                            <a href="{{ site.image_base_url }}{{ item.image_url }}?x-oss-process=image/resize,w_500,m_lfit" data-desoslide-index="{{ forloop.index0 }}">
+                                                                <img src="{{ site.image_base_url }}{{ item.image_url }}?x-oss-process=image/resize,h_100,m_lfit" alt="{{ product.title }}">
+                                                            </a>
+                                                        </div>
+                                                    {% endfor %}
+
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div class="col-lg-6">
+                                    <div class="px-2">
+                                        <!-- Product description -->
+                                        <div class="product-description-wrapper px-1">
+                                            <!-- Product title -->
+                                            <h2 class="product-title">
+                                                {{product.title }}
+                                            </h2>
+
+                                            <hr>
+
+                                            <div class="row align-items-center">
+
+
+                                            </div>
+
+                                            <!-- Product description -->
+                                            <div class="product-short-text mt-3">
+                                                <h3 class="heading heading-xs strong-500 text-uppercase">
+                                                    Description:
+                                                </h3>
+                                                <p>
+                                                    {{product.content }}
+                                                </p>
+                                            </div>
+
+                                            <hr>
+
+
+                                            <table class="table table-specs">
+
+                                                {% for item in product.parameters %}
+
+                                                <tbody>
+                                                <tr>
+                                                    <td>
+                                                        <span class="c-gray-light strong-600">  {{ item.key }}</span>
+                                                    </td>
+                                                    <td>
+                                                        {{ item.value }}
+                                                    </td>
+                                                </tr>
+                                                {% endfor %}
+                                                </tbody>
+                                            </table>
+                                            <hr>
+                                            <div class="row row-no-padding no-margin">
+                                                <div class="col-lg-8">
+                                                    <form class="form-default">
+                                                        <!-- Choose size -->
+                                                        <label class="strong-600">Contact us </label>
+
+
+                                                        <div class="d-table product-quantity width-100 mt-3">
+
+                                                            <div class="d-table-cell">
+                                                                <!-- Add to cart button -->
+                                                                {% comment %}<button type="button" class="btn btn-styled btn-block btn-base-1 btn-icon-left">{% endcomment %}
+                                                                    {% comment %}<i class="icon ion-android-cart"></i> Get a quote{% endcomment %}
+                                                                {% comment %}</button>{% endcomment %}
+{% comment %}{% endcomment %}
+                                                                {% comment %}<a data-fancybox data-type="iframe" data-src="/contact" href="javascript:;">{% endcomment %}
+                                                                    {% comment %}Webpage{% endcomment %}
+                                                                {% comment %}</a>{% endcomment %}
+
+
+
+                                                                <!-- The button that will retrieve the content from the hidden div -->
+                                                                <a data-fancybox data-src="#fancybox_hidden_content" class="btn btn-base-1 btn-icon-left" href="javascript:;">
+                                                                    <i class="icon ion-android-add"></i>     Get a quote
+                                                                </a>
+
+
+
+                                                            </div>
+                                                        </div>
+                                                    </form>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <span class="space-xs-xl"></span>
+
+
+                        </div>
+                    </section>
+
+                    <!-- FOOTER -->
+                    {% include '_footer.liquid' %}
+                </div>
+            </div>
+        </div><!-- END: st-pusher -->
+    </div><!-- END: st-container -->
+</div><!-- END: body-wrap -->
+<a href="#" class="back-to-top btn-back-to-top"></a>
+
+<!-- Hidden content -->
+<div   id="fancybox_hidden_content" style="display:none;">
+    <h4 >Get a quote</h4>
+    <form id="form_contact" data-action="/contact" class="form-default" role="form">
+        <input type="hidden" name="_token" value="{{ csrf_token }}">
+        <div class="row">
+            <div class="col-md-6">
+                <div class="form-group has-feedback">
+                    <label for="" class="text-uppercase c-gray-light">Your name</label>
+                    <input type="text" name="customer_name" class="form-control form-control-lg" required>
+                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                    <div class="help-block with-errors"></div>
+                </div>
+            </div>
+            <div class="col-md-6">
+                <div class="form-group has-feedback">
+                    <label for="" class="text-uppercase c-gray-light">Email address</label>
+                    <input type="email" name="email" class="form-control form-control-lg" required>
+                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                    <div class="help-block with-errors"></div>
+                </div>
+            </div>
+        </div>
+
+        <div class="row">
+            <div class="col-md-6">
+                <div class="form-group has-feedback">
+                    <label for="" class="text-uppercase c-gray-light">Company name</label>
+                    <input type="text" name="company_name" class="form-control form-control-lg">
+                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                    <div class="help-block with-errors"></div>
+                </div>
+            </div>
+            <div class="col-sm-6">
+                <div class="form-group has-feedback">
+                    <label for="" class="text-uppercase c-gray-light">Phone/whats_app</label>
+                    <input type="text" name="whats_app" class="form-control form-control-lg" required>
+                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                    <div class="help-block with-errors"></div>
+                </div>
+            </div>
+        </div>
+
+        <div class="row">
+            <div class="col-md-12">
+                <div class="form-group has-feedback">
+                    <label for=""  class="text-uppercase c-gray-light">Message</label>
+                    <textarea name="content" class="form-control no-resize" rows="5" required></textarea>
+                    <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
+                    <div class="help-block with-errors"></div>
+                </div>
+            </div>
+        </div>
+
+        <div class="">
+
+
+            <button type="reset" class="btn-reset d-none"></button>
+            <button type="submit" class="btn btn-styled btn-base-1 mt-4">Send message</button>
+        </div>
+    </form>
+
+</div>
+
+
+
+
+{% include '_footer_js.liquid' %}
+
+
+<!-- Deso Slide -->
+<script src="/static/js/jquery.desoslide.min.js"></script>
+<script>
+    $('#slideshow').desoSlide({
+        thumbs: $('#slideshow_thumbs .swiper-slide > a'),
+        thumbEvent: 'click',
+        first: 0,
+        effect: 'none',
+        overlay: 'none',
+        controls: {
+            show: false,
+            keys: false
+        },
+    });
+</script>
+</body>
+</html>