グローバルスタイリング機能

この記事で、グローバルスタイリング機能と使用法について学びます。

グローバルスタイリング機能についてClick to copy

PageFlyグローバルスタイリング機能はマーチャントがストアで要素にこのを使用するようにすることを目的としています。 この定義済みのスタイリングはマーチャントによってカスタマイズされた。マーチャントがストアで迅速かつ均一でページを作成できます。グローバルスタイリングで設定された値はエディタページに計算値になります。

例えは:

ページの全部で同じ見出しスタイルを表示したい場合、スタイルをコピーして貼り付けるのではなく、スタイリングタブでグローバルスタイリングを選択してください

Global Styling Feature 1

グローバルスタイリングを適用している見出しのスタイルを変更したい場合、グローバルスタイリングの設定でスタイルを変更するだけです。

別の例:ボタン、そしてイコンなどの要素にブランド色を適用したい場合、グローバルスタイリングで要素の色の設定とグローバルスタイリングの色でブランドの色の設定はできます。

全体として、グローバルスタイリングの使用でストアの作成のプロセス中で時間と労力を節約するだけでなく、ページの表示も向上できます。

この機能の使用を理解するため、引き続き、この記事をお読みください。

グローバルスタイリング機能にアクセスしますClick to copy

  • 手順1:PageFlyアプリでナビゲーションバーの左下に設定を選択してください
  • 手順2:設定で、グローバルスタイリングをクリックします

global styling pagefly

グローバルスタイリングの構成Click to copy

グローバルスタイリング設定で 2つの主要部分があります

プロパティの部分には色やフォント群があります

要素の部分にはイコン、イメージ、ボタン、見出し、パラグラフ、そしてディバイダがあります。

要素のスタイリングの名前を変更することができます。エディタページでグローバルスタイリングを選択する時、この名前はドロップダウンメニューに表示されます

プロパティClick to copy

グローバルスタイリングの色の設定で8つの定義済みの色ををカスタマイズし、ページの作成のプロセス中で使用できます。その色の名前はプライマリー、セカンダリ、フォアグラウンド、バックグラウンド、色5、色6、色7、そして色8です。

色をカスタマイズするように各タイプを選択して、スタイリングタブで色を選択してください

global styling pagefly

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みの色を使用するように色を変更する要素を選択し、スタイリングタブに移動してください。そして、内容の色と背景の色の下でグローバルスタイリングの色を自由に選択します。

グローバルスタイリングの色と異なる色を選択する場合、色のタイプはカスタムに自動的に変更されます。

global styling pagefly

フォント群

グローバルスタイリングのフォント群の設定で3つの定義済みのフォントをカスタマイズし、ページの作成のプロセス中で使用できます。その色の名前はプライマリー、セカンダリ、そしてターシャリです。

フォント群をカスタマイズするように各タイプを選択して、スタイリングタブでフォント群を選択してください。

global styling pagefly

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みのフォントを使用するようにフォント群を変更する要素を選択し、スタイリングタブに移動してください。そして、フォント群の下でグローバルスタイリングの色を自由に選択します。

global styling pagefly

グローバルスタイリングのフォント群と異なるフォントを選択する場合、フォント群のタイプはカス タムに自動的に変更されます。

要素Click to copy

アイコン

グローバルスタイリングの色の設定で6つの定義済みのスタイルをカスタマイズし、ページの作成のプロセス中で使用できます。

各イコンのスタイリングをカスタマイズするように各タイプを選択しスタイリングタブに移動して構成を行ってください

global styling

スタイリングタブの詳細については ここを参照してください

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みのイコンを使用するように要素機能の追加というプラスアイコンをクリックして、ドロップダウンメニューにイコン要素をクリックします。そして、ページエディタに要素をドラッグしてドロップしてください。

global styling pagefly

その後、イコンを選択して、スタイリングタブに移動してください。要素のグローバルスタイルの下でイコンのスタイルを自由に選択してください。

global styling

イメージ

グローバル・スタイリング・イメージの設定で6つの定義済みのスタイルをカスタマイズし、ページの作成のプロセス中で使用できます。

各イメージのスタイリングをカスタマイズするように各タイプを選択して、スタイリングタブに移動して、構成を自由に行ってください。

global styling

