お知らせ

✔ Viewer

EC-CUBE 3.x

titleの並びや区切り記号を変更する方法

by TheVOS posted Apr 10, 2019

Shortcut

Prev前へ書き込み

Next次へ書き込み

Larger Font Smaller Font 上へ下へ Go comment 印刷添付

Shortcut

Prev前へ書き込み

Next次へ書き込み

Larger Font Smaller Font 上へ下へ Go comment 印刷添付

Extra Form
原文出所	https://www.nxworld.net/cms/ec-change-ti...rator.html

EC-CUBE 3.Xは、デフォルトのテンプレートだとtitle表示が「ショップ名 / ページ名」という形になっていますが、それを任意の並びにしたり区切り記号を変更したりする方法です。

※紹介している内容はEC-CUBEのVersion 3.0.10で動作確認したもので、デフォルトのテンプレートを使っている想定になります。

※変更した内容が反映されない場合は、管理画面の「コンテンツ管理 < キャッシュ管理」にある「キャッシュクリア」ボタンを押して再度確認してみてください。

公式サイトで公開されているデモを見ても確認できますが、例えばデフォルトだとtitleの表示がTOPページは「ショップ名 / TOPページ」、当サイトについてページでは「ショップ名 / 当サイトについて」といったように、先頭にショップ名が表示、区切り記号は「/」を使用、その後ページ名を表示という形になっています。
このままでも気にならないという人ももちろんいるでしょうが、並びと区切り記号を変更したいという時は以下を変更することで任意の表示にできます。

まず、デフォルトテンプレートではtitle部分を表示している記述はdefault_frame.twigというファイルになるので、その中にある下記のような記述（27行目辺り）を探します。

default_frame.twig

<title>{{ BaseInfo.shop_name }}{% if subtitle is defined and subtitle is not empty %} / {{ subtitle }}{% elseif title is defined and title is not empty %} / {{ title }}{% endif %}</title>

今回は例として「ショップ名 / ページ名」の表示を「ページ名 - ショップ名」に変更してみます。
上記の記述を下記のように変更し、{{ BaseInfo.shop_name }}や{{ title }}といったショップ名やページタイトルをそれぞれ表示するタグの並びを入れ替え、区切り記号も「/」からサンプルコードのハイライト表示部分のように「-」を使う形に変更します。

default_frame.twig

<title>{% if subtitle is defined and subtitle is not empty %}{{ subtitle }} - {% elseif title is defined and title is not empty %}{{ title }} - {% endif %}{{ BaseInfo.shop_name }}</title>

上記変更後にページを確認（必要であればキャッシュクリアをしてから）すると各ページのtitle部分が「ページ名 - ショップ名」という形に変更されているのを確認でき、例えばTOPページの場合は「TOPページ - ショップ名」へ、当サイトについてページであれば「当サイトについて - ショップ名」といった形になります。

Facebook [ja]コメント

TAG •

EC-CUBE,
3.x,

Prev デフォルトのtitleを任意のものに変更する方法

デフォルトのtitleを任意のものに変更する方法 2019.04.10by TheVOS 新規作成したページURLから「user_data」を消す方法とURLを出力す... Next

新規作成したページURLから「user_data」を消す方法とURLを出力す... 2019.04.10by TheVOS

Dislike

Atachment
添付 '1'	ec-change-title-sequence-and-separator.png,

Facebook Twitter Google Pinterest

上へ下へ Go comment 印刷添付

✔コメントする

Select Editor

✔ Textarea ✔ WYSIWYG

コメントする権限がありません。 Sign In?

Q: [EC-CUBE 3.x] デフォルトのtitleを任意のものに変更する方法 2019.04.10
A:
https://thevos.jp/Manual/17605
EC-CUBE 3.Xでデフォルトでtitle部分に表示されるものを任意で削除・変更したり、あらかじめ用意されているページのページ名（テンプレート名）を任意のものに変更する方法です。
※紹介している内容はEC-CUBEのVersion 3.0.10で動作確認したもので、デフォルトのテンプレートを使っている想定になります。

※変更した内容が反映されない場合は、管理画面の「コンテンツ管理 < キャッシュ管理」にある「キャッシュクリア」ボタンを押して再度確認してみてください。

「TOPページ」の表記を消す
デフォルトのテンプレートをそのまま使用している場合、TOPページのtitleは「ショップ名 / TOPページ」という表示になっています。
これはこれで今見てるのがTOPページだとわかりやすいのですが、個人的にはわざわざTOPページという表記は必要ないと思うので消してみます。

まず、デフォルトテンプレートではtitle部分を表示している記述はdefault_frame.twigというファイルになるので、その中にある下記のような記述（27行目辺り）を探します。

default_frame.twig

