Webflow で作成したウェブサイトを翻訳し、多言語化しよう

Weglot で、Webflow で作成されたウェブサイトを翻訳し、多言語化することができます。

多くの方が、Webflow で作成したウェブサイトの多言語化に苦労しています。Webflow はサイト全体の翻訳をするソリューションを提供していないため、一般的にユーザーはページを新しくマニュアル作成するか、サイトを複製して翻訳したりしています。

ここでの問題は、これらの方法はSEOに適していないということです(これらの方法で翻訳されたページは、検索結果にうまく表示されないか、もしくは全く表示されません)。さらに、サイトを維持するに多くの時間と労力が必要になってしまいます。

Weglot は、この問題を簡単に解決する方法を提供したいと考えました。Weglot を使えば、Webflow ユーザーは、簡単に自分のウェブサイトを翻訳し、多言語化することができます。

Weglotのメリット

早くて簡単:コーディングを行う必要がなく、数分で完了


ボタン1つで完了:ウェブサイト上のすべてのコンテンツが自動的に検出され、翻訳されます


SEOに沿った翻訳: Webflow ウェブサイトは、個別のサブドメインを介して、どんな言語でも検索結果に正しくに表示されます。


翻訳ツール:Weglotでは、まず超高速の自動翻訳でまず全翻訳を完了させ、その次にプロの翻訳者に翻訳レビューを依頼することができます。あなたのWeglotダッシュボード上ですぐに注文できます


ボーナス:あなたが必要なときにいつでもサポート。一流のエキスパートたちがサポートチームで対応

Weglot dancing character

Webflow ウェブサイトを翻訳した例

自分で試す前に、Webflow を翻訳した事例をこちらから確認できます。またビッグブルーを見てみてください - Weglot を活用しているWebflow のユーザーです!

Demo website with Weglot and Webflow

In the example, we integrated the language-switch button into the main menu bar, as a dropdown. You can click on it to change the language from English to French.

英語版はhttps://www.weglot-translate-wbflow.com
フランス語版はhttps://fr.weglot-translate-wbflow.com

We’ve even created our very own Webflow UI Kit with 14 language switchers available to clone and 2 tutorial videos to help you get Webflow multilingual up and running!

Webflow ウェブサイトの翻訳を始めよう

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

すべての翻訳を管理および編集するためにWeglotアカウントが必要になります。Weglot アカウントを作成します。

Webflow-signup

2) 追加する言語の設定

アカウントを設定したら、ドメイン名、サイトの元の言語(母国語)、追加する言語(翻訳先の言語)を追加するよう求められます。

webflow-languages

注:この手順は、一時的なドメインネームではなくプライマリドメインネームを使用しているユーザーを対象にしています。 Webflow .io.サイトのテスト段階でドメイン名をまだ購入していない場合は、「Javascript 統合を使用する」をクリックします。ドメインは後で追加できます。

「次へ」ボタンをクリックします。

3) DNSレコード内のサブドメインを設定

次の手順では、DNS レコードを構成してサブドメインを作成して接続します。この設定が完了すると、Webflow ウェブサイトのサブドメインに翻訳されたコンテンツが表示されます。

この例では、Google Domains をドメインプロバイダとして使用しています。もし、このステップでサポートが必要な場合は、support@weglot.comまでお問い合わせください。

Weglot アカウントをセットアップすると、追加するDNS エントリが次のように表示されます (この例はフランス語の設定です)。

ここで、ドメインプロバイダアカウントにアクセスし、DNS を管理できるセクションやページに移動します (たとえば、Google Domains では、左側のメニュー バーの [DNS] というタブの下にあります)。

アカウントの DNS セクションに新しいエントリを作成します (この例では、「カスタム リソース レコード」セクションにあります)。エントリのタイプとして CNAME を選択します。[名前] セクションの下にフランス語を追加する場合は「fr」、データセクションの下に「websites.weglot.com」と入力します。

エントリを保存し、Weglot ダッシュボードに戻り、緑色の [DNS の確認] ボタンをクリックします。これは数分または10分かかる場合がありますので、緑色のティックがすぐにDNSレコードの横に表示されなかったとしても驚かないでくださいね!

4) Javascript コードを追加する

Webflow ウェブサイトに言語スイッチャーボタンを追加します。

  • Webflow の管理ページに行き、[設定] > [カスタム コード] (右側の最後のタブ) をクリックします。
  • Go to “Head Code”, and you should see a field that’s titled “Add code at the end of the <head> tag:”
Webflow translate JavaScript snippet
  • Weglot アカウントに提供されている JavaScript スニペットをコピー&ペーストします。次のようになりますが、"YOUR_API_KEY" とあるプレースホルダーの代わりに、実際の API キーを追加する必要があります。
HTML

緑色のボタンをクリックして"Save Changes(変更を保存)"、右上の青いボタンをクリックして変更を公開します。

5)Webflow ウェブサイトが多言語化され、公開されました!

これで完了です。ウェブサイトにアクセスすると、右下に言語変換ボタンが追加されています。サブドメインが適切に設定されていることを確認するために、数分待ち、言語を変更してみると、新しく翻訳されたページが表示されます。

ボーナス:私たちは Webflow UI キットを作成しました。Webflow ウェブサイトにコピー&ペーストで追加できる言語変換ボタンです!ぜひチェックしてください。

さぁ、始めましょう。
Webflow ウェブサイトを、今すぐ多言語化させよう