• 
• 
• 
• 
• 
• 

「fit.〈 フィットドット 〉」はミニマルな印象で使いやすいデザインが特徴です。
そして多数のオプションで充実したカスタマイズ性も備えています。

見た目は普通だけどできることは意外と多い。
そんなテーマです。

その他の特徴
・ヘッダーにキャンペーンバナーを表示可能
・TOPページにスライド、ピックアップ、お知らせ、ブログリスト、バナー画像を設置可能
・TOPページのコンテンツの順番を変更可能
・ABOUTページにサイトの説明、ショップ情報、YouTube動画、FAQを設置可能
・「商品説明カスタムApp」や「予約販売App」「抽選販売App」など便利なAppに対応

============================================
◆ fit.を利用したデモショップ
https://fitdot.base.ec/

◆ テーマの詳細はこちら
https://fromo.dev/base/fit-dot
============================================

各機能について
◆ フォント
テキスト全体、見出し、テキストロゴ、キャンペーンバナーのフォントを変更できます。

◆ 色
主要な部分を一括で変更可能
・テキストカラー
・リンクカラー
・ポイントカラー
・ポイントテキストカラー
・ボタンカラー
・ボタンテキストカラー

テキストロゴや購入ボタン、キャンペーンバナー、CTAエリア、商品一覧・商品詳細ページに表示される「SOLD OUT」「COMING SOON」「予約販売」「抽選販売」タグは色変更可能です。
またそれ以外でも全体背景色を変えた時に不自然になってしまう部分などは個別で色を調整できるようになっています。

◆ ロゴ
・ロゴ画像
ロゴは画像の場合、高さが最大90pxまでとなります。
それ以上の場合は縮小表示されますのでご注意ください。

・テキストロゴ
テキストの場合はフォントとサイズをPCとスマホでそれぞれ5段階で調整可能です。
あまり長すぎるロゴは改行されてしまうので、5~10文字以内くらいで横幅に収まるように調整することをおすすめします。
※ヘッダーのデザインからはみ出してしまうほど極端に長い文字は、はみ出した部分が非表示になってしまいますのでご注意ください。
※改行されてしまう場合はヘッダーが大きくなってしまうので追従機能はオフすることを推奨します。

◆ ヘッダー
・ヘッダーの追従機能
スクロール時にヘッダーを画面上部に固定してスクロールに追従させます。
追従時の背景色も変更できます。
※テキストロゴが改行される場合はヘッダーが大きくなってしまうので追従機能はオフすることを推奨します。

・アイコンの背景設定
BASEリンク、カート、メニューボタンに白背景を付けることができます。
メイン画像によってはボタンの視認性が悪くなる場合がありますが、こちらで調整できます。
アイコンの背景の形も変更できます。

◆ フッター
・SNSアイコン
表示・非表示を切り替え可能です。

◆ メニュー
サイト右上のハンバーガーボタンを押して開くメニューですが、背景色・文字・マウスオンカラーを変更可能です。

◆ キャンペーンバナー
ヘッダーの上にキャンペーンバナーを設置できます。
画像の場合はPCとスマホでそれぞれ設定可能です。
【推奨画像サイズ】
PC 横1440 × 縦75（px）
スマホ 横750 × 縦90（px）

画像を使わない場合は、キャッチコピーを自由記述できます。
フォント、文字サイズ、文字色を変更可能です。

このバナーにリンクをつけることも可能ですので、ブログや商品ページへの導線にすることも可能です。

◆ TOPページ
・スライド
4枚まで設置可能です。
【推奨画像サイズ】
PC 横2880 × 縦1360（px）
スマホ 横750 × 縦1200（px）

・バナー
バナー画像を4つまで設定可能です。
【推奨画像サイズ】
横600×縦450（px）

・ピックアップ
画像、コンテンツ、リンクボタンを1セットとして3つまで追加できます。
【推奨画像サイズ】
横1720 × 縦960（px）

・商品一覧
「SOLD OUT」「COMING SOON」「予約販売」「抽選販売」タグの色変更できます。
画像の表示設定も「枠に合わせる」「枠を埋める」のどちらかに設定可能です。

● 枠に合わせる
→ 画像を枠に合わせて縮小し、どんな大きさでも全て枠内に収まるように表示させます。

● 枠を埋める
→ 画像を枠に合わせて拡大し、すべて枠と同じ大きさに揃えます。
※解像度の低い小さな画像は引き伸ばされてしまいますのご注意ください。

【推奨画像サイズ】
横1600×縦1200（px）

・お知らせ
最大5件まで表示可能です。
リンクを付けることも可能です。

・ブログリスト
ブログ記事一覧をTOPページに表示可能です。
表示する記事数の上限を最大4件か8件のどちらかを選択できます。
画像の表示設定も「枠に合わせる」「枠を埋める」のどちらかに設定可能です。

