フローティングアクションボタンパーツ | Shopper App

4. EC + SC (EN).png
12. ブランド會員購物 App.png

フローティングアクションボタンは、メインのトップページスペースを占有しません。このパーツを使用して、売れ筋商品やプロモーションを表示し、顧客のクリックを引き付けることができます。

 

この記事では、以下の内容をカバーします:

 

1. フローティングアクションボタンのパーツを設定する

ステップ 1

SHOPLINE 管理画面に移動し、> [Shopper App 管理] > [アプリデザイン] > [トップページデザイン] > [現在のテンプレート]を選択します。設定をクリックして、アプリページエディタに入ります。

Screenshot 2025-09-02 at 1.37.54 PM.png

 

ステップ 2

左パネルでフローティングアクションボタンをクリックして設定します。ここでフローティングアクションボタンのパーツを有効または無効にすることもできます。

Screenshot 2025-09-19 at 12.01.11 PM.png

 

ステップ 3

右側の編集エリアで以下の設定を完了します。

i. 画像設定

  • デフォルト画像:画像を選択をクリックし、デフォルトライブラリから好みの画像を選択して、確認をクリックします。

    Screenshot 2025-09-19 at 11.51.32 AM.png
    Screenshot 2025-09-19 at 11.52.50 AM.png

     

  • カスタム画像:画像を追加をクリックして、好みの画像をアップロードします。PNG、JPEG、JPG、またはGIF形式を使用し、最大ファイルサイズは2MBです。

    Screenshot 2025-09-19 at 11.54.09 AM.png

 

ii. ジャンプリンク

6つの目的地ページから選択できます:注目のプロモーション、プロモーション、選択したカテゴリ、トップランキング、ストア情報、またはカスタムURL。

*注意:

  • 有効なコンテンツを持つ目的地ページのみを選択できます。たとえば、ストアにアクティブなプロモーションがある場合のみ「注目のプロモーション」を選択するか、ストアの詳細がストアフロントにある場合のみ「ストア情報」を選択してください。
  • 「カスタムURL」を選択した場合は、「https://」または「http://」で始まるリンクを入力してください。
Screenshot 2025-09-19 at 12.28.59 PM.png

 

iii. リリーススケジュール(オプション)

リリース時間を設定した場合、指定された時間にアプリにこのパーツが表示されます。

Screenshot 2025-09-16 at 6.09.36 PM.png

 

ステップ 4

保存をクリックして変更を保存します。すべての編集が完了したら、更新して使用をクリックして、変更をアプリに公開します。

Screenshot 2025-09-19 at 12.41.55 PM.png

 

2. アプリの表示効果

  • フローティングアクションボタンは、デフォルトでアプリの右下隅に表示されます。顧客は右側に沿って垂直にドラッグできます。
  • 右上隅の「X」をタップして、残りの時間フローティングアクションボタンを閉じます。顧客がアプリを再度開くと、フローティングアクションボタンが再び表示されます。
  • 顧客がスクロールすると、フローティングアクションボタンは自動的に隠れ、スクロールが停止すると再表示されます。
Screenshot 2025-09-19 at 12.43.08 PM.png

 

 

 

 

 

この記事はAIを使用して翻訳されており、不正確な情報が含まれている可能性があります。最も正確な情報については、元の英語版を参照してください。

この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています
他にご質問がございましたら、リクエストを送信してください

コメント