---
title: "リモートコンフィグでペイウォールをデザインする"
description: "Adapty のリモートコンフィグを使用してペイウォールをカスタマイズし、より精度の高いターゲティングを実現しましょう。"
---

:::important
このガイドはクラシックペイウォールのリモートコンフィグについて説明しています。フロービルダーについては、[フローのリモートコンフィグカスタマイズ](customize-flow-with-remote-config)をご参照ください。
:::

ペイウォールのリモートコンフィグは、柔軟な設定オプションを提供する強力なツールです。カスタム JSON ペイロードを使用して、ペイウォールを細かく調整できます。タイトル、画像、フォント、カラーなど、さまざまなパラメーターを定義することが可能です。

<details>
   <summary>ペイウォールのカスタマイズを始める前に（クリックして展開）</summary>

   1. [プロダクトを作成する](create-product)。
2. [ペイウォールを作成してプロダクトを追加する](create-paywall)。
</details>

リモートコンフィグを使ってペイウォールをカスタマイズするには：

1. Adapty メインメニューの [**Paywalls**](https://app.adapty.io/paywalls) セクションを開きます。

2. ペイウォールをクリックして開きます。

  <img src="/assets/shared/img/remote-config.png"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

3. **Remote config** タブに切り替えます。

  <img src="/assets/shared/img/remote-config-3.png"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

リモートコンフィグには 2 つの表示形式があります：

- [テーブル](customize-paywall-with-remote-config#table-view-of-the-remote-config)
- [JSON](customize-paywall-with-remote-config#json-view-of-the-remote-config)

**Table** と **JSON** の両方のビューには同じ設定要素が含まれています。違いは好みの問題ですが、唯一の相違点はテーブルビューにコンテキストメニューが用意されている点で、ローカライズのエラー修正に役立ちます。  
**Table** または **JSON** タブをクリックすることで、いつでも表示を切り替えられます。

どちらのビューでペイウォールをカスタマイズした場合でも、SDK から `AdaptyPaywall` の `remoteConfig` または `remoteConfigString` プロパティを使用してこのデータにアクセスし、ペイウォールを調整できます。また、[サーバーサイド API](api-adapty/operations/updatePaywall) を使用してリモートコンフィグの値をプログラム的に更新することで、ダッシュボードを手動で更新することなくペイウォールの設定を動的に変更することも可能です。リモートコンフィグの活用例をいくつか紹介します。

<Tabs groupId="current-os" queryString>
  <TabItem value="Titles" label="タイトル" default>
```json showLineNumbers
{
    "screen_title": "Today only: Subscribe, and get 7 days for free!"
}

# Test titles or others texts
```
</TabItem>
<TabItem value="Images" label="画像" default>
```json showLineNumbers
{
    "background_image": "https://adapty.io/media/paywalls/bg1.webp"
}

# Test images on your paywall
```
</TabItem>
<TabItem value="Fonts" label="フォント" default>
```json showLineNumbers
{
    "font_family": "San Francisco",
    "font_size": 16
}

# Test fonts
```
</TabItem>
<TabItem value="Color" label="カラー" default>
```json showLineNumbers
{
    "subscribe_button_color": "purple"
}

# Test colors of buttons, texts etc.
```
</TabItem>
<TabItem value="HTML" label="HTML" default>
```json showLineNumbers
{
    "photo_gallery": "https://adapty.io/media/paywalls/link-to-html-snippet.html"
}

# Any HTML code that can be displayed on the paywall
```
</TabItem>
<TabItem value="Soft/Hard Paywall" label="ソフト/ハードペイウォール" default>
```json showLineNumbers
{
    "hard_paywall": true
}

# By setting it to true, you disalow skipping paywall without subscribing
# You have to handle this logic in your app
```
</TabItem>
<TabItem value="Translations" label="翻訳" default>
```json showLineNumbers
{
    "title": {
        "en": "Try for free!",
        "es": "¡Prueba gratis!",
        "ru": "Попробуй бесплатно!"
    }
}
```
</TabItem>
</Tabs>

さまざまなオプションを組み合わせて独自の設定を作ることができます。これにより、タイトル、テキスト、画像、フォント、カラーなどをテストできます。

### リモートコンフィグの JSON ビュー \{#json-view-of-the-remote-config\}

リモートコンフィグの **JSON** ビューでは、任意の JSON 形式のデータを入力できます：

  <img src="/assets/shared/img/3356ff5-remote_config_JSON.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

### リモートコンフィグのテーブルビュー \{#table-view-of-the-remote-config\}

コードに慣れていない場合や JSON の値を修正したい場合は、Adapty の **Table** ビューが便利です。

  <img src="/assets/shared/img/4c27b2f-remote_config_table.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

JSON をテーブル形式で表示するため、読みやすく理解しやすくなっています。カラーコーディングによって異なるデータ型を識別できます。

キーを追加するには、**Add row** ボタンをクリックします。値と型のマッピングを自動でチェックし、修正内容が無効な JSON につながる可能性がある場合はアラートを表示します。

  <img src="/assets/shared/img/ef682d8-add_raw.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

追加の行オプションは、主に[ペイウォールのローカライズ](add-remote-config-locale)で役立ちます：

  <img src="/assets/shared/img/17bcf80-remote_config_table_options.webp"
  style={{
    border: '1px solid #727272', /* border width and color */
    width: '700px', /* image width */
    display: 'block', /* for alignment */
    margin: '0 auto' /* center alignment */
  }}
/>

次は[プレースメントを作成](create-placement)してペイウォールを追加しましょう。その後、モバイルアプリでリモートコンフィグのペイウォールを <InlineTooltip tooltip="リモートコンフィグペイウォールを表示する">[iOS](present-remote-config-paywalls)、[Android](present-remote-config-paywalls-android)、[React Native](present-remote-config-paywalls-react-native)、[Flutter](present-remote-config-paywalls-flutter)、[Unity](present-remote-config-paywalls-unity)</InlineTooltip> で表示できます。