Tokurabo Takeout Menu for Square ガイド

Step by step

1. 最初の設定

最初に一度だけ行います。用意するのは、WordPress の管理画面に入るためのログインと、Square のアカウントのログインの2つです。

• 1プラグインを入れる

  WordPress の管理画面で プラグイン > 新規プラグインを追加 を開き、Tokurabo Takeout Menu で検索します。今すぐインストール を押し、続けて 有効化 を押します。

  プラグインのページは WordPress.org にあります（詳しい説明・変更履歴・サポートのフォーラム）。

  

• 2Square でアクセストークンを取る

  アクセストークンは、Takeout Menu が Square から商品情報を取得するための「鍵」のようなものです。取得するだけで、Square の登録情報を勝手に変えることはありません。

  1. Square Developer Console を開き、いつもの Square のアカウントでログインします。
  2. Applications の ＋ を押して、アプリケーションを作ります。すでにあれば、その Open を押して 4 へ進みます。
  3. Application name（アプリケーションの名前）を入力します。名前は何でもかまいません（例：「お店のサイト」）。利用規約にチェックを入れて Next（次へ）を押します。この画面は英語だけです。
  4. 質問の画面が2つ表示されます（What will you build first?・Find your audience）。どちらも Skip（飛ばす）で進めてかまいません。
  5. アプリケーションの Credentials の画面が開きます。画面の上の Production（本番）を押して切りかえます。初期状態では Sandbox（テスト用）になっています。
  6. Production access token をコピーします。

  アクセストークンはパスワードと同じように扱ってください。メールで送ったり、どこかに書きこんだりしないでください。貼りつけるのは WordPress の設定画面だけです。

• 3WordPress にトークンを貼りつける

  WordPress の管理画面の左のメニューから Takeout Menu を開きます。Service は Square、Environment（環境）は Production (your real store)（本番）を選びます。Access token（アクセストークン）にトークンを貼りつけて保存します。

  接続できると、Status（状態）に「Connected to お店の名前 (JP).」（お店の名前（JP）に接続しています。）と表示されます。JP は国の記号です。

  

• 4店舗とメニューを選ぶ

  Location（店舗）で、このサイトのお店（店舗）を選んで保存します。Square の店舗が1つだけのときは選ぶ欄は表示されず、その店舗が使われます。続けて Menus to show（表示するメニュー）で、サイトに表示したいメニューにチェックを入れ、もう一度保存します。

  ここに表示されるメニューは、Square データの 商品とサービス > メニュー で作ったものです。チェックしないメニューはサイトに表示されません。

  Square に作成されたメニューを選んで、そのメニューに登録された商品情報と同期します。必要な場合は Web サイト専用のメニューを Square で作成してください。

  

• 5同期して、メニューのページを作る

  Sync now（今すぐ同期）を押し、Done.（終わりました。）と表示されるまで待ちます。次に Create menu page（メニューのページを作る）を押すと、「Menu」という固定ページが作成されます。View page（ページを表示）で確認できます。

  

  サイトの上のメニュー（ナビゲーション）に表示するには、テーマのメニューの設定で追加してください（テーマによって 外観 > メニュー やサイトエディターなど）。

• 6値段と税の表示を確認する

  税率は Square のものを使います。Square データで税を作り、商品ごとにオンにしておいてください。WordPress で税率を入力する必要はありません。

  まだ税金のルールを登録していなければ、Square で次のように作ります（写真はアメリカの Square の画面です。日本の Square では画面の言葉が日本語になります）。

  1. Square で商品を開き、Taxes（税金）の Set up を押します。
  2. Set up Sales tax の Set up を押します。
  3. 商品の税のかかり方などの質問に答えて、Next（次へ）を押します。
  4. Name（名前）と Tax rate（税率）を入力し、Locations（店舗）を選んで Save（保存）を押します。
  5. 商品の画面に戻ると、Taxes に作成した税が表示されています。Save を押します。

  税金のルールの作り方は、国や Square の画面の変更によって違うことがあります。軽減税率（8%・10%）の設定など、詳しくは Square のヘルプ（消費税の設定・持ち帰りと店内飲食で税率を分けるルール）をご覧ください。このプラグインは、Square に設定した税をそのまま使います。

  Takeout Menu の設定画面の Prices（値段）の欄で、サイトでの値段の表示方法を選びます。初期値は、Square に登録したとおり（税込で登録なら税込、税抜で登録なら税抜）になっています。

  

  設定	選べるもの
  Item prices（商品の値段）	Tax included（税込）／Before tax, with the tax-included price（税抜・税込の値段も並べる。例：¥1,000 (¥1,100 incl. tax)）／Before tax（税抜）。Hide these prices on the menu（表示しない）にチェックすると、商品の値段を出しません。
  Option prices（カスタマイズの値段）	Tax included（税込）／Before tax（税抜）。カスタマイズの値段だけ出さないこともできます。
  Items with more than one tax（税率が複数設定されている商品）	Add them all（すべて足す。例：アメリカ・カナダ）／Use the lowest rate（いちばん低い税率を使う。例：日本の持ち帰り）／Use the highest rate（いちばん高い税率を使う。例：日本の店内飲食）

  Items with more than one tax は、Square で1つの商品に 8% と 10% の両方を付け、レジで持ち帰りか店内かを切りかえているお店のための設定です。お店に合うほうを選んでください。テイクアウトの案内なら Use the lowest rate（いちばん低い税率を使う。8%）、店内飲食だけのお店なら Use the highest rate（いちばん高い税率を使う。10%）が合うと思います。

  このプラグインで表示される税込の値段は目安です。お支払いの金額は、お会計時に改めてレジで計算する必要があります。複数の商品で計算すると、端数によっては合計に誤差が生じることがあります。

