templates/bundles/SyliusShopBundle/Product/show.html.twig line 1

  1. {% extends nglayouts.layoutTemplate %}
  3. {% block title %}
  4.     {{ product.name }}
  5. {% endblock %}
  6. {% block post_header %}
  7.     {{ render(path('bitbag_sylius_cms_plugin_shop_media_render', {'code' : 'shop_post_header', 'template' : 'frontend/cms/common/media/_header.html.twig'})) }}
  8. {% endblock %}
  9. {% block body %}
  11.     <!--Product Details Start-->
  12.     <section class="product-details">
  13.         <div class="container pb-70">
  14.             <div class="row">
  15.                 <div class="col-lg-6 col-xl-6">
  16.                     {% include '@SyliusShop/Product/Show/_images.html.twig' %} 
  17.                 </div>
  18.                 <div class="col-lg-6 col-xl-6 product-info">
  19.                     <div class="product-details__top">
  20.                         <h3 class="product-details__title">{{ product.name }}
  21.                             {# <span>$76.00</span> #}
  22.                         </h3>
  23.                     </div>
  24.                     <div class="product-details__reveiw">
  25.                         {# <i class="fa fa-star"></i>
  26.                         <i class="fa fa-star"></i>
  27.                         <i class="fa fa-star"></i>
  28.                         <i class="fa fa-star"></i>
  29.                         <i class="fa fa-star"></i>
  30.                         <span>2 Customer Reviews</span> #}
  31.                     </div>
  32.                     <div class="product-details__content">
  33.                         <p class="product-details__content-text1" {{ product.shortDescription }}</p>
  34.                         {# <p class="product-details__content-text2">
  35.                             <strong>REF.</strong>
  36.                             4231/406
  37.                             <br>
  38.                             Available in store</p> #}
  39.                     </div>
  41.                     
  42.                     {% include '@SyliusShop/Product/Show/_variantSelection.html.twig' %} 
  43.                     <div class="product-details__social">
  44.                         <div class="title mt-10">
  45.                             <h3>Share with friends</h3>
  46.                         </div>
  47.                         <ul class="social-icon-one product-share">
  48.                             <li>
  49.                                 <a href="#">
  50.                                     <i class="fab fa-twitter"></i>
  51.                                 </a>
  52.                             </li>
  53.                             <li>
  54.                                 <a href="#">
  55.                                     <i class="fab fa-facebook-f"></i>
  56.                                 </a>
  57.                             </li>
  58.                             <li>
  59.                                 <a href="#">
  60.                                     <i class="fab fa-pinterest"></i>
  61.                                 </a>
  62.                             </li>
  63.                             <li>
  64.                                 <a href="#">
  65.                                     <i class="fab fa-instagram"></i>
  66.                                 </a>
  67.                             </li>
  68.                         </ul>
  69.                     </div>
  70.                 </div>
  71.             </div>
  72.         </div>
  73.     </section>
  74.     <!--Product Details End-->
  76.     <!--Product Description Start-->
  77.     <section class="product-description">
  78.         <div class="container pt-0 pb-90">
  79.             <div class="product-discription">
  80.                 <div class="tabs-box"> 
  81.                     {% include '@SyliusShop/Product/Show/Tabs/_menu.html.twig' %}
  82.                     {% include '@SyliusShop/Product/Show/Tabs/_content.html.twig' %} 
  83.                 </div>
  84.             </div>
  85.         </div>
  86.     </section>
  87.     <!--Product Description End-->
  89.     <section class="related-product">
  90.         <div class="container pt-0 pb-90">
  91.             <h3>Related Products</h3>
  92.             <div class="row clearfix">
  93.                 <div
  94.                     class="col">
  95.                     <!--MixitUp Galery-->
  96.                     <div class="mixitup-gallery">
  97.                         <div
  98.                             class="filter-list row">
  99.                             <!--Product Block-->
  100.                             <div class="product-block all mix pantry fruit col-lg-3 col-md-6 col-sm-12">
  101.                                 <div class="inner-box">
  102.                                     <div class="image">
  103.                                         <a href="shop-product-details.html"><img src="https://via.placeholder.com/600x600" alt=""/></a>
  104.                                     </div>
  105.                                     <div class="content">
  106.                                         <h4>
  107.                                             <a href="shop-product-details.html">Headphone</a>
  108.                                         </h4>
  109.                                         <span class="price">$32.00</span>
  110.                                         <span class="rating">
  111.                                             <i class="fa fa-star"></i>
  112.                                             <i class="fa fa-star"></i>
  113.                                             <i class="fa fa-star"></i>
  114.                                             <i class="fa fa-star"></i>
  115.                                             <i class="fa fa-star"></i>
  116.                                         </span>
  117.                                     </div>
  118.                                     <div class="icon-box">
  119.                                         <a href="shop-product-details.html" class="ui-btn like-btn">
  120.                                             <i class="fa fa-heart"></i>
  121.                                         </a>
  122.                                         <a href="shop-cart.html" class="ui-btn add-to-cart">
  123.                                             <i class="fa fa-shopping-cart"></i>
  124.                                         </a>
  125.                                     </div>
  126.                                 </div>
  127.                             </div>
  129.                             <!--Product Block-->
  130.                             <div class="product-block all mix dairy meat fruit col-lg-3 col-md-6 col-sm-12">
  131.                                 <div class="inner-box">
  132.                                     <div class="image">
  133.                                         <a href="shop-product-details.html"><img src="https://via.placeholder.com/600x600" alt=""/></a>
  134.                                     </div>
  135.                                     <div class="content">
  136.                                         <h4>
  137.                                             <a href="shop-product-details.html">Lagage</a>
  138.                                         </h4>
  139.                                         <span class="price">$32.00</span>
  140.                                         <span class="rating">
  141.                                             <i class="fa fa-star"></i>
  142.                                             <i class="fa fa-star"></i>
  143.                                             <i class="fa fa-star"></i>
  144.                                             <i class="fa fa-star"></i>
  145.                                             <i class="fa fa-star"></i>
  146.                                         </span>
  147.                                     </div>
  148.                                     <div class="icon-box">
  149.                                         <a href="shop-product-details.html" class="ui-btn like-btn">
  150.                                             <i class="fa fa-heart"></i>
  151.                                         </a>
  152.                                         <a href="shop-cart.html" class="ui-btn add-to-cart">
  153.                                             <i class="fa fa-shopping-cart"></i>
  154.                                         </a>
  155.                                     </div>
  156.                                 </div>
  157.                             </div>
  159.                             <!--Product Block-->
  160.                             <div class="product-block all mix pantry fruit vagetables col-lg-3 col-md-6 col-sm-12">
  161.                                 <div class="inner-box">
  162.                                     <div class="image">
  163.                                         <a href="shop-product-details.html"><img src="https://via.placeholder.com/600x600" alt=""/></a>
  164.                                     </div>
  165.                                     <div class="content">
  166.                                         <h4>
  167.                                             <a href="shop-product-details.html">Watch</a>
  168.                                         </h4>
  169.                                         <span class="price">$32.00</span>
  170.                                         <span class="rating">
  171.                                             <i class="fa fa-star"></i>
  172.                                             <i class="fa fa-star"></i>
  173.                                             <i class="fa fa-star"></i>
  174.                                             <i class="fa fa-star"></i>
  175.                                             <i class="fa fa-star"></i>
  176.                                         </span>
  177.                                     </div>
  178.                                     <div class="icon-box">
  179.                                         <a href="shop-product-details.html" class="ui-btn like-btn">
  180.                                             <i class="fa fa-heart"></i>
  181.                                         </a>
  182.                                         <a href="shop-cart.html" class="ui-btn add-to-cart">
  183.                                             <i class="fa fa-shopping-cart"></i>
  184.                                         </a>
  185.                                     </div>
  186.                                 </div>
  187.                             </div>
  189.                             <!--Product Block-->
  190.                             <div class="product-block all mix dairy pantry meat vagetables col-lg-3 col-md-6 col-sm-12">
  191.                                 <div class="inner-box">
  192.                                     <div class="image">
  193.                                         <a href="shop-product-details.html"><img src="https://via.placeholder.com/600x600" alt=""/></a>
  194.                                     </div>
  195.                                     <div class="content">
  196.                                         <h4>
  197.                                             <a href="shop-product-details.html">SD Card</a>
  198.                                         </h4>
  199.                                         <span class="price">$32.00</span>
  200.                                         <span class="rating">
  201.                                             <i class="fa fa-star"></i>
  202.                                             <i class="fa fa-star"></i>
  203.                                             <i class="fa fa-star"></i>
  204.                                             <i class="fa fa-star"></i>
  205.                                             <i class="fa fa-star"></i>
  206.                                         </span>
  207.                                     </div>
  208.                                     <div class="icon-box">
  209.                                         <a href="shop-product-details.html" class="ui-btn like-btn">
  210.                                             <i class="fa fa-heart"></i>
  211.                                         </a>
  212.                                         <a href="shop-cart.html" class="ui-btn add-to-cart">
  213.                                             <i class="fa fa-shopping-cart"></i>
  214.                                         </a>
  215.                                     </div>
  216.                                 </div>
  217.                             </div>
  218.                         </div>
  219.                     </div>
  220.                 </div>
  221.             </div>
  222.         </div>
  223.     </section>
  224.     
  225. {% endblock %}
  226. {% block javascripts %}
  227.     {{ parent() }}
  229.     <script>
  231.         $('#sylius_add_to_card_btn').on('click', function (e) {
  232. e.preventDefault();
  233. jQuery('#sylius_add_to_card_btn_spin').addClass('fa-spinner');
  234. var form = jQuery(this).closest('form');
  235. jQuery.ajax({
  236. url: form.attr('action'),
  237. type: form.attr('method'),
  238. data: form.serialize(),
  239. success: function (html, statut) { /*if(statut == 'success'){
  240.           location.reload();
  241.         }else{
  243.         }*/
  244. location.reload();
  245. // alert("{{app.request.attributes.get('_route')}}");
  247. // Replace current position field ...
  248. /*$('#meetup_position').replaceWith(
  249.           // ... with the returned one from the AJAX response.
  250.           $(html).find('#meetup_position')
  251.         );*/
  252. // Position field now displays the appropriate positions.
  253. }
  254. });
  255. });
  256.     </script>
  257. {% endblock %}