当サイトはコンテンツ連動型広告・アフィリエイト広告を設置しています。詳しくは 広告・アフィリエイトについて をご覧ください。

EC-CUBE4|トップページかどうかif文で条件分岐をする

更新日
2022年11月22日
作成日
2021年8月17日
当記事はEC-CUBE 4.0.6-p1 を使用して検証しています。参考にしたサイトも合わせて備忘録として記載します。

EC-CUBE4はテンプレートファイルにTwigが使われており、Twigの書式で変数の取得や条件分岐を行うことになります。

今回、この記事を記載するにあたり、トップページのロゴ箇所ではH1タグを使いたいが、トップページ以下の階層ではロゴ箇所はdivタグにしたい、と言う要望を実現します。

実装方法(ソースコード)

{% set request_uri = app.request.server.get('REQUEST_URI') %}
{% if request_uri == '/store/'  %}
{# request_uriの内容を出力する #}
{{request_uri}}
{% endif %}

1行目、app.request.server.get(‘REQUEST_URI’) にて現在見ているページのURIを取得し、変数request_uriにセットします。

EC-CUBE4がルート直下にインストールされている場合は’/’が出力されるでしょう。

私の場合はEC-CUBE4をstoreディレクトリにインストールしていましたので、’/store/’が出力されました。
(以下、トップページは/store/として記載します。)

2行目でrequest_uriが’/store/’の場合は実行する、という形で条件分岐をしています。前述の通り、私の環境ではEC-CUBE4のトップページはドメイン/store/という構成となっていますので、トップページでのみ条件分岐を行なうことを想定しています。

3行目はTwigのコメントですので、開発者のみ閲覧できる内容となります。

4行目でrequest_uriの内容を出力しています。現在適用しているテンプレートのいずれかのブロックに処理を記述し、画面上に /store/と表示されればOKです。

5行目はif文の終了です。

以上ですが、簡単にソースコードについて紹介しました。

次に紹介するソースコードはEC-CUBE4デフォルトのテンプレートのブロック(logo.twig)を利用して、上記内容を実装してみます。編集するブロックは以下のディレクトリにあります。

/app/template/default/Block/logo.twig

または、EC-CUBE4管理画面のコンテンツ管理 > ブロック管理 > ロゴ からも編集は可能です。

以下のソースコードを参考に編集する場合は必ずバックアップを行ってください。問題が発生した場合はご自身で解決するようお願い申し上げます。

以下のように実装することでトップページのロゴ箇所ではh1タグを表示し、トップページ以外ではdivタグを表示する、ということが実現できます。

広告
<div class="ec-headerRole">
    <div class="ec-headerRole__title">
        <div class="ec-headerTitle">
            <div class="ec-headerTitle__title">
            	{% set request_uri = app.request.server.get('REQUEST_URI') %}
	            {% if request_uri == '/store/'  %}
            	<h1><a href="{{ url('homepage') }}">{{ BaseInfo.shop_name }}</a></h1>
            	{% else %}
            	<div><a href="{{ url('homepage') }}">{{ BaseInfo.shop_name }}</a></div>
              {% endif %}
            </div>
        </div>
    </div>
</div>

以上となりますが、EC-CUBE4でトップページかどうかif文で条件分岐をする、についてまとめました。

以下のサイトもとても参考になりましたので、合わせてご覧ください。

参考にしたサイト