<title>{{ BaseInfo.shop_name }}{% if subtitle is defined and subtitle is not empty %} / {{ subtitle }}{% elseif title is defined and title is not empty %} / {{ title }}{% endif %}</title>
上記記述を見つけたら、ここに条件分岐を追記していきます。
具体的にはtitleの中にTOPページの場合にという条件文を記述（コードハイライト部分）し、TOPページにはショップ名のみを表示させ、その他のページにはデフォルトで使われているショップ名とページ名が表示されるようにします。

default_frame.twig

<title> {% if PageLayout.url == "homepage" %} {{ BaseInfo.shop_name }} {% else %} {{ BaseInfo.shop_name }}{% if subtitle is defined and subtitle is not empty %} / {{ subtitle }}{% elseif title is defined and title is not empty %} / {{ title }}{% endif %} {% endif %} </title>
※インデントと改行はソースがわかりやすいように入れているだけなので、必要なければ取り除いて問題ないです。

上記変更後にページを確認（必要であればキャッシュクリアをしてから）すると、TOPページのtitleはショップ名のみが表示されているのを確認でき、他のページに関してはこれまで通りショップ名とページ名が表示されているのを確認できます。

デフォルトのページ名を変更する
これは自分がやり方を知らないだけの可能性もありますが、EC-CUBEは新たに自分で作成したページは任意のページ名をつけることができますが、例えば「当サイトについて」や「プライバシーポリシー」のように、あらかじめ用意されているものについては任意のページ名に変更することができません。
上で紹介したように条件分岐を利用してテンプレート側で直接変更ということもできなくはないですが、その方法だと表側だけ任意のものに変更されて、管理画面のページ管理などでは結局元の名称のままでページ名（テンプレート名）が表示されてしまい微妙です...。

これを表でtitleとして表示されるのはもちろん、管理画面でもちゃんと任意で付けたページ名で表示されるようにしたいという時にはデータベースの記述を変更することで可能になります。

※データベースは間違った個所を変更してしまったりすると最悪の場合元に戻せないなど起こりうるので、不安な人はあらかじめバックアップをとるなどして作業してください。

ここでは「当サイトについて」というページ名を「会社概要」というページ名に変更する形で紹介します。

まず、phpMyAdminなどでデータベースにアクセスして自身の環境でEC-CUBEで利用しているデータベースの情報を開き、その中にある「dtb_page_layout」というテーブルを表示します。
テーブルの詳細画面が表示されるとデフォルトであればズラッと各ページの情報や項目が表示されると思うので、その中にある「page_name」の項目を探して、且つ「当サイトについて」と記述されている部分を探します。
あとは、一覧画面で直接もしくは更に詳細ページに移動してから「当サイトについて」と表示されているところを「会社概要」に変更すれば、表側のtitleや管理画面のページ管理などのページ名表示が変更されているのを確認できます。

今回は例として「当サイトについて」を変更する形で紹介しましたが、同じようにすれば例えば「プライバシーポリシー」を「個人情報保護方針」にするだとか、「MYページ」という表記はすべて「マイページ」といったカタカナ表記のみにしたいといったことが可能です。
Facebook [ja]コメント
Q: [EC-CUBE 3.x] titleの並びや区切り記号を変更する方法 2019.04.10
A:
https://thevos.jp/Manual/17601
EC-CUBE 3.Xは、デフォルトのテンプレートだとtitle表示が「ショップ名 / ページ名」という形になっていますが、それを任意の並びにしたり区切り記号を変更したりする方法です。
※紹介している内容はEC-CUBEのVersion 3.0.10で動作確認したもので、デフォルトのテンプレートを使っている想定になります。

※変更した内容が反映されない場合は、管理画面の「コンテンツ管理 < キャッシュ管理」にある「キャッシュクリア」ボタンを押して再度確認してみてください。

公式サイトで公開されているデモを見ても確認できますが、例えばデフォルトだとtitleの表示がTOPページは「ショップ名 / TOPページ」、当サイトについてページでは「ショップ名 / 当サイトについて」といったように、先頭にショップ名が表示、区切り記号は「/」を使用、その後ページ名を表示という形になっています。
このままでも気にならないという人ももちろんいるでしょうが、並びと区切り記号を変更したいという時は以下を変更することで任意の表示にできます。

まず、デフォルトテンプレートではtitle部分を表示している記述はdefault_frame.twigというファイルになるので、その中にある下記のような記述（27行目辺り）を探します。

default_frame.twig

<title>{{ BaseInfo.shop_name }}{% if subtitle is defined and subtitle is not empty %} / {{ subtitle }}{% elseif title is defined and title is not empty %} / {{ title }}{% endif %}</title>
今回は例として「ショップ名 / ページ名」の表示を「ページ名 - ショップ名」に変更してみます。
上記の記述を下記のように変更し、{{ BaseInfo.shop_name }}や{{ title }}といったショップ名やページタイトルをそれぞれ表示するタグの並びを入れ替え、区切り記号も「/」からサンプルコードのハイライト表示部分のように「-」を使う形に変更します。