Everyday use

2. Square でメニューを変えたとき

Square で行った商品情報の変更は、1時間に1度の目安で、自動的に WordPress のサイトにも反映されます（通常のブロックに変換した商品は変わりません）。

いつサイトに反映される？

サイトは 1時間に1度の目安で Square を見に行き、自動で追いかけます。

すぐに反映したいとき（今日から値段を変える、など）は、WordPress の Takeout Menu を開いて Sync now（今すぐ同期）を押します。

メニューを新しく作ったとき

Square で新しく作ったメニューは、選ぶまでサイトに表示されません。Takeout Menu を開き、Menus to show（表示するメニュー）でチェックを入れて保存します。

商品を追加した時

Takeout Menu で設定した「メニュー」の中に商品を追加してください。表示していないメニューにしか入っていない商品は、サイトに表示されません。

商品の掲載を中止（非表示）にするとき

Square でその商品を Takeout Menu に設定されたメニューから外す（または削除する）と、次に同期されたタイミングで表示されなくなります。

ブログ記事等に商品カードを差し込む

記事の編集画面で Takeout Menu Item ブロックを追加し、商品を選びます。右の欄で差し込むカードの形（Cards・Wide・List）を選べます。差し込まれた商品カードの商品情報が Square で変更された場合、自動的にこちらの表示も新しくなります。

商品情報を固定する

通常は記事等にブロックで差し込まれた商品は Square に登録された情報と同期しますが、「通常のブロック」に変換することで、その時の内容で表示させたままにする事ができます。

1. 記事の中の商品のブロックを押します。
2. ブロックの上の帯の Convert（変換する）を押します。
3. Convert to regular blocks（通常のブロックに変換）の画面で、含めるものを選びます。Include prices（値段を含める。初期値はオン）・Include options（カスタマイズを含める。初期値はオフ）
4. Convert（変換する）を押します。

商品のブロックが、画像・見出し・段落になります。商品の写真はメディアライブラリにコピーされます。テキストも写真も自由に編集できます。

同期できたか確認するには

Takeout Menu の設定画面の Sync（同期）の欄に、前回の同期の時刻と、取り込んだメニュー・商品・写真の数が表示されます。

Advanced

3. 詳しい人向け（Web 制作の方へ）

ショートコード

ブロック

• Takeout Menu：メニュー全体。右の欄：Layout（レイアウト）＝Default（標準。設定画面のとおり）・Cards（カード）・List（リスト）
• Takeout Menu Item：商品1つ。右の欄：Item（商品。名前で探す）・Layout（レイアウト）＝Cards（カード）・Wide（横長）・List（リスト）

どちらもページを表示するたびにサーバーで中身を作るので、いつも最新の同期された内容が表示されます。

CSS で調整する

文字の種類や色はテーマのものを使います。変更したいときは、設定画面の Use the plugin styles（プラグインのスタイルを使う）をオフにして、CSS で修正してください。クラス名はすべて takeout-menu__ で始まります。

.takeout-menu__menu-name { }
.takeout-menu__section-name { }
.takeout-menu__item--card { }
.takeout-menu__item--list { }
.takeout-menu__item.is-sold-out { }

同期のしくみ

• メニューをプラグイン専用のテーブルにコピーし、WP-Cron で1時間ごとに同期します。1回の処理は20秒までに区切り、終わらなかった場合は約1分後に自動で続きを行います（サーバーのタイムアウトを避けるため）。
• 写真はサーバーに保存します（wp-content/uploads/tokurabo-takeout-menu/）。お客様のブラウザが Square に接続することはありません。
• WP-Cron はだれかがサイトを開いたときに動きます。アクセスの少ないサイトでは、WP-Cron を無効にして（DISABLE_WP_CRON）サーバーの cron から wp-cron.php を実行してもかまいません。プラグイン側の変更は不要です。
• Sync now（今すぐ同期）は WP-Cron を使わず、ブラウザ上で最後まで実行します。

困ったとき

ログの見方

詳しいエラーは、wp-config.php で WP_DEBUG_LOG を有効にしているときだけ wp-content/debug.log に書かれます。管理画面には短いメッセージだけを表示します。

プラグインを削除したとき

プラグインを削除すると、プラグインのテーブル・設定（トークンを含む）・同期の予約・保存した写真が削除されます。作成したメニューのページは削除しません。「削除」でなく「停止」しただけであれば、何も削除されません。