FEATURE Introducing block recommandations

functions.php

@@ -13,3 +13,4 @@ require_once(__DIR__ . '/includes/article.php');
 require_once(__DIR__ . '/includes/api.php');
 require_once(__DIR__ . '/includes/renderPostsDatas.php');
 require_once(__DIR__ . '/includes/utilities.php');
+require_once(__DIR__ . '/includes/featured-revues.php');

includes/featured-revues.php

@@ -0,0 +1,27 @@
+<?php
+
+if (!defined('ABSPATH')) exit;
+
+/* ----------------------------------------------------------------
+	##### OPTIONS PAGE UNDER REVUES CPT
+ ------------------------------------------------------------------*/
+add_action('acf/init', 'dynamiques_register_revues_options_page');
+function dynamiques_register_featured_revues_options_page()
+{
+	// Limite au site Dynamiques (où le CPT "revues" est enregistré)
+	$current_site = get_current_blog_id();
+	if ($current_site !== 2) return;
+
+	acf_add_options_sub_page(array(
+		'page_title'  => __('Revues Conseillées', 'dynamiques'),
+		'menu_title'  => __('Revues Conseillées', 'dynamiques'),
+		'parent_slug' => 'edit.php?post_type=revues',
+		'menu_slug'   => 'revues-options',
+		'capability'  => 'manage_options',
+		'redirect'    => false,
+	));
+}
+
+add_action('acf/init', 'dynamiques_register_featured_revues_options_page');
+
+

resources/css/app.css

@@ -52,3 +52,4 @@
 @import './blocks/explore-tags.css';
 @import './blocks/wp-block-pullquote.css';
 @import './blocks/statistics-datas.css';
+@import './blocks/recommandations.css';

resources/css/blocks/recommandations.css

@@ -0,0 +1,69 @@
+.wp-block-dynamiques-blocks-nos-recommandations {
+  @apply bg-carhop-purple-100 py-24 px-12 xl:px-24;
+  .inner {
+    @apply max-w-screen-2xl mx-auto;
+  }
+
+  .block-heading {
+    @apply text-primary flex flex-wrap gap-x-8;
+
+    &__title {
+      @apply flex grow items-end justify-between gap-8 uppercase text-2xl md:text-4xl lg:text-5xl;
+      span {
+        @apply block shrink-0;
+      }
+      &:after {
+        @apply w-full z-20 bg-primary block mb-2 shrink;
+        height: 1px;
+        content: ' ';
+      }
+    }
+
+    &__subtitle {
+      @apply text-lg  font-bold  uppercase nunito mb-6 w-full flex-wrap;
+    }
+
+    .header-link {
+      @apply text-lg font-medium    nunito flex items-center gap-3;
+      text-transform: none;
+      span {
+        @apply pt-1;
+      }
+
+      svg {
+        @apply w-8 h-8;
+        transition: transform 0.3s ease-in-out;
+        path,
+        circle {
+          @apply stroke-primary stroke-2;
+        }
+      }
+      &:hover {
+        svg {
+          @apply rotate-45 translate-x-2;
+        }
+      }
+    }
+  }
+
+  .recommandations-grid {
+    @apply grid lg:grid-cols-3 gap-16 pt-12;
+  }
+
+  .revue-recommandation-card {
+    @apply flex flex-col gap-x-8 gap-y-2 bg-white p-8 border border-primary;
+    .content-meta {
+      @apply text-primary;
+    }
+    &__title {
+      @apply text-2xl;
+    }
+    &__thumbnail {
+      @apply p-4  border border-primary mt-8;
+      transform: rotate(2deg);
+      img {
+        @apply w-full h-48 object-cover;
+      }
+    }
+  }
+}

template-parts/revues/revue-recommandation-card.php

@@ -0,0 +1,27 @@
+<?php
+$title = $args['title'];
+$ID = $args['ID'];
+$thumbnail = get_the_post_thumbnail($ID, 'full');
+
+
+
+?>
+
+<a href="<?php echo get_the_permalink($ID); ?>" class="revue-recommandation-card">
+	<div class="content-meta">
+		<span class="content-meta__type content-meta__type--revue">Revue</span>
+	</div>
+	<h3 class="revue-recommandation-card__title"><?php echo $title; ?></h3>
+	<?php if ($thumbnail) : ?>
+		<div class="revue-recommandation-card__thumbnail">
+			<?php echo $thumbnail; ?>
+		</div>
+	<?php endif; ?>
+
+
+
+	<div class="cta cta--go cta--primary">
+		<img src="<?php echo get_template_directory_uri(); ?>/resources/img/carhop-fleche-full.svg" alt="<?php echo $alt; ?>">
+	</div>
+
+</a>