custom/plugins/AcrisFaqCS/src/Resources/views/storefront/component/faq/acris-faq.html.twig line 1

Open in your IDE?
  1. {% block acris_faq_wrapper %}
  3.     {% set cover = faqs.media %}
  4.     {% set imagePosition = faqs.imagePosition %}
  5.     {% if imagePosition == '' %}{% set imagePosition = 'right' %}{% endif %}
  6.     {% set videoPosition = faqs.videoPosition %}
  7.     {% if videoPosition == '' %}{% set videoPosition = 'right' %}{% endif %}
  8.     {% set imageUrlType = faqs.imageUrlType %}
  9.     {% set imageUrlEntity = faqs.imageUrlEntity %}
  10.     {% set imageUrl = null %}
  12.     {% if imageUrlType is same as 'internal' and imageUrlEntity is same as 'product' %}
  13.         {% set imageUrl = seoUrl('frontend.detail.page', {'productId': faqs.imageInternalLink}) %}
  14.     {% elseif imageUrlType is same as 'internal' and imageUrlEntity is same as 'category' %}
  15.         {% set imageUrl = seoUrl('frontend.navigation.page', { navigationId: faqs.imageInternalLink }) %}
  16.     {% elseif imageUrlType is same as 'internal' and imageUrlEntity is same as 'landing_page' %}
  17.         {% set imageUrl = path('frontend.cms.page', { id: faqs.imageInternalLink }) %}
  18.     {% elseif imageUrlType is same as 'external' %}
  19.         {% if faqs.translated.imageUrl %}
  20.             {% set imageUrl = faqs.translated.imageUrl %}
  21.         {% endif %}
  22.     {% endif %}
  24.     {% set imageUrlTarget = faqs.imageUrlTarget %}
  25.     {% set videoUrl = faqs.translated.embedCode %}
  26.     {% if faqSingle %}{% set id = (faqs.id ~ '-single') %}{% else %}{% set id = faqs.id %}{% endif %}
  27.     {% set faqDocument = faqs.acrisFaqDocuments.elements %}
  29.     {% set imageSizes = {} %}
  30.     {% if faqs.imageSize == 'small' %}
  31.         {% set imageSizes = {
  32.             'default': '120px'
  33.         } %}
  34.     {% elseif faqs.imageSize == 'medium' %}
  35.         {% set imageSizes = {
  36.             'default': '280px'
  37.         } %}
  38.     {% elseif faqs.imageSize == 'large' %}
  39.         {% set imageSizes = {
  40.             'default': '400px'
  41.         } %}
  42.     {% else %}
  43.         {% set imageSizes = {
  44.             'default': '95px'
  45.         } %}
  46.     {% endif %}
  48.     {% set iconStyle = config('AcrisFaqCS.config.iconType') == null ? 'plus' : config('AcrisFaqCS.config.iconType') %}
  49.     {% set iconPosition = config('AcrisFaqCS.config.iconPosition') == null ? 'right' : config('AcrisFaqCS.config.iconPosition') %}
  51.     {% set questionBgColor = config('AcrisFaqCS.config.questionBgColor') == null ? 'primary' : config('AcrisFaqCS.config.questionBgColor') %}
  53.     {% set customTitleBgColor = config('AcrisFaqCS.config.customTitleBgColor') == null ? null : config('AcrisFaqCS.config.customTitleBgColor') %}
  54.     {% set customTitleColor = config('AcrisFaqCS.config.customTitleColor') == null ? null : config('AcrisFaqCS.config.customTitleColor') %}
  56.     {% set answerBgColor = config('AcrisFaqCS.config.answerBgColor') == null ? null : config('AcrisFaqCS.config.answerBgColor') %}
  58.     {% if customTitleBgColor is empty %}
  59.         {% set questionBgColor = 'primary' %}
  60.     {% endif %}
  62.     <style>
  63.         {% if questionBgColor is same as 'custom'  %}
  64.         .acris-faq-accordion-wrapper#faq_group_{{ id }} .acris-faq-accordion-header {
  65.             background-color: {{ customTitleBgColor }};
  66.         }
  68.         {% endif %}
  70.         {% if customTitleColor != '' and customTitleColor is not null  %}
  71.         .acris-faq-accordion-wrapper#faq_group_{{ id }} .acris-faq-accordion-header {
  72.             color: {{ customTitleColor }};
  73.         }
  75.         .acris-faq-accordion-wrapper#faq_group_{{ id }} .acris-faq-accordion-header span {
  76.             color: {{ customTitleColor }};
  77.         }
  79.         {% endif %}
  81.         {% if answerBgColor != '' and answerBgColor is not null %}
  82.         .acris-faq-accordion-wrapper#faq_group_{{ id }} .acris-faq-accordion-content .card {
  83.             background-color: {{ answerBgColor }};
  84.         }
  86.         {% endif %}
  88.     </style>
  90.     {% block acris_faq_container %}
  91.         <div class="acris-faq-accordion-wrapper" data-acris-faq="true" id="faq_group_{{ id }}" itemscope
  92.              itemprop="mainEntity" itemtype="https://schema.org/Question">
  94.             {% block acris_faq_content_question %}
  95.                 <a class="acris-faq-accordion-header {% if detailPage != true or not faqs.collapsed == 'notCollapsed' %}collapsed{% endif %} btn{% if questionBgColor is not same as 'custom' %} btn-{{ questionBgColor }}{% endif %}{% if iconPosition is same as 'left' %} question-right{% endif %}"
  96.                    href="{{ path('frontend.faq.detail', {'faqId': id}) }}"
  97.                    role="button"
  98.                    target="_blank"
  99.                    rel="noopener"
  100.                    data-toggle="collapse" data-target="#faq-{{ id }}"
  101.                     {% if faqs.collapsed == 'notCollapsed' %} aria-expanded="true" {% else %} aria-expanded="false" {% endif %}
  102.                    aria-controls="faq-{{ id }}">
  103.                     {% if iconPosition is same as 'left' %}
  104.                         {% if iconStyle is same as 'plus' %}{% sw_icon 'plus' %}{% else %}{% sw_icon 'arrow-head-down' %}{% endif %}
  105.                     {% endif %}
  106.                     <div class="acris-faq-text text-left" itemprop="name">{{ faqs.translated.name }}</div>
  107.                     {% if iconPosition is same as 'right' %}
  108.                         {% if iconStyle is same as 'plus' %}{% sw_icon 'plus' %}{% else %}{% sw_icon 'arrow-head-down' %}{% endif %}
  109.                     {% endif %}
  110.                 </a>
  111.             {% endblock %}
  113.             {% block acris_faq_content_answer %}
  114.                 <div class="acris-faq-accordion-content">
  115.                     <div class="row">
  116.                         <div class="col-12">
  117.                             <div
  118.                                 class="collapse{% if detailPage == true or faqs.collapsed == 'notCollapsed' %} show{% endif %}"
  119.                                 id="faq-{{ id }}">
  120.                                 <div
  121.                                     class="card card-body faq-wrapper-answer{% if answerBgColor is empty %} faq-wrapper-answer-background{% endif %}{% if not faqs.translated.description %} no-text {% endif %}{% if videoUrl == null %} no-video {% elseif not faqs.translated.description %} faq-video {% else %} video-position-{{ videoPosition }}{% endif %} video-wrapper {% if faqs.mediaId == null %} no-image{% else %} image-position-{{ imagePosition }}{% endif %}"
  122.                                     itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer">
  124.                                     {% if faqs.layout == 'cms' and faqs.cmsPageId != null %}
  125.                                         <div itemprop="text" hidden>
  126.                                             <p>{{ faqs.translated.description|raw }}</p>
  127.                                         </div>
  128.                                         {% sw_include '@Storefront/storefront/page/content/detail.html.twig' with { cmsPage: faqs.cmsPage } %}
  129.                                     {% else %}
  131.                                         {% if videoUrl %}
  132.                                             {% sw_include '@Storefront/storefront/component/faq/video/acris-faq-video.html.twig' %}
  133.                                         {% endif %}
  135.                                         {% if faqs.translated.description %}
  136.                                             {% block acris_faq_content_answer_description %}
  137.                                                 <div class="faq-text" itemprop="text">
  138.                                                     <p>{{ faqs.translated.description|raw }}</p>
  139.                                                 </div>
  140.                                             {% endblock %}
  141.                                         {% endif %}
  143.                                         {% if cover.url %}
  144.                                             {% block acris_faq_content_answer_image %}
  145.                                                 {% if cover.thumbnails.elements|length > 0 %}
  146.                                                     {% set image = cover.thumbnails|sort|first().url %}
  147.                                                 {% else %}
  148.                                                     {% set image = cover.url %}
  149.                                                 {% endif %}
  150.                                                 {% if imagePosition == 'left' or imagePosition == 'right' %}
  151.                                                     <div
  152.                                                         class="faq-image image-position-{{ imagePosition }}">
  153.                                                         <a {% if imageUrl %}href="{{ imageUrl }}" {% endif %}
  154.                                                            rel="noopener"
  155.                                                            target="{{ imageUrlTarget }}">
  156.                                                             {% sw_thumbnails 'cart-item-img-thumbnails' with {
  157.                                                                 media: cover,
  158.                                                                 sizes: imageSizes,
  159.                                                                 attributes: {
  160.                                                                     'class': 'img-fluid',
  161.                                                                     'alt': (faqs.translated.internalName ?: ''),
  162.                                                                     'title': (entity.media.translated.title ?: '')
  163.                                                                 }
  164.                                                             } %}
  165.                                                         </a>
  166.                                                     </div>
  167.                                                 {% else %}
  168.                                                     <div class="faq-image-{{ imagePosition }}">
  169.                                                         <a href="{{ imageUrl }}"
  170.                                                            rel="noopener"
  171.                                                            target="{{ imageUrlTarget }}">
  172.                                                             {% sw_thumbnails 'cart-item-img-thumbnails' with {
  173.                                                                 media: cover,
  174.                                                                 sizes: imageSizes,
  175.                                                                 attributes: {
  176.                                                                     'class': 'img-fluid',
  177.                                                                     'alt': (faqs.translated.internalName ?: ''),
  178.                                                                     'title': (entity.media.translated.title ?: '')
  179.                                                                 }
  180.                                                             } %}
  181.                                                         </a>
  182.                                                     </div>
  183.                                                 {% endif %}
  184.                                             {% endblock %}
  185.                                         {% endif %}
  187.                                         {% if faqDocument|length > 0 %}
  188.                                             {% block acris_faq_content_answer_document %}
  189.                                                 <div class="faq-document">
  190.                                                     <div class="h5">{{ 'acris-faq.detail.documentTitle'|trans }}</div>
  191.                                                     <ul>
  192.                                                         {% for item in faqDocument %}
  193.                                                             <li><a download
  194.                                                                    target="_blank"
  195.                                                                    rel="noopener"
  196.                                                                    href="{{ item.media.url }}"
  197.                                                                 >{% if item.translated.title %}{{ item.translated.title }}{% else %}{{ item.media.fileName }}.{{ item.media.fileExtension }}{% endif %}</a>
  198.                                                                 {% if item.translated.description %} - {{ item.translated.description }}{% endif %}
  199.                                                             </li>
  200.                                                         {% endfor %}
  201.                                                     </ul>
  202.                                                 </div>
  203.                                             {% endblock %}
  204.                                         {% endif %}
  205.                                     {% endif %}
  206.                                 </div>
  207.                             </div>
  208.                         </div>
  209.                     </div>
  210.                 </div>
  211.             {% endblock %}
  212.         </div>
  213.     {% endblock %}
  214. {% endblock %}