【STORES】商品ページと商品登録ページを行き来できるブックマークレットで商品ページの編集を簡単に


  • 公開:
  • 更新:
  • 編集:
概要 ▶ STORESのオンラインショップ構築にブックマークレットを使うことで、効率的な商品編集ができます
【STORES】商品ページと商品登録ページを行き来できるブックマークレットで商品ページの編集を簡単に

STORESでショップを構築している時にこう思うことってありませんか?

  • 「今見ている商品ページの商品名や情報を直したい」
  • 「管理画面から特定の商品ページをすぐに確認したい」

ところが標準の機能ではこれができません。面倒ですね。


なので作っちゃいました、ブックマークレット。


ブックマークレットは表示しているページで自分で用意したプログラムを動かすための仕組みです。

ブックマークレットがわからない方は以下のページをご覧ください。

目次 [ 隠す ]
Loading...

商品ページと編集ページを行き来するブックマークレットの動作原理

STORESの商品のURLと管理画面(ダッシュボード)の商品登録(商品編集)のURLは非常に似ています。

例えば以下の商品があったとします。

https://sokana.shop/items/5fe3f4be4f4430095a9b6060

管理画面(ダッシュボード)の商品登録のURLは

https://dashboard.stores.jp/items/5fe3f4be4f4430095a9b6060

となります。

URLを見比べてみると、ドメインの部分だけが違うだけですね。


つまりURLのドメインの部分を入れ替えてあげれば、商品ページと商品登録ページを行き来できるようになるというわけです。


商品ページと商品登録ページを行き来できるブックマークレット

ブックマークバーなどに適当なページをブックマークします。

そのブックマークのURLを以下の「javascript:…」の内容に変更します。

javascript:(function(){var a=document.URL;a.match(/●STORESでのショップのアドレス●/)?location.href=a.replace(/●STORESでのショップのアドレス●/,"dashboard.stores.jp"):location.href=a.replace(/dashboard\.stores\.jp/,"●STORESでのショップのアドレス●")})();


「●STORESでのショップのアドレス●」部分は、STORESで構築しているショップのアドレス(http://を除いた部分)を入れます。

例えば「https://example.stores.jp」というアドレスでショップを構築しているのであれば「example.stores.jp」を入れます。

厳密には「.」は「\.」なのでしょうけど、そこまで厳密にしなくても良いかなと…ショップの管理者しか使わないですし…。あと https://example.stores.jp/ ってサンプルとして用意されているんだな…(笑)。

javascript:(function(){var a=document.URL;a.match(/example.stores.jp/)?location.href=a.replace(/example.stores.jp/,"dashboard.stores.jp"):location.href=a.replace(/dashboard\.stores\.jp/,"example.stores.jp")})();


ブックマークレットの使い方

使い方は簡単です。

見ている商品ページを変更したい場合

  1. 編集したい商品ページを開きます
  2. ブックマークレットをクリックします
  3. 自動的に商品ページの登録画面が開きます


管理画面から特定の商品ページを確認したい場合

  1. 管理画面(ダッシュボード)で「アイテム」の一覧から、確認したいアイテムを開きます
  2. ブックマークレットをクリックします
  3. ショップとして公開されている商品ページ(お客様が見ている商品ページ)が自動で開きます


このブックマークレットを使ってSTORESのオンラインショップ構築をより効率的に行いましょう!

それでは。

カテゴリー:

このページをぜひシェアしてください