default_frame.twig

<title>{% if subtitle is defined and subtitle is not empty %}{{ subtitle }} - {% elseif title is defined and title is not empty %}{{ title }} - {% endif %}{{ BaseInfo.shop_name }}</title>
上記変更後にページを確認（必要であればキャッシュクリアをしてから）すると各ページのtitle部分が「ページ名 - ショップ名」という形に変更されているのを確認でき、例えばTOPページの場合は「TOPページ - ショップ名」へ、当サイトについてページであれば「当サイトについて - ショップ名」といった形になります。
Facebook [ja]コメント
Q: [EC-CUBE 3.x] 新規作成したページURLから「user_data」を消す方法とURLを出力するテンプレートタグ 2019.04.10
A:
https://thevos.jp/Manual/17576
EC-CUBE 3.Xではもともと用意されているページを利用するだけでなくオリジナルで新規ページを追加することもできるのですが、その場合作成したページのURLに「user_data」が付与されています。
この「user_data」という部分をURLから消す方法とそれに関連して新規作成したページのURLをテンプレートタグを使って出力する方法です。
※紹介している内容はEC-CUBEのVersion 3.0.10で動作確認したもので、デフォルトのテンプレートを使っている想定になります。

新規作成したページURLから「user_data」を消す
EC-CUBEは例えばプライバシーポリシーや特定商取引法に基づく表記などのようにECサイトであれば必要なページはある程度最初から用意されており、さらに表示させる要素やスタイル調整などもある程度できるようにはなっていますが、それらを利用する以外にもオリジナルのページを新たに作成できるようにもなっています。

ただ、オリジナルページはコンテンツをはじめ、名称・URL・ファイル名なども自由に決めることができるようになってはいるのですが、デフォルトではURLに「user_data」というのが付与されます。
特にこだわり等もなければそのままでいいですが、できれば消したいという要望がほとんどなので、この「user_data」を消してみます。
URLから「user_data」を消す方法としては、ファイル移動・DB操作・.htaccessを利用などのいろいろと方法はあるのですが、ここではルーティングを変更する方法を紹介します。

まずsrc/Eccube/ControllerProviderにあるFrontControllerProvider.phpを開き、41行目に辺りにある下記の記述を見つけます。

FrontControllerProvider.php

// user定義 $c->match('/'.$app['config']['user_data_route'].'/{route}', '\Eccube\Controller\UserDataController::index')->assert('route', '[0-9a-zA-Z_]+')->bind('user_data');
上記記述を見つけたら、$c->match('/'.$app['config'] ～の部分を削除もしくはコメントアウトして、その代わりに下記を記述します。

FrontControllerProvider.php

// user定義 $c->match('/' . '/{route}', '\Eccube\Controller\UserDataController::index')->assert('route', '[0-9a-zA-Z_]+')->bind('user_data');
上記を記述後に作成したページを確認すると、例えば「example」というURLで作成したページの場合はデフォルトでは「http://example.com/html/user_data/example」のようになっていますが、それが「http://example.com/html/example」というように「user_data」がないURLになっているのを確認できます。

この方法は以下EC-CUBEのフォーラムで紹介されていた方法です。

新規ページのディレクトリをuser_dataから変えたい - EC-CUBE 開発コミュニティ - フォーラム

URLを出力するテンプレートタグ
a要素でリンクを設定する際など、例えばお問い合わせページであれば「http://example.com/contact」とか「/contact」のような記述で設定するのでも一応ページ遷移もできはするのですが、こういったCMSなどはURLを出力するテンプレートタグなどが用意されていることがほとんどですし、それらを利用していなかったことで後々大変になることもあったりするので、基本的にはそちらを利用するべきです。

EC-CUBEでURLを出力するテンプレートはそれぞれ下記のような記述になり、下記は上からTOPページ・お問い合わせ・商品一覧のURLを出力させるものになります。
基本的には赤文字部分の中をページ毎に変更し、デフォルトのテンプレートとして用意されている商品一覧やプライバシーポリシーのようにURLの中にディレクトリが複数あるような場合は_を利用して記述します。

 <a href="{{ url('homepage') }}">TOP</a>  <a href="{{ url('contact') }}">お問い合わせ</a>  <a href="{{ url('product_list') }}">商品一覧</a>
上の流れで行くと新規作成したページも{{ url('xxx') }}と記述して「xxx」の部分を作成した際に決めたURLにすれば問題ないように感じますが、実はこれだと意図した形には出力されず、例えば「example」というURLにしたからといって{{ url('example') }}と記述してもリンク先は404となってしまいます。
新規作成したページのURLを出力したい時はこれまでとは少し違った記述方法になり、例えば「example」というURLにしたページのURLを出力するときは下記のように記述をします。

<a href="{{ url(app.config.user_data_route, {'route': 'example'}) }}">サンプル</a>
Facebook [ja]コメント