migrating acf blocks from theme to plugin

This commit is contained in:
Antoine M 2023-12-20 10:04:11 +01:00
parent 691444fa51
commit 6d1e5a2558
13 changed files with 529 additions and 0 deletions

View File

@ -0,0 +1,55 @@
<?php
$subtitle = get_field('subtitle');
$renolution_datas = get_field('renolution_datas');
?>
<section id="block-aides-financieres" class="card-large-content-container">
<div class="section_titling">
<h2 class="section_titling__title"><?php echo __("Aides financières", 'homegrade-theme__texte-fonctionnel') ?></h2>
<p class="section_titling__subtitle"><?php echo $subtitle ?></p>
</div>
<div class="card-large-content">
<div class="card-large-content__renolution-details">
<div class="renolution__logo">
<img src='<?php echo get_template_directory_uri() ?>/resources/img/logos/logo-renolution-monochrome.svg' alt=''>
</div>
<h3 class="renolution__title"><?php echo $renolution_datas['title'] ?></h3>
<p><?php echo $renolution_datas['description'] ?></p>
<a class="cta cta--primary cta--button" href="<?php echo $renolution_datas['button']['url'] ?>" target="<?php echo $renolution_datas['button']['target'] ?>"><?php echo $renolution_datas['button']['title'] ?></a>
<div class="renolution__guide-external-links">
<div class="introduire-demande">
<img src='<?php echo get_template_directory_uri() ?>/resources/img/pictogrammes/pictogramme-demande.svg' alt=''>
<h4 class="question_title"><?php echo $renolution_datas['demande_title'] ?></h4>
<p class="question_explanation"><?php echo $renolution_datas['demande_description'] ?></p>
<a class="question_url" href="<?php echo $renolution_datas['demande_lien']['url'] ?>" target="<?php echo $renolution_datas['demande_lien']['target'] ?>">
<?php echo $renolution_datas['demande_lien']['title'] ?>
<img class="icon" src='<?php echo get_template_directory_uri() ?>/resources/img/graphic-assets/icone-external-link.svg' alt=''>
</a>
</div>
<div class=" estimation-prime">
<img src='<?php echo get_template_directory_uri() ?>/resources/img/pictogrammes/pictogramme-formulaire.svg' alt=''>
<h4 class="question_title"><?php echo $renolution_datas['prime_title'] ?></h4>
<p class="question_explanation"><?php echo $renolution_datas['prime_description'] ?></p>
<a class="question_url" href="<?php echo $renolution_datas['prime_lien']['url'] ?>" target="<?php echo $renolution_datas['prime_lien']['target'] ?>">
<?php echo $renolution_datas['prime_lien']['title'] ?>
<img class="icon" src='<?php echo get_template_directory_uri() ?>/resources/img/graphic-assets/icone-external-link.svg' alt=''>
</a>
</div>
</div>
</div>
<img class="card-large-content__renolution-illustration-picture" src='<?php echo get_template_directory_uri() ?>/resources/img/illustrations/illustration-aides-financieres-homepage.svg' alt=''>
</div>
</section>

View File

@ -0,0 +1,20 @@
{
"name": "acf/aides-financieres",
"title": "Aides Financières",
"category": "homegrade-page-home",
"multiple": false,
"icon": {
"foreground": "#DF1E1E",
"src": "schedule"
},
"keywords": [
"aides financières",
"aide",
"Financières",
"Renolution"
],
"acf": {
"mode": "auto",
"renderTemplate": "aides-financieres.php"
}
}

View File

@ -0,0 +1,27 @@
{
"name": "acf/demarches-administratives",
"title": "Démarches Administratives",
"category": "homegrade-page-home",
"multiple": false,
"icon": {
"foreground": "#DF1E1E",
"src": "schedule"
},
"keywords": [
"Couverture",
"home",
"Accueil",
"Section d'accueil",
"Header"
],
"supports": {
"align": [
"full"
]
},
"acf": {
"mode": "auto",
"renderTemplate": "demarches-administratives.php"
},
"align": "full"
}

View File

