# ページエディタ - 一般タブ

### 全般タブについて

\[PageFlyエレメントの全般設定]\(<https://help.pagefly.io/manual/elements-general-settings/> ‎ "General settings")では、PageFlyページをカスタマイズするためのユニークなオプションを提供します。

### 全般タブの設定

すべてのPageFlyエレメントに含まれるパラメーターグループは5つあります。この記事では、エレメントの全般設定の5つのパラメーターについて説明します：

* コンテンツ
* アクション
* 表示設定
* 属性
* アニメーション

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-9aaa47dfb138adb1f519ddce1340fa7bae7fd90c%2FAD_4nXdGLD023ninUE4fL74eSTuRcufZWqPXWymjp3XOMz8Q8Qr-CSEDrrfnQMeQcPKqdSkYSSJ38yAkTlQxUr0_NZlTdEQAAD0PN3eFCHsECWE2Iy0sCMNhLRSfcXNZelQ4StREL-R6LzNSGGp5gSW_AQkeyyL2ufWcCGHt0Su-i3ImEtg.jpeg?alt=media)

#### コンテンツ

コンテンツは、全般タブ設定 - エレメントの全般設定のパラメーターで、テキストの作成や編集、画像の選択などに使用されます。

![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXct_Lq1EYOOgnmbdcBMi5O8H_1FsGrdVk8rad25xh9DXjgd8hh-FXLS7Z1OYSD06VRxKGCvgF6gf4cnEMi2D7osKEf6LtPwEf-qjFM57monsr7L9N8PakE_pvW9RKH4VpS2SL9-IUlLFagcvd28keyyL2ufWcCGHt0Su-i3ImEtg.jpeg)

#### アクション

アクションは、顧客がページを離れることなく、クリックによって他のリンク、セクションに素早くアクセスしたり、メールを送信したり、電話をかけたりするための設定を可能にするパラメーターです。

クリックオプションには、以下の選択肢があります：

* **URLに移動**
* **ポップアップを開く**
* **セクションへスクロール**
* **メールを送信**
* **電話をかける**

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-c46132f89edb01d602f18ccf1a6052bc4303a4f7%2FAD_4nXfTFSua3w2BULxt4vgpNIbDgkMw8-rAhrqVAXjPQZV0BZgiWFa-y8Tby9SzPY8FduN7nZIaahq7myn4tCqCvQK2Wwn57Zaidl9AXtUqHgQaFc7TbvGFfHZBuYf1rPvQkr-LK9hI0ociKZIQ8yJwLwkeyyL2ufWcCGHt0Su-i3ImEtg.jpeg?alt=media)

クリックアクションの使用方法の詳細については、こちらの[記事](https://help.pagefly.io/manual/direct-to-a-link-a-section-a-pop-up-an-email-address-or-a-phone-number-by-click-action/)を参照してください。

#### 表示設定

以下の例では、段落エレメントを選択し、表示設定パラメーターがこのエレメントにどのように適用されるかを確認します。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-c94409688ba2aff1bd082338e8762597abd38260%2FAD_4nXd5LjUvnsw_ME-Ww4IvgcMLr2Jks4-A7kp2C231_OKgtxPBRc-1u9F2JNtN4ftST6JwAOMaWJpmxhBpXjdh2szlVStPiVkeFKBCo_vfAL_VHmpjm_C-SWVaNin88cJCNiQzP4p4fpTwFACz52tplAkeyyL2ufWcCGHt0Su-i3ImEtg.jpeg?alt=media)

**表示設定とは？**

この全般タブ設定 - エレメントの全般設定のパラメーターは、異なるデバイスでエレメントを非表示にしたい場合に役立ちます。

特定デバイスでエレメントを非表示にする選択が可能です：

* **デスクトップで非表示**
* **ノートPCで非表示**
* **タブレットで非表示**
* **モバイルで非表示**

**表示設定の例**

どのように機能するか見てみましょう。