スタイリングタブの詳細については ここを参照してください

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みのイメージを使用するように要素機能の追加というプラスアイコンをクリックして、ドロップダウンメニューにイメージ要素をクリックします。そして、ページエディタに要素をドラッグしてドロップしてください

global styling pagefly

その後、イメージを選択して、スタイリングタブに移動してください。要素のグローバルスタイルの下でイメージのスタイルを自由に選択してください。

global styling pagefly

ボタン

グローバルスタイリングのボタンの設定で6つの定義済みのスタイルをカスタマイズし、ページの作成のプロセス中で使用できます。

各ボタンのスタイリングをカスタマイズするように各タイプを選択して、スタイリングタブに移動して、構成を自由に行ってください。

global styling

スタイリングタブの詳細についてはここを参照してください

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みのボタンを使用するように要素機能の追加というプラスアイコンをクリックして、ドロップダウンメニューにボタン要素をクリックします。そして、ページエディタに要素をドラッグしてドロップしてください

global styling pagefly

その後、ボタンを選択して、スタイリングタブに移動してください。要素のグローバルスタイルの下でボタンのスタイルを自由に選択してください。

global styling

見出し

グローバルスタイリングの見出しの設定で6つの定義済みのスタイルをカスタマイズし、ページの作成のプロセス中で使用できます。

各見出しのスタイリングをカスタマイズするように各タイプを選択 して、スタイリングタブに移動して、構成を行ってください。

global styling pagefly

スタイリングタブの詳細についてはここを参照してください

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みの見出しスタイルを使用するように要素機能の追加というプラスアイコンをクリックして、ドロップダウンメニューに見出し要素をクリックします。そして、ページエディタに要素をドラッグしてドロップしてください

global styling pagefly

その後、見出しを選択して、スタイリングタブに移動してください。要素のグローバルスタイルの下で見出しのスタイルを自由に選択してください。

global styling pagefly

パラグラフ

グローバルスタイリングのパラグラフの設定で4つの定義済みのスタイルをカスタマイズし、ページの作成のプロセス中で使用できます。

各パラグラフのスタイリングをカスタマイズするように各タイプを選択して、スタイリングタブに移動して、構成を行ってください。

global styling pagefly

スタイリングタブの詳細についてはここを参照してください

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みのパラグラフのスタイルを使用するように要素機能の追加というプラスアイコンをクリックして、ドロップダウンメニューにパラグラフ要素をクリックします。そして、ページエディタに要素をドラッグしてドロップしてください。

global styling pagefly

その後、パラグラフを選択して、スタイリングタブに移動してください。要素のグローバルスタイルの下でパラグラフのスタイルを自由に選択してください。

global styling pagefly

ディバイダ

グローバルスタイリングのディバイダの設定で3つの定義済みのスタイルをカスタマイズし、ページの作成のプロセス中で使用できます。

各ディバイダのスタイリングをカスタマイズするように各タイプを選択して、スタイリングタブに移動して、構成を行ってください。

global styling pagefly

スタイリングタブの詳細について はここを参照してください。

構成の完了後、公開を選択します。

PageFlyエディタでこのような定義済みのディバイダのスタイルを使用するように要素機能の追加というプラスアイコンをクリックして、ドロップダウンメニューにディバイダの要素をクリックします。そして、ページエディタに要素をドラッグしてドロップしてください。

global styling pagefly

その後、ディバイダを選択して、スタイリングタブに移動してください。要素のグローバルスタイルの下でディバイダのスタイルを自由に選択してください。

global styling pagefly

注意:

  • グローバルスタイリングを公開すると、グローバルスタイリングのプロパティと要素での変更はグローバルスタイリングを使用しているページに適用されます。
  • グローバルスタイリングのパラメータはスタイリングタブでリセットのボタンがありません。
  • ある要素にグローバルスタイリングを適用して、設定されているパラメータを編集する場合、他のパラメータはグローバルスタイリングの設定を引き続き使用します。

global styling pagefly

  • スタイリングタブでグローバルスタイリングを使用した後、ローバルスタイリングを元に戻すオプションがあります。要素の編集・プロパティのグローバルスタイリングを選択してください。

global styling pagefly

Navigate this category

Feedback
Thank you for your feedback!

Could not find the answer
to your question?

Chat with us
Boost your holiday sales with PageFly's Thanksgiving Template 👉 Discover Now