LikePay Academyが「スーパーサイトAcademy」に変わりました。詳しくはこちらです。

ステージング・サブドメイン

Webflowステージングサブドメインの使用方法を学ぶ

この投稿は公式のWebflow Universityを元に作成しました。翻訳したテキストと画像は引用元のものを使用する場合があります。引用元はこちらです。

サイトを公開できるドメインには2つのタイプがあります:Webflowステージングサブドメイン(例:yoursite.webflow.io)とカスタムドメイン(例:yourdomain.com)。Webflowステージングサブドメインは、カスタムコードをテストし、サイトのデザインを公開前にカスタムドメインにプッシュする前に承認を得るのに役立ちます。

このレッスンで学ぶこと

ステージングサブドメインを編集する方法

サブドメインは、Site settings > Publishing タブ > Staging の下で編集できます。

注意: サイトのサブドメインを変更する場合、ステージングサブドメイン(例:yoursite.webflow.io)とサイトの読み取り専用リンクの両方が即座に置き換えられます。以前共有した読み取り専用リンクはもはや機能しません。

ステージングサブドメインに公開する方法

カスタムドメインに公開せずにサイトをステージングサブドメインに公開する

  1. Designer でサイトを開くか、 Site settings に移動します。
  2. Publish をクリックします。
  3. Webflow ステージングサブドメイン(例:yoursite.webflow.io)をチェックします。
  4. カスタムドメインのチェックを外します。
  5. Publish to select domains をクリックします。
重要: エディタから公開する場合、サイトは Webflow.io ステージングサブドメインと、サイトに追加したカスタムドメインに公開されます。ステージングサブドメインに変更を公開するには、デザイナーまたはサイト設定からサイトを公開してください。

ステージングサブドメインのクッキーの動作方法

2023年4月に、Webflow ステージングドメインをPublic suffix listに提出しました。これにより、ステージングドメインに公開されたウェブサイトのセキュリティと発見性が向上しました。

2023年6月から、この変更により、webflow.io で終わるURLのアナリティクスクッキーもリセットされます。あなたのサイトがカスタムドメインに公開されていない場合、つまり Webflow ステージングサブドメインにのみ公開されている場合、2023年6月にサイトのアナリティクスクッキーはリセットされます。これは、サイトのアナリティクスツール(Google Analytics、Google Optimize、Facebook Pixel など)のクッキーがリセットされ、既存の訪問者がクッキーのリセット後にサイトに戻ってきても、最初の訪問時に「戻ってきた訪問者」として認識されなくなることを意味します。

ステージングサブドメイン上のサイトのクッキーを保持したい場合、以下のスクリプトをサイトに追加できます:

// get all cookie names
function getCookieNames() {
 return document.cookie.split(';').map(c => c.trim().split('=')[0]);
}

// cookies to update
const COOKIES_TO_UPDATE = [
 // these are examples. You will likely want to run `getCookieNames()`
 // to see what you are using on your site to determine which cookies
 // to include in this list
 '_ga',
 '_fbp',
];

(function() {
 const psl = '_psl';
 const pslValue = getCookie(psl);
 // we set pslValue to `1` after migrating, so this guard ensures we
 // don't touch an already migrated cookie
 if (pslValue == '') {
   return;
 }

 function setCookie(name, value, days) {
   const d = new Date();
   d.setTime(d.getTime() + (days * 24 * 60 * 60 * 1000));
   const expires = 'expires=' + d.toUTCString();

   document.cookie = name + '=' + value + ';' + expires + ';path=/';
 }

 function getCookie(cname) {
   const decodedCookie = decodeURIComponent(document.cookie);
   const name = cname + '=';
   const ca = decodedCookie.split(';');
   for (let i = 0; i < ca.length; i++) {
     let c = ca[i];
     while (c.charAt(0) == ' ') {
       c = c.substring(1);
     }
     if (c.indexOf(name) == 0) {
       return c.substring(name.length, c.length);
     }
   }
   return '';
 }

 function resetCookieToSubdomain(name) {
   const value = getCookie(name);
   if (value != '') {
     setCookie(name, value, 365);
   }
 }

 // Run the cookie rescoping migration
 COOKIES_TO_UPDATE.forEach(resetCookieToSubdomain);
 setCookie(psl, '1');
})();

プライベートステージングの有効化および無効化方法

Webflowのエンタープライズ顧客およびエンタープライズパートナーは、サイトでプライベートステージングを有効にする機能を持っています。プライベートステージングを有効にすると、サイトの更新を一般公開前に誰が見ることができるかを制御できるようになります。

サイトでプライベートステージングが有効になっている場合、ステージングサブドメイン(yoursite.webflow.io)でサイトにアクセスするには認証が必要です。これにより、ログインしているWorkspaceメンバーやサイトへのアクセス権を持つゲストだけがステージングサブドメインでサイトを表示できるようになります。また、チームがワークスペース用にシングルサインオン(SSO)を設定している場合、プライベートステージングへのアクセスにも必要です。

注意:プライベートステージングを有効または無効にするには、サイトを公開した後にのみ適用されます。

サイトでプライベートステージングを有効にするには:

  1. Site settings > Publishing タブ > Stagingに移動します。
  2. Make staging privateのトグルスイッチをオンに切り替えます。
  3. サイトをPublishします。

サイトでプライベートステージングを無効にするには:

  1. Site settings > Publishing タブ > Stagingに移動します。
  2. 「Make staging private」のトグルスイッチをオフに切り替えます。
  3. サイトを公開します。

目次

あなたもNoCodeのプロに

充実したサポートであなたも、最短3ヶ月間でノーコードWeb制作のプロになれます。

  • 300以上のノーコード動画教材

  • チャットサポート

  • 個別ビデオ通話相談