[ECCUBE+js+htaccess]他言語サイトに飛ばしつつURL構造も修正する方法

日本語サイトと英語サイトを用意したときとかにたまに発生するめんどいやつ。

前提と完成イメージ

日本語のECサイトがありました。後追いで英語サイトを作りました。言語切替リンクを作りたいってなりました。それぞれ見た感じは言語以外同じっぽいんだけどシステムが違う。だからURLの構造が違う。ついでに商品登録も手作業でやってて、同一商品でも商品IDが違う。トップページは単純にドメインの切り替えでいいんだけど、下層ページまでカバーするってなるとどうしたらいいでしょうねっていう話。

とりあえずは、リンク元はjsで表示ページのURLを取得してドメインを書き換えてリンク部に設置。
リンク先は.htaccessで調整すればなんとかなるかなという算段でやっていく。

リンク元：hrefの作成

jsで以下の感じに組んでいく。

  1. 現在のurlを取得
  2. ドメイン部を置換
  3. リンク部のhrefに突っ込む
    nowUrl = location.href;
    if(nowUrl.indexOf('www.')!= -1){
        languageHrefEn = nowUrl.replace('www.【ドメイン】','en.【ドメイン】');
    }else{
        languageHrefEn = nowUrl.replace('【ドメイン】','en.【ドメイン】');
    }
    $('.language .ja a').attr('href',nowUrl);
    $('.language .en a').attr('href',languageHrefEn);

jQuery使ってるから使うときはライブラリ読ませてね。

組んでるついでの記事なのでSSLのチェックは省いて「www.」のチェックをしてある。これはドメイン部分だけ置換すれば済む話なんだけど、SSLが片方にしか適用されてないとか、リンク元がSSLあるんだけど強制してないとか、環境によってはまるっと書き換える必要があるんで注意。

ついでにいうとドメインだけ置換してるのでパラメータもそのまま反映させる。

で、HTMLはこんな感じ。

<ul class="language">
    <li class="ja"><a href="https://www.【ドメイン】">japanese</a></li>
    <li class="en"><a href="https://en.【ドメイン】">english</a></li>
</ul>

今どきjsを切ってる人はいないだろうけど、リンク切れを回避させるために最低限トップページのURLを入れておく。

これで他言語サイトにリンクするようになった。

リンク先：構造が異なるURLへのアクセスへ対応（301リダイレクト）

まあ、ぶっちゃけECCUBEなんだけどね。

商品IDが同じなら構造部分の置換で完結する。

[eccube]2系から3系への引っ越しリダイレクト設定
ちょっと危なかった
blog.megefeps.info
2020.10.23

でも、これをやっちゃうと同一IDの別商品を表示しちゃうんで今回のケースでは使えない。
個別に入力していくしかないんでめちゃくちゃ面倒くさい作業になる。

具体的にはこうなる。

  1. リンク元で生成するURLの一覧を用意する
  2. 該当するリンク先のURL一覧を用意する
  3. それぞれを301リダイレクトで紐付ける

片方のリストを作ったらもう片方を紐付ける。この作業が辛い。商品登録時にIDを管理してるならいいんだけど、移植でもない限りそんなことしてるなんてWEB屋でも滅多にないんで非常にダルい。すべて目視と手作業になる。登録商品の数だけ手間が増える。

ECCUBE3の商品リスト抽出並びにURL作成

ECCUBE3は商品のリストをCSVで書き出せるんだけど、URLは書き出せない。商品IDを商品詳細ページのURLにくっつけて表示する仕組みなんで、というか出力したいって状況も限られるんだろうね、書き出せない。

ついでに商品一覧を書き出すと出力内容に関わらず規格の数だけ同商品が並ぶ。規格とはバリエーションなのであって然るべきなんだけど、URL的には同一なんで非常にダルい。エクセルとかスプレッドシートで重複データから抽出する必要がある。

ということを踏まえて、「商品マスター」を開く。検索窓は空欄のままで「検索する」をクリックして登録商品の一覧を出す。リストのヘッダー部「CSVダウンロード」→「出力項目設定」をクリック（「基本情報設定」→「CSV出力項目設定」→「商品CSV」でも可）。「CSV出力する項目」に「商品名」「商品ID」を入れる。

また「商品マスター」で空欄のまま検索して商品一覧を出して、「CSVダウンロード」→「CSVダウンロード」をクリック。ダウンロードされたCSVファイルを開く。規格バリエーションによっては行数がえらいことになってるんで覚悟しておく。

で、「重複データは1つだけ抽出」をやる。好きにやればいいんだけどよくわかんない人は「エクセル　重複　削除」とかで調べてやっていけばいい。

わからん場合はこのページの「重複していないデータを抽出する」に倣うといい。

エクセル 重複データを抽出する
エクセルの重複データを抽出するには、データの詳細設定から をチェックします。重複チェックするには COUNTIF 関数を使用します。
www.tipsfound.com

この方法は重複分を非表示にしてるだけなんで、念の為表示分をコピーして別シートに逃す。

重複分を取っ払ったらURLを作成する。ECCUBE3は「【ドメイン】/products/detail/【商品ID】」なので、エクセル上で手前部分と商品IDを繋いでしまえばいい。

やることは単純でその代わりめんどくさい。理解してないと詰むんで理解しましょう。

ECCUBE2の商品リスト抽出並びにURL作成

今回手前どものケースではECCUBE3の方が商品数が少なくECCUBE2はめっちゃある。しかも商品名表記が違う上に商品IDも違う。だから上記で作成したECCUBE3のリストと見ながらECCUBE2の商品管理ページでひたすら検索していくしか無い。

だけどもまあ、ECCUBE2でも上記と同様に商品一覧のダウンロードからURL作成まで持っていけるということを頭に入れておくと良い。ECCUBE2もやることはECCUBE3と同じ。ECCUBE2も商品URLを書き出すことはできないんで、出力項目設定→CSVダウンロード→重複削除を行う。

ECCUBE2のURLは「【ドメイン】/products/detail.php?product_id=【商品ID】」になる。リストの商品IDとくっつけてURL作成完了。

.htaccessの編集

リンク元とリンク先のURLをペアにしたら、301リダイレクトをやっていく。
書式はパターンなのでエクセルで作っちゃったほうが楽。

ECCUBE2→ECCUBE3でリンクさせる場合、301はこんな感じになる。

//転送元：products/detail.php?product_id=【商品ID】
//転送先：/products/detail/【商品ID】

RewriteEngine On
RewriteRule ^products/detail.php?product_id=【商品ID】$ /products/detail/【商品ID】 [R=301,L]

転送元と転送先の商品IDはそれぞれのサイトに登録されたものだから注意ね。
商品の数だけ「RewriteRule～」を増やしていく。

以上。

導入にあたって

紐付け作業の自動化が不可能なんで、個別にリンクを用意するのは正直クソダルい。
導入するなら全ページに対応させるんじゃなくて、トップページとか商品一覧とか、特定の部分に限定したほうがいいと思う。人力で組み込んでる手前、しかも量がクソ多いんで、ミスったときの対応がつらすぎる。

スポンサーリンク

コメント

タイトルとURLをコピーしました