Eccube3&Eccube4 category titleの変更(&keyword search)

 

Eccube3,4には標準で商品検索と一度にいくつ表示させるかの表示個数、そして新着順などのソート機能がついております。

多くのショッピングカートではもはや当たり前の機能ですが、よくよくみてみると表示個数の変更や順序の変更をしても、タイトルが一切変わらない、どれもまったく同じタイトルでページが表示されおります。

そこに手を加えてみようというのか今回の記事です。

 

目標

①現在何ページ目を表示しているのか

②一度に何個表示なのか

③何順で表示しているのか

この三つをタイトルに埋め込み、常にオリジナルのタイトルとなるように変更してみます。

 

twigファイル(app/template/default/Product/detail.twig)の変更により各カテゴリーのタイトルを動的に変更することも考えられますが、この際 キーワード検索においても同様にタイトルを変更できれば楽なので、ProductController.phpに手を加えてみます。

src/Eccube/Controller/ProductController.php 変更前

/**
 * ページタイトルの設定
 *
 * @param  null|array $searchData
 *
 * @return str
 */
private function getPageTitle($searchData)
{
    if (isset($searchData['name']) && !empty($searchData['name'])) {
        return trans('front.product.search_result');
    } elseif (isset($searchData['category_id']) && $searchData['category_id']) {
        return $searchData['category_id']->getName();
    } else {
        return trans('front.product.all_products');
    }
}

のページタイトルの設定部分に手を加えてみます。

 

追加変数

$searchname : 入力された検索キーワードを取得

$pageno : 表示中のページ数を取得

$orderby : ソート方法を取得(価格の高い順・価格の低い順・新着順)

 

下記のように変更することで、検索・カテゴリー・全商品で条件を満たすタイトル表示できるようになります。

src/Eccube/Controller/ProductController.php 変更後

/**
     * ページタイトルの設定
     *
     * @param  null|array $searchData
     * @return str
     */
    private function getPageTitle($searchData)
    {
    if(empty($searchData['pageno'])){
       $pageno = 1;
    }else{
       $pageno = $searchData['pageno'];
    }
    $disp_number = $searchData['disp_number'];
    $orderby = $searchData['orderby'];
        if (isset($searchData['name']) && !empty($searchData['name'])) {
            $searchname = $searchData['name'];
            return "$searchname の検索結果 $pageno ページ目 $disp_number 表示 $orderby";
        } elseif (isset($searchData['category_id']) && $searchData['category_id']) {
            $category = $searchData['category_id']->getName();
            return "$category $pageno ページ目 $disp_number 表示 $orderby";
        } else {
            return "全商品 $pageno ページ目 $disp_number 表示 $orderby";
        }
    }

 

ECCUBE3&4 新しい フォーム 作成の手順

ECCUBE3&4にて新しいフォームを独自に作るときに必要となるであろう手続きを記しておきます。

symfony Documentation Formsより基本的なフォームの作り方をご覧ください。(注意書きが出ると思いますが、使用バージョン3.Xの場合には表示を切り替えてください)

Built-in Field Typesより使用できるField Typeを参照してください。

フォームはメール送信も行いますのでこちらも参考にしてください。How to Send an Email


(新規作成)と(追記)を追記しました。

フォームタイプ追加(新規作成)

src/Eccube/Form/Type/Front/サンプルType.php

フォームタイプの呼び出し(追記)
作成したフォームタイプを読み込む

src/Eccube/ServicePlovider/EccubeServiceProvider.php

新フォームのコントローラー(新規作成)

src/Eccube/Controller/サンプルController.php

どのようなフォームにしたいかここで決めます

新フォームページのマッチング(追記)

src/Eccube/ControllerProvider/FrontControllerPlovider.php

新フォームのアドレスへアクセスされたときに新フォームのコントローラーを呼び出します。

フォームテンプレート追加(新規作成)

app/template/default/サンプル/index.twig

フォーム入力画面のトップページ部分

Ecube4からapp/template/にadmin,defaultの他user_dataフォルダがあります。ログイン中のページや常時SSL、新規追加ページによって使い分けしていくようです。

フォーム確認画面テンプレート追加(新規作成)

app/template/default/サンプル/confirm.twig

confirm.twigの方には robotsにnoindex

