templates/areas/article/view.html.twig line 1

Open in your IDE?
  1. {% if editmode %}
  2.     <style>
  3.         .article-edit-box,
  4.         .editor-checkbox label {
  5.             color: #fff;
  6.         }
  7.     </style>
  8.     <div class="main-article-area">
  9.         {{ pimcore_input("title", {
  10.             "placeholder": 'Cím',
  11.             "class": "article-edit-title"
  12.         }) }}
  13.         <div style="display: flex; align-items: center; margin-bottom: 25px">
  14.             <label class="pimcore-edit-label">Cím igazítása: </label>
  15.             {{ pimcore_select("title_align", {
  16.                 "store": [
  17.                     ["left", "Balra"],
  18.                     ["center", "Középre"],
  19.                 ],
  20.                 "defaultValue" : "left"
  21.             }) }}
  22.         </div>
  23.         <div style="display: flex; align-items: center; margin-bottom: 25px">
  24.             <label class="pimcore-edit-label">Cím utáni távolság: </label>
  25.             {{ pimcore_select("title_padding", {
  26.                 "store": [
  27.                     ["small", "Kicsi"],
  28.                     ["medium", "Közepes"],
  29.                     ["big", "Nagy"],
  30.                 ],
  31.                 "defaultValue" : "small"
  32.             }) }}
  33.         </div>
  35.         <div class="article-area-checkbox-container">
  36.             {{ pimcore_checkbox('contentEmbed', {
  37.                 'reload': true,
  38.                 'class': 'editor-checkbox',
  39.                 'label': 'Beágyazott tartalom '
  40.             }) }}
  41.             <span title="A jelölőnégyzet használatával a szerkesztő tartalma elveszik.">ℹ️</span>
  42.         </div>
  43.         {% if pimcore_checkbox('contentEmbed').isChecked() %}
  44.             <div class="article-area-embed-container">
  45.                 {{ pimcore_textarea('embedContent', {
  46.                     "height": "200",
  47.                     "placeholder": "Beágyazott tartalom",
  48.                     "class": "article-edit-box"
  49.                 }) }}
  50.             </div>
  51.         {% else %}
  52.             {{ pimcore_wysiwyg("content", {
  53.                 "height": 200,
  54.                 "placeholder": "Szöveg",
  55.                 "class": "article-edit-box"
  56.             }) }}
  57.         {% endif %}
  59.         <div class="article-images-container">
  60.             <h3>Képek</h3>
  61.             {% for i in pimcore_block('article-images-top').iterator %}
  62.                 {{ pimcore_image("article-image-top", { "class": "w-max-100-percent" }) }}
  63.             {% endfor %}
  65.         </div>
  67.         <div>
  68.             <h3>Apple link</h3>
  69.             {{ pimcore_link('dld_apple') }}
  71.             <h3>Google link</h3>
  72.             {{ pimcore_link('dld_google') }}
  73.         </div>
  75.         {{ pimcore_wysiwyg("contentFooter", {
  76.             "height": 200,
  77.             "placeholder": "Szöveg",
  78.             "class": "article-edit-box"
  79.         }) }}
  81.     </div>
  83.     <div class="article-images" style="background-color: #fff !important;">
  84.         <h3>KÉPEK</h3>
  85.         {% for i in pimcore_block('article-images').iterator %}
  86.             <p>Link:<br>{{ pimcore_link('link', {'required': 'linkonly'}) }}</p>
  87.             <p>Kép:<br>{{ pimcore_image('image', {'required': true}) }}</p>
  88.             <hr>
  89.         {% endfor %}
  90.     </div>
  91. {% else %}
  92.     {% set title = pimcore_input("title") %}
  93.     {% set content = pimcore_wysiwyg("content") %}
  94.     {% set contentFooter = pimcore_wysiwyg("contentFooter") %}
  95.     {% set titleAlign = pimcore_select('title_align') %}
  96.     {% set titlePadding = pimcore_select('title_padding') %}
  98.     <div class="main-article-area">
  99.         {% if title and title.getText() %}
  100.             {% set align = 'left' %}
  101.             {% set padding = 'small' %}
  103.             {% if titleAlign and titleAlign.getData() %}
  104.                 {% set align = titleAlign.getData() %}
  105.             {% endif %}
  107.             {% if titlePadding and titlePadding.getData() %}
  108.                 {% set padding = titlePadding.getData() %}
  109.             {% endif %}
  111.             <h1 class="title-padding-{{ padding }}" style="text-align: {{ align }}">{{ title.render() | raw }}</h1>
  112.         {% endif %}
  113.         
  114.         {% if pimcore_checkbox('contentEmbed').isChecked() %}
  115.             {{ pimcore_textarea('embedContent', {
  116.                 "htmlspecialchars": false
  117.             }) }}
  118.         {% else %}
  119.             {% if content and not content.isEmpty() %}
  120.                 {{ content.render() | raw }}
  121.             {% endif %}
  122.         {% endif %}
  124.         {% set articleImagesTop = pimcore_block('article-images-top') %}
  125.         {% if articleImagesTop and articleImagesTop.getCount() %}
  126.             <div class="justify-content-center">
  127.                 {% for i in articleImagesTop.iterator %}
  128.                     {% set image = pimcore_image('article-image-top') %}
  129.                     {% if image and image.getImage() %}
  130.                         <div class="col d-flex justify-content-center m-3">
  131.                             {{ image.getImage().getThumbnail('seiko_srticle_top').getHtml() | raw }}
  132.                         </div>
  133.                     {% endif %}
  134.                 {% endfor %}
  135.             </div>
  136.         {% endif %}
  138.         {% if not pimcore_link('dld_apple').isEmpty() and not pimcore_link('dld_google').isEmpty() %}
  140.             <div class="store-button-container">
  141.                 <div class="store-button-wrapper">
  142.                     <div class="store-button">
  143.                         {{ pimcore_link('dld_apple', {
  144.                             'textPrefix': '<img src="/themes/frontend/images/apple-logo.png" alt="">'
  145.                         }) }}
  146.                     </div>
  147.                     <div class="store-button">
  148.                         {{ pimcore_link('dld_google', {
  149.                             'textPrefix': '<img src="/themes/frontend/images/google-play.png" alt="">'
  150.                         }) }}
  151.                     </div>
  152.                 </div>
  153.             </div>
  155.         {% endif %}
  157.         {% if contentFooter and not contentFooter.isEmpty() %}
  158.             {{ contentFooter.render() | raw }}
  159.         {% endif %}
  161.     </div>
  163.     {% set articleImages = pimcore_block('article-images') %}
  165.     {% if articleImages and articleImages.getCount() %}
  166.         <div class="row article-images justify-content-center">
  167.             {% for i in articleImages.iterator %}
  168.                 {% set image = pimcore_image('image') %}
  169.                 {% if image and image.getImage() %}
  170.                     <div class="col d-flex justify-content-center m-3">
  171.                         {% if pimcore_link('link').isEmpty() %}
  172.                             {{ image.getImage().getThumbnail('seiko_article').getHtml() | raw }}
  173.                         {% else %}
  174.                             {{ pimcore_link('link', {
  175.                                 'noText': true,
  176.                                 'textPrefix': image.getImage().getThumbnail('seiko_article').getHtml() | raw
  177.                             }) }}
  178.                         {% endif %}
  179.                     </div>
  180.                 {% endif %}
  181.             {% endfor %}
  182.         </div>
  183.     {% endif %}
  184. {% endif %}