BLOG

フォーム・ドメイン

【2026年版】Studioの多言語対応のやり方|日英サイトを作る4つの方法とhreflangの入れ方

2026.09.24 公開 / 編集長:松永 勇樹

← ブログ一覧へ戻る

公開 2026.09.24 編集長:松永 勇樹(ノーコードサロン代表) 読了 約12分

【2026年版】Studioの多言語対応のやり方|日英サイトを作る4つの方法とhreflangの入れ方

「英語版のページも用意してほしい」と頼まれて、Studioの設定画面を探しても、言語を切り替える専用の項目は見つかりません。翻訳プラグインを入れればよいのか、ページを複製すればよいのか、URLは /en/ と en. のどちらにするのか。調べ始めると選択肢が多く、手が止まりがちです。書き手は、国内最大級のStudio学習コミュニティ「ノーコードサロン」を1年半以上にわたって運営しています。Studio公式ヘルプとGoogleの公式ドキュメントで確かめた仕様だけを使い、方法の選び方と手順を整理します。

この記事の要点

  • Studioに公式の多言語化機能はありません(2026年9月時点)。公式ヘルプは、実現方法として4つの事例を紹介しています。1つのプロジェクト内でページを分ける、サブドメインで公開する、カスタムプロキシでつなぐ、外部の翻訳サービスを使う、の4つです。
  • 小規模なサイトなら、1つのプロジェクトに example.com/en/ の英語ページを作る方法が最も安く済みます。日英でページ数が倍になるので、プランのページ数上限を先に数えてください。
  • Studioの「言語設定」は使用言語を明示するだけで、翻訳はしません。日本語版と英語版の対応を検索エンジンに伝えるhreflangは、有料プランのカスタムコードでページごとに入れます。

結論:専用機能はないので、4つの方法から選ぶ

Studioの公式ヘルプ「Studioで多言語サイトを作成したい」(2026年5月8日更新)には、多言語化の専用機能はないと明記されています。そのうえで、多言語サイトを作った事例として次の4つが紹介されています。

方法英語版のURLの例必要なもの
1. 1つのプロジェクト内に言語別のページを作るexample.com/en/両言語のページ数がプランの上限に収まること
2. 言語ごとにプロジェクトを分け、サブドメインで公開するen.example.com言語の数だけ有料プランのプロジェクト、独自ドメイン
3. 言語ごとにプロジェクトを分け、サブディレクトリでつなぐexample.com/en/Business Plus以上のプロジェクト、独自ドメイン、カスタムプロキシの追加契約
4. 外部のWebサイト翻訳サービスを使うツールによって異なるカスタムコードまたはカスタムプロキシ

ヘルプでは、方法1が最もコストを抑えられる方法だと説明されています。一方で、ページ数をプランの上限内に収める必要があるなど、運用上の課題が出る可能性にも触れています。個人や小規模事業者のサイトなら、まず方法1で足りるかを考えるのが近道です。

なお、どの方法もStudioのサポート窓口では個別の解説や、使うサービスの選定相談は受け付けていません。Enterpriseプランの一部プランに限り、外部翻訳ツールやカスタムプロキシについて相談できる、とヘルプに書かれています。

方法1:1つのプロジェクトに英語ページを作る手順

日本語のサイトに英語ページを足す場合を例に、手順を4つに分けて説明します。

手順1:ページ数を数えて、プランの上限を確かめる

日英の2言語にすると、ページ数はおおむね2倍になります。料金プランのページで確認できる上限は次のとおりです(2026年9月24日時点)。

  • Free:50ページ
  • Mini:2ページ+404ページ
  • Personal:150ページ
  • Business/Business Plus:300ページ
  • Enterprise:無制限

Miniは2ページまでなので、日英のサイトには向きません。後で説明するhreflangを入れるカスタムコードも有料プラン向けの機能です。プランごとの違いはStudioの料金プランの解説で全体を見ておくと選びやすくなります。

手順2:英語ページのパスを en/ から始める

日本語のページを複製し、英語に書き換えて英語ページを作ります。ページのパスは en/about のように、先頭を en/ にそろえてください。Studioでは、パスにスラッシュを入れると、スラッシュより前の文字列が同じページが自動でディレクトリにまとめられます。ページリストの上でも英語ページがひとまとまりになり、管理しやすくなります。

手順3:英語ページの「言語設定」を英語にする

Studioの言語設定は、サイト全体とページごとの両方で指定できます。ページの設定のほうが優先されます。ヘルプでは、大部分が日本語ならサイト設定を日本語にする方法が案内されています。そのうえで、英語のページだけをページ設定で英語にすると効率的です。

設定するときは、要素を何も選んでいない状態で右パネルを開きます。ページごとの設定は[ページ]タブ、サイト全体は[サイト]タブです。パネルをスクロールした先の[言語設定]で言語を選びます。公開中のサイトなら、サイトを更新して反映させてください。

