templates/front_v4/mca/landing_page/prospect/index_acq_seo.html.twig line 1

Open in your IDE?
  1. {% extends ('front_v4/base.html.twig') %}
  3. {# cacher la navbar et le footer #}
  4. {% set hideNavbar = true %}
  5. {% set hideFooter = true %}
  7. {% set displayLoadingModal = true %}
  9. {% block meta_title %}Bilan auditif gratuit dans votre ville{% endblock meta_title %}
  10. {% block meta_description %}Réalisez une demande de bilan auditif gratuit et profitez de l'expertise d'un audioprothésiste de proximité pour tester votre audition.{% endblock meta_description %}
  12. {% block stylesheets %}
  13.     {{ encore_entry_link_tags('lp_index_acq_seo') }}
  14. {% endblock stylesheets %}
  15. {% block content %}
  17.     {% include 'front_v4/mca/partials/_navbar.html.twig' with {
  18.         'hideNavigation': true,
  19.         'noLink': true,
  20.         'transparent': true,
  21.         'container': false,
  22.     } %}
  24.     <main class="p-0">
  25.         <div class="row g-0">
  26.             <div class="col-12 col-lg-6 pt-10">
  27.                 <div class="px-5 px-lg-8">
  28.                     {% include 'front_v4/mca/landing_page/form/_wrapper_form_lp_prospect.html.twig' %}
  29.                 </div>
  30.             </div>
  31.             <div class="col-12 col-lg-6 gradient-overlay-half-primary-v1 px-0">
  32.                 <div style="background-image: url({{ asset('build/front_v4/svg/components/wave-pattern-light.svg') }});">
  33.                     <!-- Content -->
  34.                     <div class="pt-10 pt-lg-11">
  35.                         <div class="row g-0 align-items-center justify-content-center px-5 px-lg-8">
  36.                             <div class="d-none d-sm-flex justify-content-left col-12 col-sm-2">
  37.                                 <div class="justify-content-center">
  38.                                     <span class="d-block btn btn-lg btn-icon btn-transparent text-warning rounded-circle mb-4">
  39.                                         <span class="bi bi-award" style="font-size: 3.4rem;"></span>
  40.                                     </span>
  41.                                 </div>
  42.                             </div>
  43.                             <div class="col-12 col-sm-10">
  44.                                 <p class="h3 text-white fw-semibold">Nos <span
  45.                                             class="text-warning">Partenaires Premium</span><span> locaux prendront soin de vous contacter pour convenir d'un RDV proche de chez vous.</span>
  46.                                 </p>
  47.                             </div>
  48.                         </div>
  50.                         <!-- Clients Section (no padding section)-->
  51.                         <div class="my-5">
  52.                             <!-- Swiper -->
  53.                             <div class="hearing-brand-swiper swiper px-0 mx-0">
  54.                                 <div class="swiper-wrapper d-flex align-items-center">
  55.                                     {% for hearingBrand in hearingBrands %}
  56.                                         {% if hearingBrand.presentable and hearingBrand.logoVariationPath != "" %}
  57.                                             <div class="swiper-slide">
  58.                                                 {# Dimension image : 200px x (valeur de la hauteur dépend du logo)px #}
  59.                                                 {#                                    <picture class="avatar avatar-xl avatar-4x3 avatar-centered"> #}
  60.                                                 {#                                        <source srcset="{{ vich_uploader_asset(hearingBrand, 'logoVariationFile') | imagine_filter('brand_logo_carrousel_webp') }}" #}
  61.                                                 {#                                                type="image/webp"> #}
  62.                                                 {#                                        <source srcset="{{ vich_uploader_asset(hearingBrand, 'logoVariationFile') | imagine_filter('brand_logo_carrousel_png') }}" #}
  63.                                                 {#                                                type="image/png"> #}
  64.                                                 <img src="{{ vich_uploader_asset(hearingBrand, 'logoVariationFile') | imagine_filter('brand_logo_carrousel') }}"
  65.                                                      class="avatar avatar-xl avatar-4x3 avatar-centered" width="200"
  66.                                                      height="80"
  67.                                                      alt="Bilan Auditif {{ hearingBrand.name }}">
  68.                                                 {#                                    </picture> #}
  69.                                             </div>
  70.                                         {% endif %}
  71.                                     {% endfor %}
  72.                                 </div>
  73.                             </div>
  74.                             <!-- End Swiper -->
  75.                         </div>
  76.                         <!-- End Clients Section -->
  78.                         <div class="px-5 px-lg-8">
  79.                             <ul class="list-unstyled">
  80.                                 <!-- Info Block -->
  81.                                 <li class="u-indicator-steps py-3">
  82.                                     <div class="media d-flex align-items-center border border-white rounded ps-3 p-2">
  83.                                         <div class="u-indicator-steps__inner me-1 me-lg-3">
  84.                                             <span class="display-4 text-warning ">1.</span>
  85.                                         </div>
  86.                                         <div class="media-body">
  87.                                             <p class="h3 mb-0 text-white">Je complète le formulaire</p>
  88.                                         </div>
  89.                                     </div>
  90.                                 </li>
  91.                                 <!-- End Info Block -->
  93.                                 <!-- Info Block -->
  94.                                 <li class="u-indicator-steps py-3">
  95.                                     <div class="media d-flex align-items-center border border-white rounded ps-3 p-2">
  96.                                         <div class="u-indicator-steps__inner me-1 me-lg-3">
  97.                                             <span class="display-4 text-warning ">2.</span>
  98.                                         </div>
  99.                                         <div class="media-body">
  100.                                             <p class="h3 mb-0 text-white">Un audioprothésiste local me contacte</p>
  101.                                         </div>
  102.                                     </div>
  103.                                 </li>
  104.                                 <!-- End Info Block -->
  106.                                 <!-- Info Block -->
  107.                                 <li class="u-indicator-steps py-3">
  108.                                     <div class="media d-flex align-items-center border border-white rounded ps-3 p-2">
  109.                                         <div class="u-indicator-steps__inner me-1 me-lg-3">
  110.                                             <span class="display-4 text-warning ">3.</span>
  111.                                         </div>
  112.                                         <div class="media-body">
  113.                                             <p class="h3 mb-0 text-white">Je réalise mon bilan auditif<sup>(1)</sup> gratuit
  114.                                             </p>
  115.                                         </div>
  116.                                     </div>
  117.                                 </li>
  118.                                 <!-- End Info Block -->
  120.                                 <!-- Info Block -->
  121.                                 <li class="u-indicator-steps py-3">
  122.                                     <div class="media d-flex align-items-center border border-white rounded ps-3 p-2">
  123.                                         <div class="u-indicator-steps__inner me-1 me-lg-3">
  124.                                             <span class="display-4 text-warning ">4.</span>
  125.                                         </div>
  126.                                         <div class="media-body">
  127.                                             <p class="h3 mb-0 text-white">J'obtiens une analyse complète</p>
  128.                                         </div>
  129.                                     </div>
  130.                                 </li>
  131.                                 <!-- End Info Block -->
  132.                             </ul>
  133.                         </div>
  134.                     </div>
  135.                     <!-- End Content -->
  136.                 </div>
  137.             </div>
  138.         </div>
  139.     </main>
  140.     <!-- End Content -->
  142.     <!-- Section Problèmes Auditifs -->
  143.     <div class="container-fluid content-space-1">
  144.         <div class="row justify-content-lg-center align-items-lg-center">
  145.             <div class="d-none d-lg-flex col-lg-6 justify-content-center">
  146.                 <img class="img-fluid rounded-2 min-width-15" style="max-width: 500px;"
  147.                      src="{{ asset('build/landing-page/lp-index-seo/depistage.jpg') | imagine_filter('lp_img_content') }}"
  148.                      alt="Image Description">
  150.                 {#                <!-- SVG Shape --> #}
  151.                 {#                <div class="position-absolute top-0 start-0 zi-n1 mt-n6 ms-n7" style="width: 10rem;"> #}
  152.                 {#                    <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 335.2 335.2" width="100" #}
  153.                 {#                         height="100"> #}
  154.                 {#                        <circle fill="#FFC107" opacity=".7" cx="167.6" cy="167.6" r="130.1"/> #}
  155.                 {#                    </svg> #}
  156.                 {#                </div> #}
  157.                 {#                <!-- End SVG Shape --> #}
  159.                 {#                <!-- SVG Shape --> #}
  160.                 {#                <div class="position-absolute bottom-0 end-0 zi-n1 mb-n6 me-n10" style="width: 10rem;"> #}
  161.                 {#                    <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 335.2 335.2" width="120" #}
  162.                 {#                         height="120"> #}
  163.                 {#                        <circle fill="none" stroke="#377dff" stroke-width="75" cx="167.6" cy="167.6" r="130.1"/> #}
  164.                 {#                    </svg> #}
  165.                 {#                </div> #}
  166.                 {#                <!-- End SVG Shape --> #}
  167.             </div>
  169.             <div class="col-12 col-lg-6">
  170.                 <div class="mb-4">
  171.                     <h2 class="h3 text-primary uppercase fw-bold mb-3">Vous percevez des difficultés pour
  172.                         entendre,
  173.                         même légères ?</h2>
  174.                     <h3 class="h4 text-warning uppercase fw-semibold">N’attendez-plus et venez rencontrer nos
  175.                         audioprothésistes partenaires.</h3>
  176.                 </div>
  177.                 <p>
  178.                     Ils vous proposeront un <strong>dépistage auditif gratuit</strong> pour détecter l’origine et le
  179.                     degré
  180.                     de la surdité. Les laboratoires auditifs partenaires du site <strong>Mon-centre-auditif.com</strong>
  181.                     sont partout en France. Il y en a forcément un près de chez vous.<br><br>
  183.                     Les <strong>troubles de l’audition</strong> concernent en France plus de 4 millions de personnes. Il
  184.                     existe plusieurs phénomènes qui sont à la source d’une perte auditive partielle ou sévère comme les
  185.                     acouphènes ou la presbyacousie. Il est donc important de dépister régulièrement ces problèmes avant
  186.                     qu’ils ne deviennent trop impactant pour votre vie quotidienne.<br>
  187.                     <strong>Le Bilan auditif chez un audioprothésiste est donc utile pour faire le point sur votre
  188.                         audition
  189.                         et détecter d’éventuels symptômes</strong>.<br><br>
  191.                     En cas de perte auditive légère ou importante, le port d’un <strong>appareil auditif</strong> peut
  192.                     être
  193.                     la solution. Un RDV chez un ORL permettra de confirmer le diagnostic de l’audioprothésiste et de
  194.                     vous
  195.                     procurer une prescription utile à votre équipement.
  196.                 </p>
  197.             </div>
  198.         </div>
  199.     </div>
  200.     <!-- End Section Problèmes Auditifs -->
  201.     <!-- CTA -->
  202.     <div class="container text-center content-space-lg-1">
  203.         <div class="w-100 text-center mx-auto mb-4">
  204.             <h4 class="h2 ">Effectuez une demande de bilan
  205.                 auditif<sup>(1)</sup> gratuit
  206.             </h4>
  207.         </div>
  208.         <div class="mb-1 mb-lg-6">
  209.             <a class="btn btn-primary" href="#">
  210.                 Faire ma demande de bilan
  211.             </a>
  212.         </div>
  213.     </div>
  214.     <!-- End CTA -->
  216.     {% include 'front_v4/mca/partials/_footer_minimal.html.twig' %}
  217. {% endblock content %}
  219. {% block javascripts %}
  220.     <script
  221.             src="https://code.jquery.com/jquery-3.7.1.min.js"
  222.             integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo="
  223.             crossorigin="anonymous"></script>
  224.     {{ encore_entry_script_tags('lp_index_acq_seo') }}
  226.     {# validation & format prospect form #}
  227.     <script src="{{ asset('build/format_form_prospect.js') }}"></script>
  229. {% endblock javascripts %}