ショップサーブで通販サイトを構築していくときに、準備されているヘッダ部分のテンプレートが「トップページ」と「商品カテゴリページ」で同じなのでスタイル（表示 or 非表示）を切り替えたいときに便利なコードがあるので今回紹介させていただきます。（ヘッダコンテンツに限ります）

ショップサーブ（Eストア）とは？

ショップサーブとは株式会社Ｅストアーが提供しているレンタルカートサービスです。プランが有料と言うこともあり、充実のサービスが整備されています。AP Iもあり受注システムや在庫システム等との連動も安心して利用できます。

ショップサーブ（Eストア）

カスタマイズ方法

HTMLのカスタマイズ > ヘッダ（お店ページ）

任意の場所に下記のような感じでHTMLを追記します。

<div class="top-contents">
<!-- トップページと商品カテゴリページでスタイルを切り替えたい内容 -->
</div>

HTMLのカスタマイズ > headタグへの追記

ショップサーブの管理画面内でJavaScriptを記述できるのは「headタグへの追記」エリアのみなので、こちらにJSを記述していきます。「＊＊＊」の部分には正確なドメインを入力してください。https://の後に続く「www」を有りにされている場合は「www」も追記してください。

top-contentsをトップページにだけ表示させたい（商品一覧ページには非表示）

$(window).on('load',function(){
    var url = location.href
    if (url == "https://＊＊＊.com/"){
        $('.top-contents').css('display','block');
    }
});

「https://＊＊＊.com/」という完全一致のURLにアクセスした場合は” .top-contents ” を表示させます。

top-contentsをトップページにだけ非表示にさせたい（商品一覧ページには表示させたい）場合

$(window).on('load',function(){
    var url = location.href
    if (url != "https://＊＊＊.com/"){
        $('.top-contents').css('display','none');
    }
});

「https://＊＊＊.com/」という完全一致のURL以外にアクセスした場合は” .top-contents ” を非表示させます。

上記2つのコードの違いはif文で条件分岐させている上記3行目の箇所です。

if (url == "https://＊＊＊.com/")

・トップページ以外
!= “https://＊＊＊.com/”
不等価演算子を使い「〇〇以外の場合」という条件にします。

・トップページのみ
== “https://＊＊＊.com/”
比較演算子を使い、「〇〇と同じなら」という条件にします。

これで「トップページ」と「商品カテゴリページ」のスタイルの分岐が可能になります。しかし、気をつけないといけないのは「http://」のようにセキュアがついてない場合だと上記ルールは適応できないので下記のように条件（https://＊＊＊.com/でもhttps://＊＊＊.com/でもない場合）に変更します。

$(window).on('load',function(){
    var url = location.href
    if (url != "https://＊＊＊.com/" && url != "http://＊＊＊.com/"){
        $('.top-contents').css('display','none');
    }
});

これで「トップページ」と「商品カテゴリページ」のスタイルを切り替えができたと思います。