この設定は使用言語を明示するためのもので、自動で翻訳する機能ではありません。Studio公式のチェックリストでは、ページの言語(lang属性)の設定はアクセシビリティの項目として挙げられています。

手順4:ヘッダーかフッターに言語の切り替えリンクを置く

最後に、日本語版と英語版を行き来できるリンクをヘッダーやフッターに置きます。英語のトップへ飛ばすより、いま見ているページの英語版へつなぐほうが、訪問者は迷いません。ブラウザの言語を見て自動で英語ページへ転送する作りは、Googleが避けるよう案内しています。切り替えは、訪問者が自分で選べるリンクにしておくのが安全です。

CMSのブログやお知らせも訳す場合

CMSのブログやお知らせも英語にするなら、モデル数と公開アイテム数の上限にも注意が必要です。言語ごとにモデルを分けると、その分だけモデルを使います。アクティブなモデル数の上限は、2026年9月24日時点でPersonalが5件、Businessが10件です。モデルの分け方はStudio CMSのモデルの作り方と設計のコツを読んでから決めると、後で作り直さずに済みます。

検索エンジンに言語版の対応を伝える:hreflangの入れ方

日英のページを作っただけでは、2つが同じ内容の言語違いだと検索エンジンに伝わりません。それを伝えるのがhreflangです。Studioの多言語化のヘルプにはhreflangを自動で出力する案内がないため、カスタムコードで入れます。

Googleが決めているhreflangのルール

Googleの公式ドキュメントでは、hreflangを使うときのルールが次のように示されています。

  • 言語ごとに別のURLを用意する。Cookieやブラウザの設定で表示を切り替える作りは勧めていない
  • それぞれの言語版に、自分自身を含むすべての言語版を列挙する
  • 2つのページが互いに参照し合っていないと、そのタグは無視される
  • どの言語にも当てはまらない訪問者向けに、x-default を指定できる

また、GoogleはhreflangやHTMLのlang属性でページの言語を判定しない、とも書かれています。Studioの言語設定は支援技術のため、hreflangは言語版どうしの対応を伝えるため、と役割を分けて考えてください。

Studioのカスタムコードに入れる

カスタムコードは有料プランの機能です。ページごとの設定の中にある「<head> 内の末尾」の欄に書き込みます。この欄に書けるのは link・meta・style・script・noscript の5種類です。hreflangの link タグはここに入ります。

たとえば example.com/about と example.com/en/about を対応させるなら、両方のページに次の3行を入れます。

  • <link rel="alternate" hreflang="ja" href="https://example.com/about">
  • <link rel="alternate" hreflang="en" href="https://example.com/en/about">
  • <link rel="alternate" hreflang="x-default" href="https://example.com/about">

書いたURLは、実際に公開しているURLと一字一句そろえます。独自ドメインやURLの表記がまだ固まっていないなら、先に公開するドメインを決めてから書き込んでください。

CMSの詳細ページは、1つのページ設定で多数の記事を表示します。この場合は <head> 内のカスタムコードに、CMSプロパティやURL変数を差し込めます。<body> 内の欄では、この動的な値は展開されません。

入れたあとに確かめること

カスタムコードは、デザインエディタやライブプレビューでは動きません。サイトを更新したうえで、公開中のページのソースを開き、link タグが出ているかを見てください。

ヘルプには、ページ設定が未入力のページにはサイト設定が適用され、ページ設定が優先されるとあります。サイト全体に計測タグなどを入れているなら、ページ側にhreflangを入れたあと、公開ページで両方が出ているか確かめてください。検索まわりの設定全体はStudioのSEO対策の設定手順もあわせて見直してください。

hreflangを入れてはみたものの、この書き方で合っているのか自信が持てない。

ノーコードサロンなら、公開ページのURLやカスタムコードの画面を貼って、チャットで質問・相談できます。ページの複製から言語設定、カスタムコードまで、どこで詰まっても同じ場所で聞けます。 まずは1ヶ月間参加してみるplay_arrow

方法2〜4を選ぶときの注意点

方法1で収まらない場合や、言語ごとに別の担当者が運用したい場合は、ほかの3つの方法を検討します。それぞれ、公式ヘルプに書かれている条件と注意点をまとめます。

方法2:サブドメインで公開する

言語ごとにプロジェクトを作り、英語版を en.example.com などで公開する方法です。各言語は独立したWebサイトとして扱われるため、SEOの評価やアクセス解析も言語ごとに別々に対応する必要があります。言語の数だけ有料プランの契約が必要で、独自ドメインも用意します。

接続は、公開パネルの[独自ドメイン設定]でサブドメインを入力して始めます。表示されたAレコードを、ドメイン側に登録する流れです。ドメイン設定の全体像はStudioの独自ドメイン設定の手順で確認できます。

