custom/plugins/SasBlogModule/src/Resources/views/storefront/component/blog/card/box.html.twig line 1

Open in your IDE?
  1. {% block sas_blog_card %}
  2.     {% set articleUrl = seoUrl('sas.frontend.blog.detail', {'articleId': article.id}) %}
  3.     {% set articleAuthorName = '' %}
  5.     {% if article.blogAuthor %}
  6.         {% set articleAuthorName = article.blogAuthor.displayName ?: article.blogAuthor.translated.name %}
  7.     {% endif %}
  9.     <article class="card blog-card"
  10.              itemprop="item"
  11.              itemscope
  12.              itemtype="https://schema.org/BlogPosting">
  13.         <meta itemprop="mainEntityOfPage" content="{{ articleUrl }}">
  14.         <meta itemprop="url" content="{{ articleUrl }}">
  15.         <meta itemprop="datePublished" content="{{ article.publishedAt|date('c') }}">
  16.         {% if article.translated.teaser %}
  17.             <meta itemprop="description" content="{{ article.translated.teaser|striptags|trim }}">
  18.         {% endif %}
  19.         {% if articleAuthorName %}
  20.             <span class="d-none" itemprop="author" itemscope itemtype="https://schema.org/Person">
  21.                 <meta itemprop="name" content="{{ articleAuthorName }}">
  22.             </span>
  23.         {% endif %}
  25.         {% block sas_blog_card_teaser_image %}
  26.             <a href="{{ articleUrl }}"
  27.                     title="{{ article.translated.title }}"
  28.                     class="blog-image-link">
  29.                      {% if article.media.url %}
  30.                          {% set attributes = {
  31.                              'class': 'blog-image card-img-top',
  32.                              'alt': (article.media.translated.alt ?: article.media.fileName),
  33.                              'title': (article.media.translated.title ?: article.media.fileName),
  34.                              'itemprop': 'image'
  35.                          } %}
  37.                          {% sw_thumbnails 'blog-image-thumbnails' with {
  38.                              media: article.media,
  39.                              sizes: {
  40.                                 'xs': '330px',
  41.                                 'sm': '650px',
  42.                                  'md': '650px',
  43.                                  'lg': '650px',
  44.                                  'xl': '900px',
  45.                              },
  46.                              attributes: attributes
  47.                          } %}
  48.                      {% else %}
  49.                          <div class="blog-image-placeholder">
  50.                              {% sw_icon 'placeholder' style {
  51.                                  'size': 'fluid'
  52.                             } %}
  53.                         </div>
  54.                     {% endif %}
  55.                 </a>
  56.         {% endblock %}
  57.         {% block sas_blog_card_body %}
  58.             <div class="card-body">
  59.                 <div class="d-flex flex-column">
  60.                     {% block sas_blog_card_title_date %}
  61.                         <p class="mt-2 mb-1 d-flex align-items-center blog-date">
  62.                             <small>
  63.                                 <time datetime="{{ article.publishedAt|date('c') }}">{{ article.publishedAt|format_date('short', locale=app.request.locale) }}</time>
  64.                             </small>
  65.                         </p>
  66.                     {% endblock %}
  67.                     {% block sas_blog_card_title %}
  68.                         <h2 class="card-title mt-0" itemprop="headline">
  69.                             {% block sas_blog_card_title_link %}
  70.                                 <a href="{{ articleUrl }}"
  71.                                     title="{{ article.translated.title }}"
  72.                                     class="text-decoration-none">
  73.                                      {{ article.translated.title }}
  74.                                  </a>
  75.                             {% endblock %}
  76.                         </h2>
  77.                     {% endblock %}
  78.                 </div>
  79.                 {% block sas_blog_card_teaser %}
  80.                     <p class="card-text font-size-small mb-0" itemprop="description">{{ article.translated.teaser }}</p>
  81.                 {% endblock %}
  82.             </div>
  83.         {% endblock %}
  85.         {% block sas_blog_card_footer %}
  86.         <div class="card-footer text-muted">
  87.             {% block sas_blog_card_footer_author %}
  88.                 {% if config('SasBlogModule').config.showAuthor %}
  89.                     {% if article.blogAuthor.media.url %}
  90.                         {% set attributes = {
  91.                             'class': 'blog-author-avatar',
  92.                             'alt': (article.blogAuthor.media.translated.alt ?: article.blogAuthor.media.fileName),
  93.                             'title': (article.blogAuthor.media.translated.title ?: article.blogAuthor.media.fileName)
  94.                         } %}
  96.                         {% sw_thumbnails 'blog-author-avatar-thumbnails' with {
  97.                             media: article.blogAuthor.media,
  98.                             sizes: {
  99.                             'xs': '80px'
  100.                         }
  101.                             } %}
  102.                     {% else %}
  103.                         <div class="blog-image-placeholder">
  104.                             {% sw_icon 'placeholder' style {
  105.                                 'size': 'fluid'
  106.                                 } %}
  107.                         </div>
  108.                     {% endif %}
  109.                     <p class="blog-author-display-name">{{ article.blogAuthor.displayName }}<br>
  110.                         <small class="text-muted">{{ article.blogAuthor.blogEntries|length }} {{ 'sas-blog.box.author.countEntries'|trans|sw_sanitize }}</small>
  111.                     </p>
  112.                 {% endif %}
  113.             {% endblock %}
  114.         </div>
  115.         {% endblock %}
  116.     </article>
  117. {% endblock %}