Add meta image managed by media manager

Makefile

@@ -9,7 +9,7 @@ export COMPOSE_PROJECT_NAME=homepage
 export MIGRATIONS_NAMESPACE=MonsieurBiz\\SyliusHomepagePlugin\\Migrations
 export USER_UID=$(shell id -u)
 PLUGIN_NAME=sylius-${COMPOSE_PROJECT_NAME}-plugin
-COMPOSE=docker-compose
+COMPOSE=docker compose
 YARN=yarn
 
 ###

composer.json

@@ -6,6 +6,7 @@
     "license": "MIT",
     "require": {
         "monsieurbiz/sylius-plus-adapter-plugin": "^1.1",
+        "monsieurbiz/sylius-media-manager-plugin": "^1.1",
         "monsieurbiz/sylius-rich-editor-plugin": "^2.8",
         "php": "^8.0",
         "sylius/sylius": ">=1.11 <1.14"

src/Entity/Homepage.php

@@ -137,6 +137,16 @@ public function setMetaKeywords(?string $metaKeywords): void
         $this->getTranslation()->setMetaKeywords($metaKeywords);
     }
 
+    public function getMetaImage(): ?string
+    {
+        return $this->getTranslation()->getMetaImage();
+    }
+
+    public function setMetaImage(?string $metaImage): void
+    {
+        $this->getTranslation()->setMetaImage($metaImage);
+    }
+
     protected function createTranslation(): HomepageTranslation
     {
         return new HomepageTranslation();

src/Entity/HomepageInterface.php

@@ -42,4 +42,8 @@ public function setMetaDescription(?string $metaDescription): void;
     public function getMetaKeywords(): ?string;
 
     public function setMetaKeywords(?string $metaKeywords): void;
+
+    public function getMetaImage(): ?string;
+
+    public function setMetaImage(?string $metaImage): void;
 }

src/Entity/HomepageTranslation.php

@@ -29,6 +29,8 @@ class HomepageTranslation extends AbstractTranslation implements HomepageTransla
 
     protected ?string $metaDescription;
 
+    protected ?string $metaImage;
+
     public function getId(): ?int
     {
         return $this->id;
@@ -83,4 +85,14 @@ public function setMetaKeywords(?string $metaKeywords): void
     {
         $this->metaKeywords = $metaKeywords;
     }
+
+    public function getMetaImage(): ?string
+    {
+        return $this->metaImage;
+    }
+
+    public function setMetaImage(?string $metaImage): void
+    {
+        $this->metaImage = $metaImage;
+    }
 }

src/Entity/HomepageTranslationInterface.php

@@ -39,4 +39,8 @@ public function setMetaDescription(?string $metaDescription): void;
     public function getMetaKeywords(): ?string;
 
     public function setMetaKeywords(?string $metaKeywords): void;
+
+    public function getMetaImage(): ?string;
+
+    public function setMetaImage(?string $metaImage): void;
 }

src/Form/Type/HomepageTranslationType.php

@@ -13,6 +13,7 @@
 
 namespace MonsieurBiz\SyliusHomepagePlugin\Form\Type;
 
+use MonsieurBiz\SyliusMediaManagerPlugin\Form\Type\ImageType as MediaManagerImageType;
 use MonsieurBiz\SyliusRichEditorPlugin\Form\Type\RichEditorType;
 use Sylius\Bundle\ResourceBundle\Form\Type\AbstractResourceType;
 use Symfony\Component\Form\Extension\Core\Type\TextType;
@@ -45,6 +46,11 @@ public function buildForm(FormBuilderInterface $builder, array $options): void
                 'required' => false,
                 'label' => 'monsieurbiz_homepage.ui.form.meta_keywords',
             ])
+            ->add('metaImage', MediaManagerImageType::class, [
+                'label' => 'monsieurbiz_homepage.ui.form.meta_image',
+                'help' => 'monsieurbiz_homepage.ui.form.meta_image_help',
+                'required' => false,
+            ])
         ;
     }
 

src/Migrations/Version20241003135122.php

