EC-CUBE4 各商品ごとにメタタグを設定できるようにする方法!

なぜかECCUBEではこのタイトルのようにどんなに需要が高そうなカスタマイズでもwebに情報がない!ということが多すぎるような気がする

だから自分で試行錯誤してカスタマイズした内容をどんどんここにかいていきたいと思う(忘れたらもう一度時間かけて調べたりするの大変だし・・)

今回はタイトル通り各商品ごとにメタタグを設定できるようにする。


app\Customize\Entity
にProductTrait.phpというファイルを作成

<?php

namespace Customize\Entity;

use Doctrine\ORM\Mapping as ORM;
use Eccube\Annotation as Eccube;

/**
  * @Eccube\EntityExtension("Eccube\Entity\Product")
 */
trait ProductTrait
{
    /**
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"メーカー"
     *  }
     * )
     */
    public $maker_name;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"メタディスクリプション"
     *  }
     * )
     */
    public $add_meta_dis;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     */
    public $add_meta_keyword;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"og:url"
     *  }
     * )
     */
    public $add_meta_og_url;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"og:type"
     *  }
     * )
     */
    public $add_meta_og_type;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"og:title"
     *  }
     * )
     */
    public $add_meta_og_title;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"og:description"
     *  }
     * )
     */
    public $add_meta_og_description;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"og:site_name"
     *  }
     * )
     */
    public $add_meta_site_name;

    /**
     * @var string
     * @ORM\Column(type="string", nullable=true)
     * @Eccube\FormAppend(
     *  auto_render=true,
     *  options={
     *   "required": false,
     *   "label":"og:image"
     *  }
     * )
     */
    public $add_meta_og_image;
}

ここまでしたらコマンドツールで
php bin\console eccube:generate:proxies
と実行。( コマンドがコピペでエラーになる場合は\を半角¥に変える等環境に合わせて変えて試してみてください。 )
これによってapp\proxy\entity\src\Eccube\Entity
にProduct.phpが生成される。

次にまたコマンドで
php bin\console doctrine:schema:update --dump-sql

これで更新されるSQLが表示される。ここで最新の状態です的なメッセージが出たら
php bin\console cache:clear --no-warmup
でキャッシュ削除してもう一度試してみる。
SQLがコマンド上で表示されたらそのSQLを反映するために
php bin\console doctrine:schema:update --dump-sql --force
を実行。
これでデータベースのdtb_productが更新されるはず。

このタイミングで管理面内にもフォームが自動で生成される。
テストでデータを入れてみてDBにもデータが入ることを確認する。

次は入っているデータを出力するように
src/Eccube/Resource/template/default/default_frame.twig
を編集する。

<head>内に

    {% if Product.add_meta_dis is not empty %}
        <meta name="description" content="{{ Product.add_meta_dis }}">
    {% endif %}
    {% if Product.add_meta_keyword is not empty %}
        <meta name="keywords" content="{{ Product.add_meta_keyword }}">
    {% endif %}
    {% if Product.add_meta_og_url is not empty %}
        <meta property="og:url" content="{{ Product.add_meta_og_url }}">
    {% endif %}
    {% if Product.add_meta_og_type is not empty %}
        <meta property="og:type" content="{{ Product.add_meta_og_type }}">
    {% endif %}
    {% if Product.add_meta_og_title is not empty %}
        <meta property="og:title" content="{{ Product.add_meta_og_title }}">
    {% endif %}
    {% if Product.add_meta_og_description is not empty %}
        <meta property="og:description" content="{{ Product.add_meta_og_description }}">
    {% endif %}
    {% if Product.add_meta_site_name is not empty %}
        <meta property="og:site_name" content="{{ Product.add_meta_site_name }}">
    {% endif %}
    {% if Product.add_meta_og_image is not empty %}
        <meta property="og:image" content="{{ Product.add_meta_og_image }}">
    {% endif %}
    {% if Page.meta_robots is not empty %}
        <meta name="robots" content="{{ Page.meta_robots }}">
    {% endif %}
    {% if Page.meta_tags is not empty %}
        {{ include(template_from_string(Page.meta_tags)) }}
    {% endif %}

を追加する。これでデータが入ってるときのみそれぞれのメタタグが出力される。

SEOツール等を使って反映を確認したら完了。