templates/blog_article/show.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}{{ setting.siteName }} : Article - {{ article.title }}{% endblock %}
  5. {% block body %}
  7. <section class="container py-5">
  9.     <div class="row">
  10.         <div class="col">
  11.             {# Breadcrumbs #}
  12.             <div class="row">
  13.                 <div class="col small">
  14.                     <nav style="--bs-breadcrumb-divider: url(&#34;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill='%236c757d'/%3E%3C/svg%3E&#34;);"
  15.                         aria-label="breadcrumb">
  16.                         <ol class="breadcrumb small">
  17.                             <li class="breadcrumb-item"><a href="{{ path('app_home') }}"
  18.                                     class="text-decoration-none text-dark">Accueil</a></li>
  19.                             <li class="breadcrumb-item" aria-current="page"><a
  20.                                     href="{{ path('app_blog_article_index') }}"
  21.                                     class="text-decoration-none text-dark">Blog</a></li>
  22.                             <li class="breadcrumb-item active" aria-current="page">{{ article.title }}</li>
  23.                         </ol>
  24.                     </nav>
  25.                 </div>
  26.             </div>
  27.         </div>
  28.     </div>
  30.     <h1 class="text-center mb-2 color1 fw-700 text-uppercase" data-aos="fade-down" data-aos-duration="3000">Blog</h1>
  31.     <div class="row mt-3">
  32.         <div class="col newsletter">
  33.             <img src="{{ asset('assets/img/articles/' ~ article.image ) }}" data-aos="fade-up" data-aos-duration="1500"
  34.                 class="img-fluid shadow" style="max-height: 300px; width: 100%; object-fit: cover;"
  35.                 alt="{{ article.title }}">
  36.             <h3 class="text-center mb-2 color1 fw-700 text-uppercase mt-5">{{ article.title }}</h3>
  37.             <p class="text-xsmall color1 text-center">
  38.                 Posté le {{ article.createdAt|date('d-m-Y') }},
  39.                 {% if article.updatedAt != null %}
  40.                     modifié le {{ article.createdAt|date('d-m-Y') }},
  41.                 {% endif %}
  42.                 <br>dans la catégorie <a href="{{ path('app_blog_category_show', {'slug': article.category.slug}) }}"
  43.                     class="text-decoration-none color2">{{ article.category.title }}</a>
  44.             </p>
  45.             <div class="text-xsmall mt-5">
  46.                 {{ article.content|replace({'<div>': '', '</div>': '',})|raw }}
  47.             </div>
  48.             {% if article.video != null %}
  49.                 <p class="text-xsmall">
  50.                     Découvrir la vidéo : <a href="{{ article.video }}" class="text-decoration-none color1 text-xsmall"
  51.                         target="_blank">{{ article.video }}</a>
  52.                 </p>
  53.             {% endif %}
  55.             <!-- Button trigger modal -->
  56.             <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
  57.                 S'inscrire à la Newsletter
  58.             </button>
  60.             <!-- Modal -->
  61.             <div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
  62.                 aria-labelledby="staticBackdropLabel" aria-hidden="true">
  63.                 <div class="modal-dialog">
  64.                     <div class="modal-content">
  65.                         <div class="modal-header h4">Inscription à la Newsletter</h1>
  66.                             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  67.                         </div>
  68.                         <div class="modal-body" style="padding-top: 0 !important;">
  69.                             {{ form_start(form) }}
  70.                                 <div class="my-custom-class-for-errors py-3">
  71.                                     {{ form_errors(form) }}
  72.                                 </div>
  73.                                 {{ form_row(form.email) }}
  75.                                 <p class="small">
  76.                                     Veuillez recopier le code anti-spam :
  77.                                     {{ form_row(form.captcha) }}
  78.                                 </p>
  79.                                 <p class="text-xxsmall mb-4">
  80.                                     &#9989; Oui, je souhaite m’abonner à la newsletter de {{ setting.siteName }}.<br>
  81.                                     Je peux me désinscrire à tout moment de la newsletter en suivant le lien adéquat dans la newsletter.
  82.                                 </p>
  84.                                 {{ form_row(form.submit) }}
  85.                             {{ form_end(form) }}
  86.                         </div>
  87.                     </div>
  88.                 </div>
  89.             </div>
  91.         </div>
  92.     </div>
  94.     <div class="row mt-5 pt-3 border-top border-bottom">
  95.         <div class="col text-center">
  96.             <p class="text-xsmall color2">
  97.                 <span class="fw-bold">Partager l'article</span>
  98.                 <div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/"
  99.                     data-layout="button" data-size="small">
  100.                     <a target="_blank"
  101.                         href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&amp;src=sdkpreparse"
  102.                         class="fb-xfbml-parse-ignore">Partager</a>
  103.                 </div>
  104.             </p>
  105.         </div>
  106.     </div>
  108.     <div class="row mt-5">
  109.         <div class="col text-center">
  110.             <a class="btn btn-sm btn-primary" href="{{ path('app_blog_article_index') }}">Retour à la page du Blog</a>
  111.         </div>
  112.     </div>
  114. </section>
  116. <div id="fb-root"></div>
  117. <script async defer crossorigin="anonymous" src="https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v15.0"
  118.     nonce="sYowubn8"></script>
  120. {% endblock %}