フォーム完了画面テンプレート追加(新規作成)

app/template/default/サンプル/complete.twig

complete.twigの方には robotsにnoindex

フォームのメールテンプレート追加(新規作成)

app/template/default/Mail/サンプルmail.twig

自動返信や受信内容の文面を決めます。

メールテンプレート追加呼び出し(追記)

src/Eccube/Service/MailService.php

入力されたフォーム内容をメールテンプレートに合わせ メール送信を実行する部分

管理画面に新しいフォームが管理できるようにデーターベースに追加

データーベースにログインして

dtb_page_layoutのテーブルへ

下記あたりの数値を追加する
device_type_id
page_name サンプルフォーム
url サンプル
file_name サンプル/index.twig
edit_flg 0

edit_flgは0,1,2と指定できる
0はレイアウト編集、ページ編集、削除
1はレイアウト編集、ページ編集
2はレイアウト編集
が管理画面で操作できるようになる。

また作成日付を忘れないようにしましょう。
無記入だとsitemapで日付エラーが出てしまいます。

構造化データ マークアップのメモ

ECCUBE3のサイト構築のお手伝いをしていたりするのですが、SEO的な観点からプログラム言語を知らなくてもできる構造化データ マークアップのメモを記しておきたいとおもいます。

もし古本屋さん、古書店さんでECCUBE3を使っているという方がおられましたら、いっしょに情報共有できたらな思っております。これから始めようと思っている方や、プログラム的な疑問等などにおいて力になれればと思いますので、なにかありましたらコメントまたはメールにてお知らせください。

schema.orgを使った構造化データ マークアップのメモ

以下はECCUBE3内での方法です

お店の情報を”@type” : “LocalBusiness”で指定する。
どこでも設置してもいいのでブロックで作っておいても問題ないと思います。また、typeが異なれば2箇所以上でマークアップしても認識されます。

LocalBusinessのタイプはnameが必須なので必ず記入します。{{ BaseInfo.shop_name }}で指定可能

address
priceRange
telephone
は推奨フィールドのため、ないと警告がでます。priceRangeに関しては曖昧なフィールドでもあるので無視してもよいとのこと。
テストツールでは警告が出ます。

以下最低限の項目

<script type="application/ld+json">
{
  "@context" : "http://schema.org",
  "@type" : "LocalBusiness",
  "name" : "タイトル", //タイトルまたは{{ BaseInfo.shop_name }}
  "email" : "メールアドレス", //メールアドレス
  "image" : "ロゴ画像のurl" //ロゴ画像
  "telephone" : "電話番号" //電話番号
  "address" : {
    "@type" : "PostalAddress",
    "streetAddress" : "番地以下", //番地
    "addressLocality" : "市区町村", //市区町村
    "addressRegion" : "都道府県", //都道府県
    "addressCountry" : "日本",
    "postalCode" : "郵便番号" //郵便番号
  }
}
</script>

より項目を増やしたい場合は下記のサイトがお勧めです。
schema.org – LocalBusinessでよく使うプロパティ一覧

次に個別商品に関してのマークアップ

“Product”タイプで記入します。”name”は必須なので入力しましょう。

<script type="application/ld+json">
{
  "@context" : "http://schema.org",
  "@type" : "Product",
  "name" : "{{ Product.name }}",
{% for ProductImage in Product.ProductImage|slice(0,1) %}
  "image" : "{{ app.config.image_save_urlpath }}/{{ ProductImage|no_image_product }}",
{% endfor %}
  "description" : "{{ Product.description_detail }}",
  "brand" : {
    "@type" : "Brand",
    "name" : "ブランド名", //ブランド名
    "logo" : "ロゴ画像" //ロゴ画像
  },
  "offers" : {
    "@type" : "Offer",
    "price" : "{{ Product.getPrice02IncTaxMin }}",
    "priceCurrency": "JPY"
  }
}
</script>

{% for ProductImage in Product.ProductImage|slice(0,1) %}において、slice(0,1)で回数を指定することで、先頭の画像一枚を”image”として出します。画像がなければ”image”はなしになります。

“brand”はあってもなくても大丈夫です。

これらを商品詳細ページに記入することで商品毎のマークアップが出来ます。

最後に構造化データーテストツールで確認してください。