@ -0,0 +1,45 @@
<?php
$block_titling = get_field('block_titling_description_datas');
$demarches_administratives_links = get_field('demarches_administratives_links');
// echo '<pre>';
// print_r($demarches_administratives_links);
// echo '</pre>';
?>
<section id="block-demarches-administratives" class="card-large-content-container card-large-content-container--has-illustration">
<div class="card-large-content card-large-content--has-illustration">
<img class="card-large-content__top-illustration" src='<?php echo get_template_directory_uri() ?>/resources/img/illustrations/illustration-que-fait-homegrade-pour-vous.svg' alt=''>
<div class="section_titling">
<h2 class="section_titling__title"><?php echo $block_titling['title'] ?></h2>
<p class="section_titling__subtitle"><?php echo $block_titling['subtitle'] ?></p>
<p class="section_titling__description"><?php echo $block_titling['description'] ?></p>
</div>
<div class="card-large-content__links-container">
<?php foreach ($demarches_administratives_links as $link_datas) : ?>
<?php
$linked_page = $link_datas['linked_page'];
$page_icon = get_field('page_icon', $linked_page->ID);
?>
<div class="card-large-content__link">
<?php
// echo '<pre>';
// print_r($link);
// print_r($linked_page);
// print_r($page_icon);
// echo '</pre>';
?>
<img class="card-large-content__link__page_icon" src="<?php echo $page_icon['url'] ?>" alt="">
<h3 class="card-large-content__link__title"><?php echo $linked_page->post_title ?></h3>
<p class="card-large-content__link__excerpt"><?php echo $linked_page->post_excerpt ?></p>
<a class="cta cta--button cta--shadowed" href="<?php echo get_permalink($linked_page->ID) ?>"><?php echo $link_datas['button_text'] ?></a>
</div>
<?php endforeach; ?>
</div>
</div>
</section>

View File

@ -0,0 +1,27 @@
{
"name": "acf/home-header",
"title": "Section d'accueil",
"category": "homegrade-page-home",
"multiple": false,
"icon": {
"foreground": "#DF1E1E",
"src": "schedule"
},
"keywords": [
"Couverture",
"home",
"Accueil",
"Section d'accueil",
"Header"
],
"supports": {
"align": [
"full"
]
},
"acf": {
"mode": "auto",
"renderTemplate": "home-header.php"
},
"align": "full"
}

View File

@ -0,0 +1,20 @@
<?php
$home_header = get_field('home_header_datas');
?>
<section class="home-header header_top">
<div class="home-header__titling">
<h1 class="home-header__title">
<?php echo $home_header['title'] ?>
</h1>
<p><?php echo $home_header['description'] ?></p>
<a class="home-header__scroll-down-indicator" href="#section-show-thematiques">
<img class="home-header__scroll-down-indicator__arrow" src='<?php echo get_template_directory_uri() ?>/resources/img/graphic-assets/arrow-down-white.svg' alt=''>
</a>
</div>
<div class="home-header__fresque">
<img src="<?php echo get_template_directory_uri() . '/resources/img/illustrations/illustration-accueil-thematiques.jpg' ?>" alt="">
</div>
</section>

View File

@ -0,0 +1,20 @@
{
"name": "acf/latest-news",
"title": "Dernières News",
"category": "homegrade-page-home",
"multiple": false,
"icon": {
"foreground": "#DF1E1E",
"src": "welcome-widgets-menus"
},
"keywords": [
"News",
"dernières",
"actus",
"latest"
],
"acf": {
"mode": "auto",
"renderTemplate": "latest-news.php"
}
}

View File

