templates/front/theme1/produits/page_produit.html.twig line 1

Open in your IDE?
  1. {% extends "front/"~ app.request.server.get('APP_THEME') ~"/base.html.twig" %}
  2. {% set parametre = ParametreSite() %}
  3. {% block preload %}
  4.     {% if post.image is defined  and post.image is not empty %}
  5.         {% if post.image %}
  6.             <link rel="preload" as="image" href="{{asset_image(post.image)}}" />
  7.         {% endif %}
  8.     {% endif %}
  10.      {% if galleries is defined and galleries is not empty %}
  11.            {% for item in galleries %}
  12.                 {% if item.path is defined %}
  13.                     <link rel="preload" as="image" href="{{asset_image_gallery(item.path)}}" />
  14.                 {% endif %}
  15.            {% endfor %}
  16.     {% endif %}
  18. {% endblock %}
  20. {% block stylesheets %}
  21.     {{parent()}}
  22.     {% if modele_galerie[0].type == 4 %}
  23.         <link rel="stylesheet" type="text/css" href="{{asset('templates/front/theme1/assets/plugins/flexslider/flexslider.css')}}" media="screen" >
  24.     {% endif %}
  25. {% endblock %}
  27. {% block body %}
  29.     {% set position_image = post.positionimage %}
  30.     {% set class_position = "" %}
  31.     {% if post.positionimage == 2 %}
  32.         {% set class_position = "float-md-left mb-2 mr-md-3"  %}
  33.     {% elseif post.positionimage == 3 %}
  34.         {% set class_position = "float-md-right mb-2 ml-md-3" %}
  35.     {% endif %}
  37.     {% if post.imageBandeau %}
  38.         {% set imagebandeau = post.imageBandeau %}
  39.     {% elseif parametre.imageBandeau %}
  40.         {% set imagebandeau = 'uploads/images/' ~ parametre.imageBandeau %}
  41.     {% else %}
  42.         {% set imagebandeau = '' %}
  43.     {% endif %}
  44.     
  45.     {% if imagebandeau != '' %}
  46.         <section class="image-bandeau text-center">
  47.             <img class="lazyload" alt="{{post.title}}" title="{{post.title}}" data-srcset="{{imagebandeau}}" src="{{asset(imagebandeau)}}" />
  48.             <div class="cnt-bandeau text-center">
  49.                 <div class="container-fluid wrapper">
  50.                     <div class="breadcrumb-style-default">
  51.                         <div class="row">
  52.                             <div class="col-lg-12">
  53.                                 <div class="inner text-center">
  54.                                     {% if breadcrumb is defined and breadcrumb is not empty %}
  55.                                         {{ include ('front/'~ app.request.server.get('APP_THEME') ~'/partials/breadcrumb.html.twig')}}
  56.                                     {% endif %}
  57.                                 </div>
  58.                             </div>
  59.                         </div>
  60.                     </div>
  61.                     <h1 class="page-title">{{post.title|raw}}</h1>
  62.                 </div>
  63.             </div>
  64.         </section>
  65.     {% endif %}
  67.     <div class="page_product pt-5">
  68.         {% if imagebandeau == '' %}
  69.         <div class="breadcrumb-style-default">
  70.             <div class="container">
  71.                 <div class="row">
  72.                     <div class="col-lg-12">
  73.                         <div class="inner text-center">
  74.                             {% if breadcrumb is defined and breadcrumb is not empty %}
  75.                                 {{ include ('front/'~ app.request.server.get('APP_THEME') ~'/partials/breadcrumb.html.twig')}}
  76.                                  {% if post.image is empty  %}
  77.                                     <h1 class="page-title">{{breadcrumb|last.name}}</h1>
  78.                                 {% endif %}
  79.                             {% endif %}
  80.                         </div>
  81.                     </div>
  82.                 </div>
  83.             </div>
  84.         </div>
  85.         {% endif %}
  87.         <div class="container-fluid  {{categories_tree is defined and categories_tree is not empty?'':'wrapper'}} mt-3">
  88.             <div class="row gx-5 py-2">
  89.                 {% if categories_tree is defined and categories_tree is not empty %}
  90.                     <div class="col-sm-12 col-md-3 {{show_filter_categorie is defined and show_filter_categorie == true ?'':'d-none'}}">
  91.                          {{ include ('front/'~ app.request.server.get('APP_THEME') ~'/partials/product/_sidebar.html.twig')}}
  92.                     </div>
  93.                 {% endif %}
  94.                 
  95.                 <div class="col-sm-12 col-md-{{show_filter_categorie is defined and show_filter_categorie == true?'9':'12'}} bloc-content-produit">
  96.                      <div class="row">
  97.                             <div class="col-sm-12 col-lg-6">
  98.                                 {% if not (modele_galerie[0].type == 4 and galleries|length > 1) %}
  99.                                 <div class="image-product">
  100.                                     {% if post.image and post.image is not empty  %}
  101.                                         <a href="{{asset_image(post.image,'medium')}}" data-fancybox="image" tirle="{{post.titre}}" >
  102.                                            <img class="img-fluid" data-srcset="{{asset_image(post.image,'medium')}}" src="{{asset_image(post.image,'medium')}}" alt="{{post.titre}}" />
  103.                                         </a>
  104.                                       
  105.                                     {% elseif galleries is defined and galleries is not empty %}
  106.                                         <a href="{{asset_image_gallery(galleries[0].path)}}" data-fancybox="image" tirle="{{post.titre}}" >
  107.                                             <img class="img-fluid" data-srcset="{{asset_image_gallery(galleries[0].path)}}" src="{{asset_image_gallery(galleries[0].path)}}" alt="{{post.titre}}" />
  108.                                         </a>
  109.                                        
  110.                                     {% elseif parametre.imageVide is defined and parametre.imageVide is not empty %}
  111.                                          <a href="{{asset('/uploads/images/'~ parametre.imageVide)}}" data-fancybox="image" tirle="{{post.titre}}" >
  112.                                            <img class="img-fluid" data-srcset="{{asset('/uploads/images/'~ parametre.imageVide)}}" src="{{asset('/uploads/images/'~ parametre.imageVide)}}" alt="{{post.titre}}" />
  113.                                         </a>
  114.                                     {% endif %}
  116.                                     {% if post.disponibiliteproduit %}
  117.                                         <span class="disponible">{{'disponible'|upper}}</span>
  118.                                     {% endif %}
  119.                                 </div>
  120.                                 {% else %}
  121.                                     {% if galleries and galleries is not empty and template_model_gallerie is defined and template_model_gallerie is not empty %}
  122.                                         <div class="image-product">
  123.                                             {% if (post.image is defined and post.image == null) %}
  124.                                                 {% set galleries = galleries|slice(1) %}
  125.                                             {% endif %}
  126.                                             
  127.                                             {{ include(template_from_string(template_model_gallerie)) }}
  128.                                             {% if post.disponibiliteproduit %}
  129.                                                 <span class="disponible">{{'disponible'|upper}}</span>
  130.                                             {% endif %}
  131.                                         </div>
  132.                                     {% endif %}
  133.                                 {% endif %}
  134.                             </div>
  135.                             <div class="col-sm-12 col-lg-6 mt-lg-0 mt-4">
  136.                                 {% if post.image and post.image is not empty and imagebandeau == ''  %}
  137.                                     <h1 class="page-title">{{breadcrumb|last.name}}</h1>
  138.                                 {% endif %}
  140.                                 {% if post.content is not empty and post.content != " " %}
  141.                                     {{post.content|raw}}
  142.                                 {% endif %}
  143.                                
  145.                                 {% if post.prixproduit %}
  146.                                     <div class="price_product"> Prix : <span>{{post.prixproduit}}</span> € </div>
  147.                                 {% endif %}
  148.                                 
  149.                                 {% if post.referanceproduit %}
  150.                                     <div class="ref_product"> Réf : <strong>{{post.referanceproduit}} </strong></div>
  151.                                 {% endif %}
  153.                                 {% if champsPersonnalisesPost is defined and champsPersonnalisesPost is not empty %}
  154.                                     <div class="autre_info">
  155.                                         {% for item in champsPersonnalisesPost %}
  156.                                              <div class="item d-flex">
  157.                                                 <div class="label"> {{item.label}} : </div>
  158.                                                 <div class="value"> {{item.value}}</div>
  159.                                             </div>
  160.                                         {% endfor %}
  161.                                     </div>
  162.                                 {% endif %}
  163.                                 
  164.                                     
  165.                                     
  166.                                 {% if post.prixproduit is not empty %}
  167.                                     {% if post.typepost.parametrepost[0] is defined and  post.typepost.parametrepost[0].actifpanier == true %}
  168.                                         <div class="input-quantite">
  169.                                             <label>Quantité :</label>
  170.                                             <input type="number" class="form-control quantite" value="1" min="1" name="qte" />
  171.                                         </div>
  172.                                     {% endif %}
  173.                                 {% endif %}
  175.                                 {% if post.typepost.parametrepost[0] is defined and (post.typepost.parametrepost[0].actifpanier == true or post.typepost.parametrepost[0].buttoninteresse != "") %}
  176.                                     <div class="d-flex mt-3 boutons-panier">
  177.                                         {% if post.prixproduit is not empty and post.typepost.parametrepost[0].actifpanier == true %}
  178.                                             <button title="Ajouter au panier" class="btn btn-add-panier">Ajouter au panier</button>
  179.                                         {% endif %}
  180.                                         
  181.                                         {% if post.typepost.parametrepost[0].buttoninteresse != "" and slug_page_contact('page-contact') != null %}
  182.                                            <a href="{{path('page',{slug:slug_page_contact('page-contact')})}}?product={{post.slug}}" class="btn btn-interesse">{{post.typepost.parametrepost[0].buttoninteresse}}</a>
  183.                                         {% endif %}
  184.                                     </div>
  185.                                 {% endif %}                          
  186.                             </div>
  188.                             {% if post.produitsinfo is defined and post.produitsinfo is not empty %}
  189.                                 <div class="col-md-12">
  190.                                     <div class="product-tabs">
  191.                                         <ul class="tabs">
  192.                                             {% for key,item in post.produitsinfo %}
  193.                                                 <li class="tab-link {{key == 0?'current':''}}" data-tab="tab-{{key + 1}}">{{item.titre|upper}}</li>
  194.                                             {% endfor %}
  195.                                         </ul>
  196.                                         <div class="">
  197.                                             {% for key,item in post.produitsinfo %}
  198.                                                 <div id="tab-{{key + 1}}" class="tab-content {{key == 0?'current':''}}">{{item.text|raw}}</div>
  199.                                             {% endfor %}
  200.                                         </div>
  201.                                     </div>
  202.                                 </div>
  203.                             {% endif %}
  205.                             <div class="col-sm-12">
  206.                                     {% if post.typelien == null %}
  207.                                             {% if categorieTree is defined and categorieTree[0] is defined  %}
  208.                                                 <div class="text-center py-2">
  209.                                                     <a href="{{path('page',{slug:categorieTree[0].slug})}}" class="btn btn-cms py-3 px-5 mt-3 btn-plus">Retour à la liste {{categorieTree[0].titre}}</a>
  210.                                                 </div>
  211.                                             {% endif %}
  212.                                     {% elseif post.typelien != 1 %}
  213.                                             {% if post.typelien == '4' %}
  214.                                                 <div class="text-center py-2">
  215.                                                     <a href="javascript:void(0)" onclick="window.location.href = 'tel:{{post.telephone}}';" class="btn btn-cms py-3 px-5 mt-3 btn-plus">{{post.titrelien}}</a>
  216.                                                 </div>
  217.                                             {% elseif post.typelien == '2' %}
  218.                                                 <div class="text-center py-2">
  219.                                                     <a href="{{slug_link_interne(post.lieninterne)}}" class="btn btn-cms py-3 px-5 mt-3 btn-plus">{{post.titrelien}}</a>
  220.                                                 </div>
  221.                                             {% elseif post.typelien == '3' %}
  222.                                                 <div class="text-center py-2">
  223.                                                     <a href="{{post.lienexterne}}" target="_blank" class="btn btn-cms py-3 px-5 mt-3 btn-plus">{{post.titrelien}}</a>
  224.                                                 </div>
  225.                                             {% endif %}
  226.                                     {% endif %}
  228.                                     {% if docs and docs is not empty %}
  229.                                         <div class="col-md-12 bloc-docs d-flex justify-content-center">
  230.                                             {% for doc in docs %}
  231.                                                 <a class="btn-back-pulse m-2" href="{{doc.location ~ doc.path ~ '/' ~ doc.fileName}}" title="{{doc.titre}}" target="_blank"><i class="fa fa-file-pdf-o mr-2"></i>{{doc.titre}}</a>   
  232.                                             {% endfor %}
  233.                                         </div>
  234.                                     {% endif %}
  235.                             </div>
  236.                      </div>
  237.                 </div>
  238.             </div>
  239.         </div>
  240.         {% if galleries and galleries is not empty and template_model_gallerie is defined and template_model_gallerie is not empty and modele_galerie[0].type != 4 %}
  241.             {% if (post.image is defined and post.image == null) %}
  242.                   {% set galleries = galleries|slice(1) %}
  243.             {% endif %}
  244.             
  245.             {{ include(template_from_string(template_model_gallerie)) }}
  246.         {% endif %}
  248.         {% if post.urlvideo is not empty %}
  249.             <div class="container-fluid wrapper mt-3">
  250.                 <div class="col-md-12 mt-1">
  251.                     <div class="video">
  252.                         {% set id_video_externe = post.urlvideo|split('?v=')[1] %}
  253.                         <a class="video-thumbnail m-0" href="{{post.urlvideo}}" data-fancybox="video">
  254.                             <img src="https://img.youtube.com/vi/{{id_video_externe}}/maxresdefault.jpg" class="img-fluid" alt=""/>
  255.                         </a>
  256.                     </div>
  257.                 </div>
  258.             </div>
  259.         {% endif %}
  263.         {% if blocs is defined  %}
  264.             {% for bloc in blocs.Bloc %}
  265.                 {% if is_mobile() and  bloc.mobile == true   %}
  266.                     {{ include ('front/'~ app.request.server.get('APP_THEME') ~'/bloc/bloc.html.twig',{
  267.                         bloc: bloc,
  268.                     }, with_context = false)}}
  269.                 {% endif %}
  270.                 
  271.                 {% if is_full_view() and is_mobile() == false and bloc.desktop == true %}
  272.                     {{ include ('front/'~ app.request.server.get('APP_THEME') ~'/bloc/bloc.html.twig',{
  273.                         bloc: bloc,
  274.                     }, with_context = false)}}
  275.                 {% endif %}
  276.             {% endfor %}
  277.         {% endif %} 
  279.         {% if produit_related is defined and produit_related is not empty %}
  280.             <section class="">
  281.                     <div class="container-fluid  mt-3">
  282.                         <div class="row gx-5 py-2">
  283.                             <div class="col-sm-12 text-center">
  284.                                 {% if post.typepost.parametrepost[0] is defined %}
  285.                                     <h2 class="sub-title wow">{{post.typepost.parametrepost[0].titreblocproduitrelated}}</h2>
  286.                                 {% endif %}
  287.                             </div>
  288.                             <div class="col-sm-12">
  289.                                 <div class="list_blocs pos1">
  290.                                     <div class="blocs">
  291.                                         <section class="results dynam-affichage affichage1 type_affiche3 ">
  292.                                             {% for item in produit_related %}
  293.                                                 {% set duree = 0.1 %}
  294.                                                 {% set prix = "" %}
  295.                                                 
  296.                                                 {% if item.prixproduit is defined %}
  297.                                                     {% set prix = item.prixproduit %}
  298.                                                 {% endif %}
  299.                                                 
  300.                                                 {% set image_item = item.image != null? asset_image(item.image): null %}
  301.                                                 {% if image_item == null %}
  303.                                                     {% set filteredItems = resultats_first_images_produits|filter(p => p.id == item.id) %}
  305.                                                     {% for first_gallerie_image in filteredItems %}
  306.                                                         
  307.                                                         {% set image_item = first_gallerie_image.galleries_first_image != null? asset_image_gallery(first_gallerie_image.galleries_first_image): null %}
  308.                                                         
  309.                                                     {% endfor %}
  310.                                                 {% endif %}
  311.                                                 {% set image_item = image_item != null? image_item :asset('uploads/images/' ~ parametre.imagevide) %}
  313.                                                 <div class="article wow zoomIn animated" {% if prix is not empty and (param_post is defined and param_post.actifprixliste is defined and param_post.actifprixliste == 1) %}data-prix="{{prix}}"{% endif %} data-wow-delay="{{duree}}s" style="visibility: visible; animation-delay: 0.1s; animation-name: zoomIn;">
  314.                                                     <span class="article-image lazyloaded"  style="background-image: url({{image_item}}); background-size: cover; background-position: center center; background-repeat: no-repeat;"> </span>                 
  315.                                                     <span class="article-cnt">
  316.                                                         {% if GetCategory(item.defaultcategorie) %}
  317.                                                             <a class="article-titre" href="{{path('page_sous_categorie',{categorie1:GetCategory(item.defaultcategorie).slugurl,categorie2:item.slug})}}" title="{{item.title|raw}}">{{item.title|raw}}</a> 
  318.                                                         {% endif %} 
  320.                                                         {% if prix is not empty and (param_post is defined and param_post.actifprixliste is defined and param_post.actifprixliste == 1) %}
  321.                                                             <span class="article-prix">{{prix}} €</span>
  322.                                                         {% endif %}
  324.                                                         {% if item.summary is not empty %}
  325.                                                             <span class="article-txt">
  326.                                                                 {{item.summary|raw}}
  327.                                                             </span>
  328.                                                         {% else %}
  329.                                                             <span class="article-txt">
  330.                                                             {% if item.content != "" %}
  331.                                                                 {{cutText(item.content)|raw}}
  332.                                                             {% endif %}
  333.                                                             </span>
  334.                                                         {% endif %}
  335.                                                        
  336.                                                         {% if GetCategory(item.defaultcategorie) %}
  337.                                                             <span class="article-bts">
  338.                                                                 <button class="article-plus btn-fade" onclick="window.open('{{path('page_sous_categorie',{categorie1:GetCategory(item.defaultcategorie).slugurl,categorie2:item.slug})}}', '_self');" title="En savoir plus">En savoir plus</button>
  339.                                                             </span> 
  340.                                                         {% endif %} 
  341.                                                     </span>
  342.                                                 </div>
  343.                                                 {% set duree = duree + 0.2 %}
  344.                                             {% endfor %}
  345.                                         </section>
  346.                                     </div>
  347.                                 </div>
  348.                             </div>
  350.                         </div>
  351.                     </div>
  352.             </section>
  353.         {% endif %}
  355.     </div> 
  357.     {% if post.typepost.parametrepost[0] is defined and post.typepost.parametrepost[0].actifpanier == true %}
  358.         <div id="ModalAjoutPanier" class="modal modal_cart">
  359.             <!-- Modal content -->
  360.             <div class="modal-content">
  361.                 <div  class='top_prod'>Votre produit a été ajouté avec succès<span class="close">&times;</span></div>
  362.                 <div class="modal_content bg_bot">
  363.                         <div id="name_produit2">Produit : <span></span> </div>             
  364.                         <div class="prix_vente2">Prix : <span></span> &euro;</div>
  365.                     <button title="Continuer mes achats" class="btn-continuer link_addSelection_detail2" id="addthis_selection2">Continuer mes achats</button>  
  367.                     {% set espace_client = 1 %} 
  369.                     {% if espace_client %}
  370.                         <button onclick="window.location.href = '/espace-client/login'" title="Ajouter à ma commande" class="btn-back-pulse link_addSelection_detail" id="addthis_selection22">Je termine ma commande</button>  
  371.                     {% else %}
  372.                         <button onclick="window.location.href = '/contact'" title="Ajouter à ma commande" class="btn-back-pulse link_addSelection_detail" id="addthis_selection22">Je termine ma commande</button>
  373.                     {% endif %}
  376.                 </div>
  377.             </div>
  378.         </div> 
  379.     {% endif %}
  381. {% endblock %}
  383. {% block javascripts %}
  384.     {{parent()}}
  385.     {% if post.typepost.parametrepost[0] is defined and post.typepost.parametrepost[0].actifpanier == true %}
  386.         <script>
  387.             $(document).ready(function() {
  388.                 var modal = document.getElementById('ModalAjoutPanier');
  389.                 var closeBtn = modal.getElementsByClassName("close");
  390.                 var continuerBtn = modal.getElementsByClassName("link_addSelection_detail2");
  391.                 $('.btn-add-panier').click(function() {
  392.                     var productId = {{ post.id }};
  393.                     var qte = $('.quantite').val();
  394.                     $.ajax({
  395.                         url: '/panier/add/'+escape(productId)+'/'+escape(qte),
  396.                         type: 'POST',
  397.                         dataType: 'JSON',
  398.                         success: function(response) {
  399.                             var panier = response.panier;
  400.                             updatePanier(panier);
  401.                             if(response.success){
  402.                                 var titre_produit = $('.page-title').text();
  403.                                 var prix_produit = $('.price_product span').text();
  404.                                 $('#name_produit2 span').text(titre_produit);
  405.                                 $('.prix_vente2 span').text(prix_produit);
  406.                                 modal.style.display = "block";
  407.                             }
  408.                         },
  409.                         error: function(xhr, status, error) {
  410.                             console.log(error); // Affichez l'erreur pour le débogage
  411.                         }
  412.                     });
  413.                 });
  415.                 function closeModal() {
  416.                     modal.style.display = "none";
  417.                 }
  418.                 
  419.                 $(closeBtn).click(closeModal);
  420.                 $(continuerBtn).click(closeModal);
  422.             });
  423.         </script>
  425.     {% endif %}
  427.     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
  428.     {% if modele_galerie[0].type == 4 %}
  429.         <script src="{{asset('templates/front/theme1/assets/plugins/flexslider/jquery.flexslider.js')}}" ></script>
  431.         <script>    
  432.             if ($(".sx_flexslider").length) {
  433.                 $('.flex-carousel').flexslider({
  434.                     animation: "slide",
  435.                     controlNav: false,
  436.                     animationLoop: true,
  437.                     slideshow: false,
  438.                     itemWidth: 150,
  439.                     asNavFor: '.flex-slider'
  440.                 });
  442.                 $('.flex-slider').flexslider({
  443.                     animation: "slide",
  444.                     controlNav: false,
  445.                     animationLoop: true,
  446.                     slideshow: false,
  447.                     sync: ".flex-carousel"
  448.                 });
  449.             }
  450.         </script>
  451.     {% endif %}
  453.     <script>
  454.         $(document).ready(function(){
  455.             $('ul.tabs li').click(function(){
  456.                 var tab_id = $(this).attr('data-tab');
  458.                 $('ul.tabs li').removeClass('current');
  459.                 $('.tab-content').removeClass('current');
  461.                 $(this).addClass('current');
  462.                 $("#"+tab_id).addClass('current');
  463.             })
  464.         })
  465.     </script>
  467. {% endblock %}