![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXdkyoJxl5zvKTTIe7hRylvWjH4c_S1TLKQZbhoHSjslwZX_M1A3n6OQMFz0BObX3lu0iIMoSnmV5vSxYIsoEyKH97bYv9DFTyK9w4bszM5RvKigpNgvPhrtKZhLkJhX7VSRP4Yu8CUzmPG-lzLsQwkeyyL2ufWcCGHt0Su-i3ImEtg.gif)

この例では、「**クリアランスセール 55% オフ**」というテキストの段落エレメントをモバイルデバイスで非表示にします。単に、表示設定パラメーターのモバイルで非表示オプションを有効にする必要があります。

ノートPC、タブレットデバイスに切り替えても、段落エレメントはそのまま表示されます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-cb6ff9b2954be392689ab11ef2e05896cb809687%2FAD_4nXeI_n5THsEAZhJ562lvnad0fCv6vnXpm0kbyIl54bggmJG7ox8HcBEz5gqg7FAsOoHJjbijemnqYom2BBEf1KO6d5Z-5dyM9OMHAyEi6589ValgK1DySsWC3f4gT1AUZFNFFdOwVDTJqgL1MpSGyAkeyyL2ufWcCGHt0Su-i3ImEtg.gif?alt=media)

#### 属性

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-637438f567b328e83bb0977b05e071cd769cca15%2FAD_4nXfhObnl2BFG1KHBBvcQl2kEKCyGDZ79kkKfs8i0L10e7XTZ5kJgqyqdsXAl3xOgqT-WDBxswrnBY7gYhz-Q3C-3RT7EdaKV3EboPHLZpGoqv-KXjrMZS6TGQk4g0LhMi5JyTerIIWUyBMbanXe5keyyL2ufWcCGHt0Su-i3ImEtg.jpeg?alt=media)

エレメントのHTMLコードのいくつかのネイティブ属性にカスタム値を設定して、後でカスタムCSS/JSコードで使用することができます。サポートされている属性は以下の通りです：

* **HTML ID**
* **HTMLクラス**

ネイティブ属性に加えて、より高度なカスタマイズのためにカスタム属性を定義することができます。

#### アニメーション

**アニメーションとは？**

ページをより魅力的にするために、エレメントにアニメーションを追加できるケースは2つあります。

* **表示された時**: 訪問者が最初にエレメントを見たときに適用するアニメーションを選択します。
* **マウスオーバー時**: 訪問者がエレメントの上にマウスを移動させたときに適用するアニメーションを選択します。

各ケースには多くの選択肢があります。

詳細については、こちらのビデオチュートリアルをご覧ください：

{% embed url="<https://youtu.be/joB7ei0L5rk>" %}

**アニメーションの例**

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-5fa40f222ebba10f569c0731620185da5d26c70c%2FAD_4nXdpG9MUvCKl72D57sD6XrJ6qBkbRYFT2Gt8x3tLhowdOkDf18rvN86SwCGw5n5x61ESBGNQtB2XLEQWuCKBJ3cyJBF3u06q3fRj7KufFTIBkgAahdojg1poe-ans5lMfaTw2cHe-w3VTFzPZ0vQOwkeyyL2ufWcCGHt0Su-i3ImEtg.gif?alt=media)

**アニメーションを削除する方法**

ここでは、Xボタンをクリックするだけでアニメーションを削除できます。

![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXfp5Cw_V7z_XWFaMWenAnE_IiV3p55vCJovrIyTUnKSpGfw6BZHA_tSz13-NEXHLaIOc8HuL1M_Pu4Uj8aF7HUcTPHpoiLGuTFSMlW46_QeY8pEjTcLCAixmWsuy9CotQYQ7qN4fGbMvC5gRIYH-QkeyyL2ufWcCGHt0Su-i3ImEtg.gif)

### よくある質問

**1. 表示設定機能はライブビューでも機能しますか？**

はい。ただし、その前にPageFlyページを保存して公開することを忘れないでください。

**2. カスタム属性に任意の名前を使用できますか？**

現在、有効な属性キーのみが受け付けられます。[HTML属性リファレンス](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes%23attribute_list)を確認してください。