@ -0,0 +1,65 @@
<?php
$block_titling_datas = get_field('block_titling_datas');
?>
<section class="section_latest_news">
<div class="section_titling">
<h2 class="section_titling__title"><?php echo $block_titling_datas['title'] ?></h2>
<p class="section_titling__subtitle"><?php echo $block_titling_datas['subtitle'] ?></p>
</div>
<div class="articles_container">
<?php
$args = array(
'posts_per_page' => 4,
'post_type' => 'post',
'orderby' => 'post_date',
'order' => 'DESC',
'post_status' => 'publish' // Show only the published posts
);
$recentNewsPosts = new WP_Query($args);
// echo '<pre>';
// print_r($recentNewsPosts);
// echo '</pre>';
?>
<?php if ($recentNewsPosts->have_posts()) : while ($recentNewsPosts->have_posts()) : $recentNewsPosts->the_post(); ?>
<?php
global $post;
$post_thumbnail = get_the_post_thumbnail($post->ID, 'full', array('class' => 'card-news__thumbnail'));
$news_type = get_the_terms($post->ID, "news_type") ?? null;
$post_date = get_the_date('j.m.Y', $post->ID) ?? null;
get_template_part(
'template-components/cards/card-news',
null,
array(
'card_variant' => 'activite',
'post_ID' => $post->ID,
'post_title' => get_the_title(),
'post_thumbnail' => $post_thumbnail,
'news_type' => $news_type,
'post_date' => $post_date,
)
);
?>
<?php endwhile ?>
<?php endif ?>
</div>
<?php
$args = array(
'meta_key' => '_wp_page_template',
'meta_value' => "template-archive-news.php"
);
$relatedPageTemplatePage = get_pages($args) ? get_pages($args)[0] : null;
?>
<a id="see-all-news" class="cta cta--button cta--outline cta--button cta--centered cta--see-all" href="<?php echo get_the_permalink($relatedPageTemplatePage) ?>">
<?php echo __("Lire les autres articles", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?>
</a>
</section>

View File

@ -0,0 +1,17 @@
{
"name": "acf/questions-frequentes",
"title": "Questions Fréquentes",
"category": "homegrade-page-home",
"multiple": false,
"icon": {
"foreground": "#DF1E1E",
"src": "schedule"
},
"keywords": [
"Questions Fréquentes"
],
"acf": {
"mode": "auto",
"renderTemplate": "questions-frequentes.php"
}
}

View File

@ -0,0 +1,72 @@
<?php
$block_titling = get_field('block_titling_description_datas');
if (!function_exists('get_automatic_post')) {
function get_automatic_post($post_thematique)
{
$automatic_query_args = array(
'post_per_page' => 1,
'post_status' => 'publish',
'post_type' => 'questions',
'include_children' => true,
'tax_query' => array(
array(
'taxonomy' => 'thematiques',
'field' => 'slug',
'terms' => $post_thematique->slug,
'include_children' => true,
)
)
);
$posts = new WP_Query($automatic_query_args);
return $posts->posts[0] ?? null;
}
}
?>
<section id="block-questions-frequentes">
<div class="section_titling">
<h2 class="section_titling__title"><?php echo __("Les questions les plus fréquentes", 'homegrade-theme__texte-fonctionnel') ?></h2>
<p class="section_titling__subtitle"><?php echo __("Simplifions votre recherche !", 'homegrade-theme__texte-fonctionnel') ?></p>
</div>
<div class="questions-frequentes-grid">
<?php
$thematique_terms = get_terms(array(
'taxonomy' => 'thematiques',
'hide_empty' => false,
'parent' => 0
));
foreach ($thematique_terms as $key => $thematique) {
if (
$thematique->slug === "renovation-circulaire"
|| $thematique->slug === "circulaire-renovatie"
|| $thematique->slug === "au-quotidien"
|| $thematique->slug === "dagelijks"
|| $thematique->slug === "aides-financieres"
|| $thematique->slug === "financiele-steun"
) continue;
// $thematique_datas = get_term_by('slug', $thematique->slug, 'thematiques');
$manual_data = get_field($thematique->slug . '_manual_data');
$post_datas = $manual_data ? $manual_data : get_automatic_post($thematique);
get_template_part(
'template-components/cards/card-frequent-question',
null,
array(
'thematique' => $thematique,
'post_ID' => $post_datas->ID,
'post_title' => $post_datas->post_title,
'post_excerpt' => $post_datas->post_excerpt,
// 'post_url' => $post_datas->post_excerpt,
)
);
}
?>
</div>
</section>

View File

@ -0,0 +1,17 @@
{
"name": "acf/show-thematiques",
"title": "Thématiques",
"category": "homegrade-page-home",
"multiple": false,
"icon": {
"foreground": "#DF1E1E",
"src": "schedule"
},
"keywords": [
"Thématiques"
],
"acf": {
"mode": "auto",
"renderTemplate": "show-thematiques.php"
}
}

View File

@ -0,0 +1,65 @@
window.addEventListener("DOMContentLoaded", (event) => {
const cardThematiques = document.querySelectorAll(".swiper-slide .card-thematique");
function swiperCheckBreakpoints() {
const hasSwiper = thematiquesSwiper.__swiper__ === true;
if (window.innerWidth < 960 && hasSwiper) {
thematiquesSwiper.destroy(true, true);
}
if (window.innerWidth >= 960 && !hasSwiper) {
initiateSwiper();
}
}
function initiateSwiper() {
thematiquesSwiper = new Swiper(".swiper-container", {
grabCursor: false,
slidesPerView: 3,
spaceBetween: 30,
a11y: {
enabled: true,
prevSlideMessage: textTranslations.previousSlide,
nextSlideMessage: textTranslations.nextSlide,
slideRole: "",
slideLabelMessage: textTranslations.slideLabel,
},
// loop: true,
// centeredSlides: true,
keyboard: {
enabled: true,
},
navigation: {
nextEl: ".thematique-button-next",
prevEl: ".thematique-button-prev",
},
pagination: {
el: ".swiper-pagination",
clickable: true,
renderBullet: function (index, className) {
const ariaLabel = cardThematiques[index].getAttribute("data-taxonomy");
// return `<button class="${className}" aria-label="${ariaLabel}"></button>`;
return `<div class="${className}" test tabindex="-1" aria-label="Aller à la slide ${index}"></div>`;
},
},
breakpoints: {
// when window width is >= 320px
// when window width is >= 480px
320: {
slidesPerView: 2,
},
// when window width is >= 640px
1100: {
slidesPerView: 3,
},
},
// a11y: false,
});
}
initiateSwiper();
swiperCheckBreakpoints();
window.addEventListener("resize", swiperCheckBreakpoints);
});

View File

@ -0,0 +1,79 @@
<?php
$block_titling_datas = get_field('block_titling_datas');
$terms = get_terms(array(
'taxonomy' => 'thematiques',
'parent' => 0,
'hide_empty' => false,
));
?>
<section id="section-show-thematiques" class="section-show-thematiques">
<div class="section_titling">
<h2 class="section_titling__title"><?php echo $block_titling_datas['title'] ?></h2>
<p class="section_titling__subtitle"><?php echo $block_titling_datas['subtitle'] ?></p>
</div>
<div class="swiper-content">
<button class="thematique-button-prev" aria-label="Thématique précédente">
<img src='<?php echo get_template_directory_uri() ?>/resources/img/graphic-assets/slider-next-left.svg' alt=''>
</button>
<!-- Slider main container -->
<div class="swiper-container">
<!-- If we need pagination -->
<!-- Additional required wrapper -->
<div class="swiper-wrapper">
<!-- Slides -->
<!-- <div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div> -->
<?php foreach ($terms as $term) : ?>
<?php if (
$term->slug === "renovation-circulaire"
|| $term->slug === "circulaire-renovatie"
|| $term->slug === "au-quotidien"
|| $term->slug === "dagelijks"
|| $term->slug === "aides-financieres"
|| $term->slug === "financiele-steun"
) continue; ?>
<div class="swiper-slide">
<?php
get_template_part(
'template-components/cards/card-conseils-thematique',
null,
array(
'thematique' => $term,
)
);
?>
</div>
<?php endforeach; ?>
</div>
<button class="thematique-button-next" aria-label="Thématique suivante">
<img src='<?php echo get_template_directory_uri() ?>/resources/img/graphic-assets/slider-next-right.svg' alt=''>
</button>
<div class="swiper-pagination" tabindex="-1"></div>
<!-- scrollbar -->
<!-- <div class="swiper-scrollbar"></div> -->
</div>
<!-- If we need navigation buttons -->
</div>
</section>