@@ -0,0 +1,40 @@
+<?php
+
+/*
+ * This file is part of Monsieur Biz' Homepage plugin for Sylius.
+ *
+ * (c) Monsieur Biz <[email protected]>
+ *
+ * For the full copyright and license information, please view the LICENSE.txt
+ * file that was distributed with this source code.
+ */
+
+declare(strict_types=1);
+
+namespace MonsieurBiz\SyliusHomepagePlugin\Migrations;
+
+use Doctrine\DBAL\Schema\Schema;
+use Doctrine\Migrations\AbstractMigration;
+
+/**
+ * Auto-generated Migration: Please modify to your needs!
+ */
+final class Version20241003135122 extends AbstractMigration
+{
+    public function getDescription(): string
+    {
+        return '';
+    }
+
+    public function up(Schema $schema): void
+    {
+        // this up() migration is auto-generated, please modify it to your needs
+        $this->addSql('ALTER TABLE monsieurbiz_homepage_homepage_translation ADD metaImage VARCHAR(255) DEFAULT NULL');
+    }
+
+    public function down(Schema $schema): void
+    {
+        // this down() migration is auto-generated, please modify it to your needs
+        $this->addSql('ALTER TABLE monsieurbiz_homepage_homepage_translation DROP metaImage');
+    }
+}

src/Resources/config/config.yaml

@@ -2,3 +2,4 @@ imports:
     - { resource: "sylius/fixtures.yaml" }
     - { resource: "sylius/grid.yaml" }
     - { resource: "sylius/resources.yaml" }
+    - { resource: 'images.yaml' }

src/Resources/config/doctrine/HomepageTranslation.orm.xml

@@ -14,6 +14,7 @@
         <field name="content" type="text" nullable="true" />
         <field name="metaTitle" length="255" nullable="true" />
         <field name="metaKeywords" length="255" nullable="true" />
+        <field name="metaImage" nullable="true" />
         <field name="metaDescription" type="text" nullable="true" />
         <field name="locale" length="10" nullable="true" />
     </mapped-superclass>

src/Resources/config/images.yaml

@@ -0,0 +1,3 @@
+liip_imagine:
+    filter_sets:
+        monsieurbiz_homepage_og_image: ~

src/Resources/translations/messages.en.yaml

@@ -14,6 +14,8 @@ monsieurbiz_homepage:
             meta_title: 'Meta title'
             meta_description: 'Meta description'
             meta_keywords: 'Meta keywords'
+            meta_image: 'Meta image'
+            meta_image_help: 'Ideal format: 1200 x 630 px'
             id: 'ID'
         actions:
             create: 'New homepage'

src/Resources/translations/messages.fr.yaml

@@ -14,6 +14,8 @@ monsieurbiz_homepage:
             meta_title: 'Meta titre'
             meta_description: 'Meta description'
             meta_keywords: 'Meta mots clés'
+            meta_image: 'Meta image'
+            meta_image_help: 'Format idéal : 1200 x 630 px'
             id: 'ID'
         actions:
             create: 'Nouvelle page d''accueil'

src/Resources/translations/messages.nl.yaml

@@ -14,6 +14,8 @@ monsieurbiz_homepage:
             meta_title: 'Meta titel'
             meta_description: 'Meta omschrijving'
             meta_keywords: 'Meta keywords'
+            meta_image: 'Meta afbeelding'
+            meta_image_help: 'Ideaal formaat: 1200 x 630 px'
             id: 'ID'
         actions:
             create: 'Nieuwe homepagina'

src/Resources/views/Homepage/index.html.twig

@@ -20,6 +20,9 @@
     {% if homepages is not empty and homepages.metaKeywords is not empty %}
         <meta name="keywords" content="{{ homepages.metaKeywords }}"/>
     {% endif %}
+    {% if homepages is not empty and homepages.metaImage is not empty %}
+        <meta property="og:image" content="{{ homepages.metaImage|imagine_filter('monsieurbiz_homepage_og_image') }}" />
+    {% endif %}
 {% endblock %}
 
 {% block content %}