Shopifyで日本語URLをメニューに登録する方法｜Googleスプレットシートを用いた効率的な設定手順【初心者向け】

Shopifyでメニュー機能を使う方法

メニューの登録・編集については以下の記事で解説しています。

日本語URLを登録するには日本語部分をURLエンコード（パーセントコード）に変換する！

日本語部分をURLエンコード（パーセントコード）に変換することで登録をすることができます。

URLエンコード（パーセントコード）とは

URLに含まれ特定の文字を、HTTPプロトコルで使用可能な文字に変換する手法。
URLにスペースや日本語などの非ASCII文字が含まれる場合に、％記号と2桁の16新数（ASCIIコード）でエンコードされます。

URLエンコードの方法

URLエンコードを手動で行うのは手間がかかるため、ツールやプログラムを使用して自動的にエンコードするのが一般的です。

▼オンラインツール
URLエンコード・デコード｜日本語URLをサクッと変換 | すぐに使える便利なWEBツール | Tech-Unlimited

変換したい文字をツールで変換してからURLを設定できます。
※URLをエンコードするとhttps://〜の「:」「/」がエンコードされてしまうため注意

Googleスプレットシートを用いてURLエンコードの効率化と一覧化

Googleスプレットシートを用いて効率的にURLエンコードと一覧にする方法を紹介をします。
メニューは複数作成できるため、一覧にして保存しておくことで、毎回オンラインツールを使用する必要がなくなります。

Googleスプレットシートを作成する方法

ブログのタグをURLで指定する場合で紹介します。

作成手順

1. GoogleA列にブログカテゴリハンドルを入力
2. B列にタグ名を入力
3. C列で「A列の文字」と「ENCODEURL関数でエンコードしたB列の文字」を結合する
4. C列をコピーしてメニューのURLに入力する

ENCODEURL関数でエンコードする

="blogs/"&A1&"/tagged/"&ENCODEURL($B1)

上記のコードをC列に入力する。
これを設定するだけでA列とB列を入力するだけでC列にURLが表示されます！

※注意
A列のブログカテゴリハンドルはURLセーフ文字で設定されている前提となります。
カテゴリハンドルをURLセーフ文字以外で設定している場合、URLハンドルを変更するか、こちらもURLエンコードする必要があります。

別タブでカテゴリハンドルを管理してもっとわかりやすく

A列に毎回ブログハンドルを入れるのは大変。。
なので、ブログ名を選択するとブログハンドルが表示できるように変更しましょう。
VLOOKUP関数を用いることでさらに便利にすることができます！

作成手順

1. カテゴリ用のタブを作成する
2. カテゴリ用タブのA列にブログ名を入力
3. カテゴリ用タブのB列にブログハンドルを入力
4. URL一覧用タブに移動してA列にデータを埋め込む
5. C列で「A列の文字を用いて取得したハンドル」と「ENCODEURL関数でエンコードしたB列の文字」を結合する
6. C列をコピーしてメニューのURLに入力する

カテゴリ用のタブを作成する

新しくカテゴリ用のタブを作成します。
このタブ名はVLOOKUP関数で使用します。

カテゴリ用タブにカテゴリ名とカテゴリハンドルを入力して、一覧用タブで表示をする

A列にカテゴリ名、B列にカテゴリハンドルを入力します。
データの入力規則を用いてプルダウンを作成する。

1. A列を選択する
2. データを開いて、データの入力規則をクリック
3. ルールを追加します。

1. 条件を「プルダウン（範囲内）」に変更
2. ②をクリックすると④を表示する
3. カテゴリ用タグに移動します。
4. ⑤をクリックした後、A列を選択
5. プルダウンを作成することができます。

VLOOKUP関数でブログハンドルを取得、ENCODEURL関数でエンコードする

="blogs/"&VLOOKUP($A1,'カテゴリ'!$A$1:$B,2,false)&"/tagged/"&ENCODEURL($B1)

上記のコードをC列に入力する。
A列でブログカテゴリを選択、B列でブログタグを入力するとC列にURLが出力されます。
これでサイト運営者が変わっても簡単にエンコードできます！

ブログハンドルが増えた場合

カテゴリ用タブに追加するだけで、プルダウンの選択肢が自動で増えます！
ハンドルを別で管理することで運用負担を減らせます。

まとめ

いかがでしたでしょうか。【Shopify】日本語URLをメニューで登録する方法と効率化についてご紹介しました。
リンクを整理して、ユーザーフレンドリーで回遊しやすいサイトを作りましょう。