ドキュメント

BigCommerce セットアップ ガイド

weglot bigcommerce setup logo BigCommerce セットアップ ガイド

BigCommerceサイトとWeglotを統合して多言語化するためのステップ別ガイドです。

はじめに

Weglotを統合するには次の2つの方法があります。

  • Javascriptによる統合: 迅速で簡単な統合方法です。Javascript コードスニペットをコピーして、BigCommerceストアの適切な場所に貼り付けるだけです。 インストールに5分かかります。コーディング知識は必要ありません。
  • サブドメイン統合: 各ターゲット言語に対して専用のサブドメインを作成するので、SEO最適化に理想的な方法です。翻訳されたページは(fr.mysite.com) のような、独自のサブドメインが割り当てられます。インストールは最大15分です。DNSレコードにエントリを追加する必要があります (ここはテクニカルな所ですが、必要であれば私たちがサポートします)。

Javascriptの統合

1)Weglotアカウントを作成する

全翻訳を表示して管理する場所です。こちらでWeglotアカウントを作成するだけです。

bigcommerce-translate

2) 統合方法を選択する

メールアドレスを確認すると、Weglotの設定ページにアクセスできます。「Other possible integrations(その他の統合)」セクションまでスクロールし、「Use Javascript integration)Javascript 統合を使用)」をクリックします。

bigcommerce-javascript-select

3)言語を選択

ウェブサイトの元の言語(ウェブサイトを作成した言語)と翻訳先の言語を選択します。 

以下の例では、ウェブサイトの元の言語は英語で、フランス語に翻訳されます。

「Next」をクリックします。

bigcommerce-java-languages

4) コードをコピーする

コピーするJavaScriptコード スニペットが表示されます。

javacode-bigcommerce

5)コードを貼り付ける

お持ちのBigCommerceアドミン内で、をクリックし、Storefront > Script Manager,に移動し、「Create Script(スクリプトの作成)」をクリックします。 

必要な名前と説明を入力します。次に、指定されたフィールドに次のように入力します。

  • “Location on Page” = “Head”
  • “Select pages where script will be added” = “All pages”
  • “Script type” = “Script”
  • “Script Content” = ここにWeglotアカウントからコードスニペットを貼り付けます。

最後に、[Save(保存)] をクリックします。

weglot bigcommerce setup 3

6)完了です!

すべて完了です。ウェブサイトに移動してページを更新すると、右下に言語スイッチャーボタンが表示されます。 

言語を変更してみてください、あなたのウェブサイトに自動翻訳が表示されます。

weglot bigcommerce setup example

7) オプション – 翻訳を編集する

すべての翻訳は、Weglotアカウントの「Translations(翻訳)」の内にあります。

ここでは、すべての翻訳を表示し、手動で変更することが可能です。

edit-translation-bigcommerce

サブドメインによる統合

前提として

この統合方法では、ウェブサイトドメインのDNSレコードにアクセスする必要があるため、すでに自分のドメイン名を購入している必要があります。ドメイン名をまだ購入していない場合は、この統合方法を選択しないでください。 

1)Weglotアカウントを作成する

全翻訳を表示して管理する場所です。こちらでWeglotアカウントを作成するだけです。

bigcommerce-translate

2)言語を選択

メールを検証すると、Weglotの設定ページに到着します。ウェブサイトのURLを入力します (mywebsite.comのように、独自のドメイン名を入力する必要があります)。

次に、ウェブサイトの元の言語(ウェブサイトを作成した言語)と翻訳先の言語を選択します。 

以下の例では、ウェブサイトの元の言語は英語で、フランス語に翻訳されます。

「Next」をクリックします。

bigcommerce-translate-site

3) DNS レコードを入力する

DNSレコードゾーンに表示されるDNSレコードを入力します。ドメインを購入したところによりますが、レコードの確認は、次の2つの場所のどちらかで確認できるはずです。

  • ドメイン名を直接購入した場合は、BigCommerceをクリックすると、[Server Settings(サーバー設定)] > [Email & DNS Records(電子メールと DNS レコード)] で、DNSレコードが表示されます。
  • 外部プロバイダー (GoDaddy、1&1、Gandhi などのサイトを含む) からドメイン名を購入した場合は、DNSレコードは、各プロバイダーのWebサイトのダッシュボードに保存されます。

DNSレコードの検索または更新についてサポートが必要な場合は、support@weglot.comまでメールを送信ください。たBigCommerceアドミンへのアクセスコードを共有いただければ、全て私たちで代行します。

dns-unchecked-bigcommerce

4) DNSを認証する

DNSを入力したら、[Check DNS(DNS の確認)] をクリックします。数分後、ページの右側に緑色のチェックマークが表示されます。これが表示されない場合は、DNS レコードを正しく入力できていないので、もう一度やり直す必要があります。 

すべてのDNS エントリにこの緑のチェック マークが付いたら、[NExt(次へ)] をクリックします。

dns-checked-bigcommerce

5)JAVASCRIPTスニペットをコピー/貼り付けする

これでサブドメインが設定され、数分で設定が完了します。その間に、ウェブサイトのコードにWeglot Javascriptライブラリを追加する必要があります。Weglot アカウントで表示される Javascript コード スニペットをコピーします (下のスクリーンショットのコードのように表示されます)。

jscode-bigcommerce

お持ちのBigCommerceアドミン内で、Storefront(ストアフロント )> Script Manager(スクリプトマネージャ)に移動し、「Create Script(スクリプトの作成)」をクリックします。 

必要な名前と説明を入力し、残りのフィールドに次のように入力します。

  • “Location on Page” = “Head”
  • “Select pages where script will be added” = “All pages”
  • “Script type” = “Script”
  • “Script Content” = ここにWeglotアカウントからコードスニペットを貼り付けます。

最後に、[Save(保存)] をクリックします。

weglot bigcommerce setup 3

6)完了です!

すべて完了です。今すぐウェブサイトに移動して、ページを更新してみましょう。言語切り替えボタンが右下に表示されます。 

weglot bigcommerce setup example

言語を変更してみてください、ウェブサイトで自動翻訳が表示されるはずです!

7) オプション – 翻訳を編集する

すべての翻訳は、Weglotアカウントの「Translations(翻訳)」の内にあります。

ここで全翻訳を変更することができます。

edit-translation-bigcommerce
お気軽にご連絡ください
ご質問はありませんか? support@weglot.com までお気軽にお問い合わせください。お待ちしております。