---
title: ページのプレビュー機能を無効にする
description: ページ編集画面の右上「プレビュー」から発行できるプレビューURLによる事前確認はとても便利なものです。しかしときには「本公開前に絶対に情報が流出しないようにしたい」ということもあるでしょう。HubSpotのシステムドメインであればプレビュー時にログインが求められますが、それよりも確実に情報流出が防げる方法をご紹介します。
---

[カテゴリ実装例ブログ](https://demo.100inc.co.jp/category-test)

# [ページのプレビュー機能を無効にする](https://demo.100inc.co.jp/category-test/tips/disable-preview)

 作成者: [半田 惇志](https://demo.100inc.co.jp/category-test/author/半田-惇志)｜Jun 14, 2021, 3:00:00 PM

ページ編集画面の右上「プレビュー」から発行できるプレビューURLによる事前確認はとても便利なものです。しかしときには「本公開前に絶対に情報が流出しないようにしたい」ということもあるでしょう。  
HubSpotもこの点のセキュリティは気にしていたのか、2021年5月のアップデートにより、ページのドメインが

- hs-sites.com
- hubspotpagebuilder.com
- preview.hs-sites.com

のいずれかに該当する場合は、プレビューURLにHubSpotアカウントへのログインが求められるようになりました。

## 引き続き残る問題点

しかし独自ドメインの場合は、引き続きURLさえ分かれば誰でも公開前のコンテンツを見ることができます。またこれは実は、非公開にしたコンテンツついても同様です。  
例えば仮に `https://expample.com/hoge` として公開していたページを非公開にし、ページドメインを `hs-sites.com` などにしても、`https://expample.com/hoge` に紐付くプレビューURL（`https://expample.com/hoge?hs_preview=....`）は依然有効になっています。そのため非公開済みのページであれ、一度独自ドメインで発行されたプレビューURLは残り続けます。

## 解決策

これに対する解決策として、「プレビューURLであればコンテンツを表示させない」という条件分岐をテンプレートに記述する方法があります。URL自体はどうしても発行を阻止する手立てがありませんので、URLのクエリ文字列を基に条件分岐を行います。  
ただし全てのページのプレビューにおいてコンテンツが見られなくなってしまうのも当然不便ですので、ページによってプレビューのコンテンツ表示をON/OFFできるBooleanモジュールも追加してあげます。コードは次のようなイメージになります。

```
{%- boolean "disable_preview" label='プレビュー機能を無効にする', value=false, export_to_template_context=True -%}
{%- if
  widget_data.disable_preview.value
  and request.query is string_containing 'hs_preview'
-%}
  プレビュー機能が無効になっています
{%- else -%}
  本来表示させたいコンテンツが入ります
{%- endif -%}
```

[完全な記事を表示](https://demo.100inc.co.jp/category-test/tips/disable-preview)

```json
{
  "@context" : "http://schema.org",
  "@type" : "BlogPosting",
  "author" : {
    "@type" : "Person",
    "name" : "半田 惇志"
  },
  "dateModified" : "2022-06-09T06:31:16.595Z",
  "datePublished" : "2021-06-14T15:00:00Z",
  "headline" : "ページのプレビュー機能を無効にする",
  "image" : {
    "@type" : "ImageObject",
    "height" : 60,
    "url" : "/hs/hsstatic/content_shared_assets/static-1.4092/img/default-amp-logo.png",
    "width" : 60
  },
  "mainEntityOfPage" : "https://demo.100inc.co.jp/category-test/tips/disable-preview",
  "publisher" : {
    "@type" : "Organization",
    "logo" : {
      "@type" : "ImageObject",
      "height" : 60,
      "url" : "/hs/hsstatic/content_shared_assets/static-1.4092/img/default-amp-logo.png",
      "width" : 60
    },
    "name" : "カテゴリ実装例ブログ"
  }
}
```