templates/areas/apk-products-related/view.html.twig line 1

Open in your IDE?
  4. {% if editmode %}
  6. <div class="uk-container apk-container-1400">
  7.     <div uk-alert>
  8.         <h1 class="uk-h1">APK product related</h1>
  9.     </div>
  10.     <ul uk-tab>
  11.         <li><a href="#">Configurations</a></li>
  12.         <li class="uk-active"><a href="#">Content Edit</a></li>
  13.     </ul>
  15.     <ul class="uk-switcher uk-margin">
  16.         <li class="apk-size-20 uk-grid-small" uk-grid>
  17.             {# Colonne 1 #}
  18.             <div class="uk-width-1-2@m" uk-margin>
  20.                 <div>Type de heading pour le titre ?</div>
  21.                 {{ pimcore_select("content-heading", {
  22.                     "store" : [
  23.                         ['span', 'span'],
  24.                         ['h1', 'Heading 1'],
  25.                         ['h2', 'Heading 2'],
  26.                         ['h3', 'Heading 3'],
  27.                         ['h4', 'Heading 4'],
  28.                         ['h5', 'Heading 5'],
  29.                         ['h6', 'Heading 6']
  30.                     ],
  31.                     "defaultValue" : "h2"
  32.                 }) }}
  34.                 <div><strong>Style</strong> du heading pour le titre ?</div>
  35.                 {{ pimcore_select("content-heading-style", {
  36.                     "store" : [
  37.                         ['h1', 'Heading 1'],
  38.                         ['h2', 'Heading 2'],
  39.                         ['h3', 'Heading 3'],
  40.                         ['h4', 'Heading 4'],
  41.                         ['h5', 'Heading 5'],
  42.                         ['h6', 'Heading 6']
  43.                     ],
  44.                     "defaultValue" : "h2"
  45.                 }) }}
  47.             </div>
  49.             {# Colonne 2 #}
  50.             <div class="uk-width-1-2@m" uk-margin>
  52.                 <div>Espacement en haut du block</div>
  53.                 {{ pimcore_select("margin-top", {
  54.                     "store" : [
  55.                         ['', 'Aucun'],
  56.                         ['uk-margin-small-top', 'Petit'],
  57.                         ['uk-margin-medium-top', 'Moyen'],
  58.                         ['uk-margin-large-top', 'Grand'],
  59.                         ['uk-margin-xlarge-top', 'Très grand'],
  60.                     ],
  61.                     "defaultValue" : ""
  62.                 }) }}
  63.     
  64.                 <div>Espacement en bas du block</div>
  65.                 {{ pimcore_select("margin-bottom", {
  66.                     "store" : [
  67.                         ['', 'Aucun'],
  68.                         ['uk-margin-small-top', 'Petit'],
  69.                         ['uk-margin-medium-top', 'Moyen'],
  70.                         ['uk-margin-large-top', 'Grand'],
  71.                         ['uk-margin-xlarge-top', 'Très grand'],
  72.                     ],
  73.                     "defaultValue" : ""
  74.                 }) }}
  76.                 <div>Afficher un scroll ?</div>
  77.                 {{ pimcore_select("scroll", {
  78.                     "store" : [
  79.                         ['', 'Aucun'],
  80.                         ['apk-scroll', 'SCROLL'],
  81.                         ['apk-top', 'TOP']
  82.                     ],
  83.                     "defaultValue" : "apk-top"
  84.                 }) }}
  85.                 
  86.             </div>
  88.         </li>
  89.     
  90.         <li class="uk-active">
  91.             <div class="uk-margin-large-bottom">
  93.                 <div class="uk-margin"><strong>Titre de la section</strong></div>
  94.                 <h2 class="uk-h2">
  95.                     {{ pimcore_textarea("content-title",{
  96.                         "nl2br" : true
  97.                     }) }}
  98.                 </h2>
  100.                 <div class="uk-margin"><strong>Texte supplémentaire en dessous du titre</strong></div>
  101.                 {{ pimcore_textarea("content-subtitle") }}
  103.                 <div class="uk-margin"><strong>Repeater de produits</strong></div>
  104.                 {% for row in pimcore_block('productBlock').iterator %}
  106.                     <div uk-alert>
  107.                         <div><strong>Univers</strong>du produit</div>
  108.                         {{ pimcore_select("product-universe", {
  109.                             "store" : [
  110.                                 ['apk-universe-magnecaps', 'Magnecaps'],
  111.                                 ['apk-universe-muscles', 'Magnecaps Muscles'],
  112.                                 ['apk-universe-relax', 'Magnecaps Relax'],
  113.                                 ['apk-universe-memory-concentration', 'Magnecaps Mem. & Concen.']
  114.                             ],
  115.                             "defaultValue" : "apk-universe-magnecaps"
  116.                         }) }}
  118.                         <div class="uk-margin"><strong>Titre du produit</strong></div>
  119.                         {{ pimcore_textarea("product-title") }}
  120.                         
  121.                         <div class="uk-margin"><strong>Image du produit</strong></div>
  122.                         {{ pimcore_image("product-image", {'width' : 300, 'height' : 200}) }}
  123.     
  124.                         <div class="uk-margin"><strong>Lien</strong></div>
  125.                         <div class="actions">
  126.                             {{ pimcore_link("content-btn", {
  127.                                 "class" : "uk-button"
  128.                             }) }}
  129.                             <hr>
  130.                             <dt>Google Analytics Event: Action</dt>
  131.                             <dd>{{ pimcore_input("content-btn-secondary-ga-1-1") }}</dd>
  132.                             <hr>
  133.                             <dt>Google Analytics Event: Category</dt>
  134.                             <dd>{{ pimcore_input("content-btn-secondary-ga-1-2") }}</dd>
  135.                             <hr>
  136.                             <dt>Google Analytics Event: Label</dt>
  137.                             <dd>{{ pimcore_input("content-btn-secondary-ga-1-3") }}</dd>
  138.                         </div>    
  139.                     </div>
  140.                     
  141.                 {% endfor %}
  142.                 
  143.             </div>
  144.         </li>
  145.     </ul>
  146. </div>
  148. {% endif %}
  150. {% if not editmode %}
  152. <div class="apk-areabrick-container uk-flex uk-flex-middle {{ pimcore_select("margin-top") }} {{ pimcore_select("margin-bottom") }}">
  154.     <div class="uk-container apk-container-1200">
  155.                 
  156.         <div class="uk-text-center">
  157.             
  158.             {% if not pimcore_textarea("content-title").isEmpty %}
  159.                 {% if pimcore_select("content-heading").data == "span" %}
  160.                     <span class="apk-title uk-{{ pimcore_select("content-heading-style").getData() }}">
  161.                         {{ pimcore_textarea("content-title", {
  162.                             "nl2br" : true,
  163.                             "htmlspecialchars" : false,
  164.                         })|raw }}
  165.                     </span>
  166.                 {% else %}
  167.                     {% set content_heading = pimcore_select("content-heading").getData() %}
  168.                     <{{ content_heading }} class="apk-title uk-{{ pimcore_select("content-heading-style").getData() }}">
  169.                         {{ pimcore_textarea("content-title", {
  170.                             "nl2br" : true,
  171.                             "htmlspecialchars" : false,
  172.                         })|raw }}
  173.                     </{{ content_heading }}>
  174.                 {% endif %}
  175.             {% endif %}
  176.                             
  177.             <span class="apk-subtitle">{{ pimcore_textarea("content-subtitle") }}</span>
  178.             
  179.         </div>
  180.         <div class="uk-margin-large-top uk-grid-large uk-child-width-expand@m" uk-grid uk-height-match="target: .apk-product-title">
  182.             {% for row in pimcore_block('productBlock').iterator %}
  184.             <div>
  185.                 <div class="apk-product-container hexagone uk-flex uk-flex-middle uk-flex-center">
  186.                     <div>
  187.                         <div class="apk-product-title uk-flex uk-flex-middle uk-flex-center">
  188.                             {{ pimcore_textarea("product-title", {'nl2br' : true}) }}
  189.                         </div>
  190.     
  191.                         <div class="apk-product-image">
  192.                             {% if pimcore_image("product-image").src %}
  193.                                 {{ pimcore_image("product-image").thumbnail('big-product-thumb').html()|raw }}    
  194.                             {% endif %}
  195.                         </div>
  196.     
  197.                         {% if not pimcore_link("content-btn").isEmpty() %}
  198.                         <div class="apk-product-action">
  199.                             {% if
  200.                                 not pimcore_input("content-btn-secondary-ga-1-1").isEmpty
  201.                                 and not pimcore_input("content-btn-secondary-ga-1-2").isEmpty 
  202.                                 and not pimcore_input("content-btn-secondary-ga-1-3").isEmpty 
  203.                             %}
  204.         
  205.                                 {{ pimcore_link("content-btn", {
  206.                                     "class" : "uk-button " ~ pimcore_select("product-universe").data,
  207.                                     "onclick" : "javascript:sendGtagEvent('" ~ add_slashes(pimcore_input("content-btn-secondary-ga-1-1")) ~ "',
  208.                                         '" ~ add_slashes(pimcore_input("content-btn-secondary-ga-1-2")) ~ "',
  209.                                         '" ~ add_slashes(pimcore_input("content-btn-secondary-ga-1-3")) ~ "');"
  210.                                 }) }}
  211.         
  212.                             {% else %}
  213.                             
  214.                                 {{ pimcore_link("content-btn", {
  215.                                     "class" : "uk-button " ~ pimcore_select("product-universe").data
  216.                                 }) }}
  217.                             
  218.                             {% endif %}
  219.                         </div>
  220.                         {% endif %}
  221.                     </div>
  222.                 </div>
  223.             </div>
  225.             {% endfor %}
  227.         </div>     
  228.     </div>
  230.     {# Scroll géré dans le main.js #}
  231.     {% if pimcore_select("scroll").data == "apk-scroll" or pimcore_select("scroll").data == "apk-top" %}
  232.     <div class="apk-scroll-container">
  233.         <div class="uk-container apk-container-1400">
  234.             <div class="uk-position-relative">
  235.             {% if pimcore_select("scroll").data == "apk-scroll" %}
  236.                 <div class="apk-scroll">
  237.                     {{ "SCROLL"|trans }}
  238.                 </div>
  239.             {% elseif pimcore_select("scroll").data == "apk-top" %}
  240.                 <div class="apk-scroll apk-top">
  241.                     {{ "TOP"|trans }}
  242.                 </div>
  243.             {% endif %}
  244.             </div>
  245.         </div>
  246.     </div>
  247.     {% endif %}
  248. </div>
  250. {% endif %}