方法3:カスタムプロキシでサブディレクトリにつなぐ

英語版を別プロジェクトで作り、カスタムプロキシでメインサイトの /en/ として見せる方法です。メインサイトの下層として扱えるので、SEOの評価やアクセス解析を一元的に管理できます。ただし条件は重くなります。

  • 各プロジェクトがBusiness Plus以上(またはEnterprise)であること
  • カスタムプロキシのアドオンを追加契約すること(2026年9月24日時点で月額39,800円・税込)
  • AWSやCloudflareなどで、プロキシサーバーを自分で用意して設定すること

ヘルプでも、カスタムプロキシは高度なオプションだと注意されています。プロキシサーバーの運用やネットワークの知識が必要です。Studioの標準仕様では、既存サイトのサブディレクトリ直下にStudioサイトを公開することはできません。「/en/ にしたいから別プロジェクトで」と気軽に選ぶと、ここで行き詰まります。

方法4:外部の翻訳サービスを使う

外部のWebサイト翻訳サービスを、カスタムコードかカスタムプロキシで組み込む方法です。ヘルプでは、特定のツールを公式として推奨したり、連携を保証したりはしていないと明記されています。使うツールや組み込み方によって、ページの生成のされ方も変わります。

選ぶときは、翻訳されたページが言語ごとに別のURLで表示されるかを確かめてください。Googleは言語版ごとに別のURLを使うことを勧めています。同じURLのまま表示だけを切り替える作りでは、hreflangで対応関係を伝えることもできません。

よくある質問

Q1Studioに自動翻訳の機能はありますか?

ありません。Studioの「言語設定」は、そのページが何語で書かれているかを明示する機能で、内容を翻訳するものではありません。公式ヘルプ(2026年5月8日更新)でも、多言語化の専用機能は提供していないと案内されています。翻訳は自分で行うか、外部の翻訳サービスを組み込むことになります。

Q2無料プランでも多言語サイトは作れますか?

Freeプランでも50ページまで作れるので、英語ページを並べること自体はできます。ただし、独自ドメインでの公開とカスタムコードは有料プランの機能です。hreflangを入れられないため、検索エンジンに言語版の対応を伝えられません。公開して運用するなら、有料プランを前提に考えてください。

Q3英語版のURLは /en/ と en. のどちらがよいですか?

Googleは、サブディレクトリ(/en/)もサブドメイン(en.)も選択肢として挙げています。Studioの場合は、/en/ にするなら1つのプロジェクト内で作るのが基本です。別プロジェクトのまま /en/ にするにはカスタムプロキシが必要になります。言語ごとに独立して運用したいなら、サブドメインのほうが設定は簡単です。

Q4ブラウザの言語に合わせて、自動で英語ページに転送してよいですか?

Googleは、ある言語版から別の言語版へ訪問者を自動で転送することは避けるよう案内しています。自動で転送すると、訪問者や検索エンジンがすべての言語版を見られなくなる場合があるからです。ヘッダーやフッターに切り替えリンクを置き、訪問者が自分で選べるようにしておきましょう。

まとめ

Studioには多言語化の専用機能がないため、公式ヘルプが紹介する4つの方法から選びます。小規模なサイトなら、1つのプロジェクトに en/ から始まる英語ページを作る方法が、費用も手間も少なく済みます。英語ページは言語設定を英語にします。hreflangは有料プランのカスタムコードで、互いに参照し合う形で入れてください。言語設定は言語の明示、hreflangは言語版の対応づけと、役割が違う点を押さえておけば迷いません。サブドメインやカスタムプロキシは、SEOや解析をどう管理したいか、予算と技術の体制があるかで判断します。

多言語サイトは、ページの複製、言語設定、カスタムコード、ドメインと、確かめる場所があちこちに散らばります。ノーコードサロンでは、Studioの実装で詰まったところをチャットで質問・相談できます。公開前に「この設定で合っているか」を誰かに見てもらえるだけで、作業はずっと進めやすくなります。

この記事をシェアする

この記事を書いた人

松永勇樹(ノーコードサロン編集長)

編集長

松永 勇樹

ノーコードサロン代表 / Studioエキスパート

Studioエキスパートとして300件以上の指導経験を持つ。 150名以上が参加する月額制コミュニティ「ノーコードサロン」代表。 制作の現場で実際に詰まったところと、その解き方を記事にしています。

最終更新:2026.09.24

NO CODE SALON

つまずいたところを、その日のうちに聞ける場所へ

ノーコードサロンは、Studioで実際に手を動かしている人が集まる月額制コミュニティです。
いま開いている画面のスクリーンショットを貼って、そのまま質問できます。

まずは1ヶ月参加してみる

月額 2,980円〜/入会金0円・いつでも退会できます

まずは1ヶ月間参加してみるplay_arrow