● 枠に合わせる
→ 画像を枠に合わせて縮小し、どんな大きさでも全て枠内に収まるように表示させます。

● 枠を埋める
→ 画像を枠に合わせて拡大し、すべて枠と同じ大きさに揃えます。
※解像度の低い小さな画像は引き伸ばされてしまいますのご注意ください。

【推奨画像サイズ】
横800×縦600（px）以上

・CTAエリア
CTAとは「Call To Action」の略で、日本語で言えば「行動喚起」という意味になります。
このエリアはユーザーを目的とする行動やページへの誘導・導線としてお使いいただけます。
デモサイトでは公式サイトに誘導する導線として使っています。

背景・見出し・説明・リンクボタン・枠線のカスタマイズが可能です。

【推奨画像サイズ】
横2880×縦1200（px）

・コンテンツの並び替え
TOPページのコンテンツを任意の順番に並び替えることができます。（ヘッダー・フッター・メインビジュアルを覗く）

◆ ABOUTページ
メイン画像、コンセプト情報、YouTube動画、FAQを設定できます。
FAQは最大10件まで設定可能です。

◆ 商品ページ
購入ボタンの色変更、フリーテキスト、関連商品の表示・非表示を設定できます。

フリーテキストは商品説明のすぐ上に設定できます。
商品ごとに個別にではなく一括ですべての商品ページに設定できるので、注意事項や今だけ使えるクーポンコード、キャンペーンについてなどすべての商品で購入の際に伝えておきたい内容を掲載することができます。

関連商品の画像の表示設定を「枠に合わせる」「枠を埋める」のどちらかに設定可能です。

● 枠に合わせる
→ 画像を枠に合わせて縮小し、どんな大きさでも全て枠内に収まるように表示させます。

● 枠を埋める
→ 画像を枠に合わせて拡大し、すべて枠と同じ大きさに揃えます。
※解像度の低い小さな画像は引き伸ばされてしまいますのご注意ください。

◆ その他
・スクロール時のアニメーション
スクロール時にふわっとコンテンツを表示させるアニメーションの有無を任意で変更できます。

・任意のCSSを追加
CSSの知識がある方はこちらに追記することでデザインのカスタマイズが可能です。

◆ 対応するBASE Appsについて
・BlogApp
・カテゴリ管理App
・商品検索App
・レビューApp
・セールApp
・販売期間設定App
・デジタルコンテンツ販売App
・ラベルApp
・メッセージApp
・予約販売App
・送料詳細設定App
・商品説明カスタムApp
・抽選販売App
・BASEロゴ非表示App
・テイクアウトApp
・商品オプションApp
・コミュニティApp
・年齢制限App
・お知らせバナーApp
・メールマガジンApp
・メンバーシップApp

※英語・外貨対応Appは対応していません。

============================================

◆ 更新情報
2024.2 SNSアイコン各種を変更しました。
2023.09 商品ページに「残り1点」表示機能追加
2023.06 メンバーシップAppに対応しました。
2022.10 商品詳細ページで「PC表示時に商品画像をスクロールに追従させる」機能をテーマ設定に追加。ON・OFFで切り替え可能です。
2022.01 メールマガジンAppに対応しました。Appをインストールするとフッターの上に表示されます。（位置変更は不可）テーマ設定で文字色や背景色、枠線の有無、ボタンの色を変更可能です。
2021.12 お知らせバナーAppに対応しました。
2021.10 年齢制限Appに対応しました。
2021.09 フッターに表示するSNSへのリンクに「Youtube」「TikTok」「note」を追加しました。ショップ設定→SNS設定からアカウントID等必要な情報を設定するとアイコンリンクが表示されます。
2020.04 CSSの軽微な修正を行いました。
2020.12 TOPページ スライド画像に推奨サイズではない画像を設定した場合に途切れる不具合を修正しました。
2020.11 商品詳細ページ スライド画像のポップアップ表示に不具合があったので修正しました。
2020.10 Blog App 固定記事表示をスライド上に重ねて配置するかどうかを選択できる「【ブログ固定記事】スライド上に表示」という項目を追加しました。
2020.09 コミュニティAppに対応しました。
2020.08 商品オプションAppに対応しました。
2020.07 TOPページ スライドの自動再生の間隔を調整できるようにしました。
2020.06 テイクアウトAppに対応しました。
2020.06 商品詳細ページのスライド画像の読み込み時間を改善しました。
2020.06 TOPページのスライドの自動再生機能を調整しました。
2020.06 Webフォントの読み込みを調整しました。
2020.06 スマホメニューの開閉時の挙動を調整しました。

============================================
◆ テーマの詳細はこちら
https://fromo.dev/base/fit-dot

◆ ご質問・ご要望については下記サイトよりお願いいたします。
https://fromo.dev/
============================================