テーマ申請チェックリスト

テーマ申請時にはチェックリストをご確認頂き、正常に動作するか確認してから申請するようにお願いいたします。

テーマとして意図的にチェック内容に当てはまらない設計をしている場合はチェック不要です。 その場合は申請時にその旨を「申請に関するメモ」に記載してください。

また、「デザインマーケット利用規約」は必ず事前にご確認ください。

ご注意ください

申請頂いたテーマの審査時に不具合(優先度A)が5つ見つかった時点で審査を中断し、フィードバックを添えてお返しいたします。 再申請の際にはフィードバックの内容のみではなく、チェックリストを再度全てチェックした上で申請をお願いいたします。 原則として審査で不具合が確認されたテーマはデザインマーケットでの販売はできませんのでご了承ください。

また新規テーマの販売申請の場合において、度重なる審査フィードバックを経ても改善が見られない場合、 それ以降の申請をお断りする場合がございます。予めご了承くださいませ。

テーマ申請内容

テーマ申請内容に関連するチェックです。

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 説明文
  • 機能やデザイン意図が伝わる充分な説明がなされているか
  • 誤字脱字がないか
  • 説明が短すぎて伝わらない
  • 誤字脱字がある
  • テーマ説明以外の内容が含まれている
◯
 テーマ名とテーマのバージョンの明記をしているか
  • 明記されていない
  • デフォルトのものから変更されていない
  • （アップデートの場合）バージョンを更新していない
◯
 未公表の情報などをテーマ説明文に含んでいないか。
  • 未リリースの情報がテーマ説明に含まれている。(リリース後にアップデートしてください。)
◯
 説明URL リンク切れを起こしていないか
◯
 サムネイル・説明画像
  • 申請時と異なる古い画像が使われている
  • 当て込んだ商品画像に知的財産権を侵害するおそれがある情報が含まれている
  • テーマの紹介として不適切だと判断される画像が含まれている(過度に肌を露出しているモデルの画像など判断に困るものも審査が通らない場合があります)
◯
 デモ用ショップ
  • 一般購入者がデモショップと気づかずデモ商品を購入し入金してしまいトラブルになる。
  • 当て込んだ商品画像に知的財産権を侵害するおそれがある情報が含まれている
  • テーマの紹介として不適切だと判断される画像やコンテンツが含まれている(過度に肌を露出しているモデルの画像など判断に困るものも審査が通らない場合があります)

全体

テーマ全体の表示に関連するチェックです。

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ブラウザチェック 各OSのそれぞれのブラウザの最新バージョンでデザイン崩れはないか
  • Windows : Microsoft Edge(Chromium版 Edge)、Google Chrome、FireFox
  • Mac : Safari、Google Chrome、FireFox
  • iOS 11.0 以上 : Safari、Google Chrome
  • Android OS 6.0 以上 : Google Chrome
※未対応の場合はテーマ説明文に未対応の旨をテーマ説明文に明記してください
※手元にチェック環境が無い場合は申告してください。
※Internet Explorerは2020/11/15をもってサポート終了となります。
  • 各ブラウザでのチェックをしていない
  • MacとiOSのSafariにおいて、意図せずにinputやselectなどの要素にブラウザデフォルトのスタイルが残っている。
◯
 マルチデバイス対応 タッチデバイス(iPadやAndroidタブレット等)でデスクトップサイズの画面幅の時に支障なく動作するか
  • デスクトップ環境でホバーを想定した機能がタッチで動作しない。(プルダウンメニューなど)
◯
 レスポンシブデザインになっているか
(例)
レスポンシブ対応の画面幅の一例
  • スマートフォン表示 320px ~ 767px
  • タブレット表示 768px ~ 1024px
  • デスクトップ表示 1025px以上
  • スマートフォン表示が部分的に考慮されていない
  • 画面幅320pxの時に崩れる
  • ナビゲーションやカテゴリリストなど要素数が変化するものがすべて表示された状態の時に崩れる
◯
 デザイン デザインガイドラインに則っているか
  • フォントサイズが小さすぎて読みづらい
  • フォントが環境によって存在せず正しく表示されない
  • サンプルテーマと酷似していて独自性がみられない
◯
 HTML ソースコードがオリジナル性が担保されているか
  • ほぼサンプルテーマのままで、CSSで少しデザインを変更しただけでオリジナル性が見られない
◯
 ダミー文字等が残っていないか
  • alt属性やコメントなどブラウザで表示されない部分に不要なテキストが残る
◯
 動作確認用のタグが残っていないか
  • sandboxタグが残っている
◯
 適さない文字が表示されないか
  • 店舗を持たないオンラインのみのショップの場合「店舗所在地」などの項目が固定で表示されると困る
◯
 共通化できるソースを何度も繰り返し記述していないか
  • ヘッダーやナビゲーションなど共通の要素を各ページ毎に記述している
◯
 CSS 外部ファイルとして読み込むCSS、デザインオプションで使用するCSSが適切に設定されているか。
  • CSSのコメント等が大量に残っている
  • headタグ内にすべてのCSSを記述しているのに圧縮されていない
◯
 <head>内に記述したCSSのシンタックスがBASE Templateの書き方になっていないか
  • CSSとして記述した部分がBASE TemplateタグとみなされCSSが無効になる。詳細はこちら。
◯
 BASEが提供するデフォルトテーマのCSSファイルを読み込んでいないか
(例)
  • /css/shopTemplate/v0/common.css
  • /css/shopTemplate/v0/shop_00.css
  • /search/css/shopTemplate/search.css
  • /item_label/css/ShopTemplate/style.css
  • デフォルトテーマ固有のcssファイルを読み込んでいる
※デフォルトテーマのアップデートにより内容変更される場合があり、作成されたテーマに影響を及ぼす可能性があります
◯
 Javascript console.logなど、不要な記述が残っていないか
  • 開発時の記述の削除漏れにより状況によってconsole.logが出力される場合がある
◯
 BASEが提供するデフォルトテーマのJavascriptファイルを読み込んでいないか
(例)
  • /item_label/js/ShopTemplate/labelpostion.js
  • デフォルトテーマ固有のJavascriptファイルを読み込んでいる
※デフォルトテーマのアップデートにより内容変更される場合があり、作成されたテーマに影響を及ぼす可能性があります
◯
 エラーが出ていないか
(開発者ツールのコンソール等でご確認ください)
  • jQueryのバージョンにあった記述をしていない
  • オプションの設定内容によってエラーが出る場合と出ない場合がある
  • PC表示、モバイル表示のどちらかでのみエラーが出る
◯
 必須タグ 必須タグがちゃんと含まれているか ※含まれていないと申請できません
◯
 ショップ公開設定 ショップが公開状態の時に意図した表示になっているか 公開状態なのに非表示の場合に表示させるコンテンツが表示されている。
◯
 ショップが非公開状態の時の表示が仕様どおりになっているか 非公開状態なのに表示されてはいけないコンテンツが表示されている。
◯
 ショップが非公開状態の時に、{lang:NotShopPublicMessage} のテキストが正常に表示されているか {lang:NotShopPublicMessage}タグ内のテキストが表示されていない。

デザイン編集 - 基本設定

「デザイン編集」ページで設定できる「基本設定」のチェックです。

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ロゴ 「ロゴ」の「画像を使用する」がオフの時にロゴテキストが正常に表示されるか
  • 設定したテキストの文字量が多い場合に表示が崩れる(エリアを突き抜ける、途中で切れる、上下が切れる)
  • 設定したロゴ色が反映されない
  • テキストがアルファベットで長い場合に適切に改行されない(単語の途中で改行されるなど)
◯
 「ロゴ」の「画像を使用する」がオンの時にロゴ画像が正常に表示されるか
  • レスポンシブに対応していない
  • ロゴ画像が縦長の時に表示が崩れる
  • ロゴ画像が横長の時に表示が崩れる
  • 画像のアスペクト比が保たれずに歪む
◯
 背景 「背景」の「画像を使用する」がオフの時、意図した場所に背景色が問題なく反映されるか。
  • 意図した場所に背景色が反映されない
  • 背景色が黒など濃い色を指定した時に、背景色の反映されるエリアに含まれる要素も濃い色となっていてローコントラストとなり文字やアイコンなどの閲覧が難しい
◯
 「背景」の「画像を使用する」がオンの時、意図した場所に背景画像が問題なく反映されるか。
  • 意図した場所に背景画像が反映されない
  • 設定された画像の色、柄、被写体などによって、背景画像が反映されるエリアに含まれるコンテンツの閲覧が難しくなる。
◯
 「背景」の「画像を使用する」がオンの時、「背景画像を繰り返す」のオン/オフの切り替えをした時に正常に表示されるか
  • 「背景画像を繰り返す」のオン/オフが効かない
テキスト色 デザインオプションタグ {NavColor} をテーマ内で使用している場合、「ナビゲーション」で指定した色が正常に反映されるか
  • テーマ内で使用していないのに {NavColor} タグが含まれている
  • 意図した要素に設定した色が反映されない
デザインオプションタグ {TextColor} をテーマ内で使用している場合、「テキスト」で指定した色が正常に反映されるか
  • テーマ内で使用していないのに {TextColor} タグが含まれている
  • 意図した要素に設定した色が反映されない
デザインオプションタグ {LinkColor} をテーマ内で使用している場合、「リンク色」で指定した色が正常に反映されるか
  • テーマ内で使用していないのに {LinkColor} タグが含まれている
  • 意図した要素に設定した色が反映されない

デザイン編集 - テーマ別設定

「デザイン編集」ページで設定できる「テーマ別設定」のチェックです。

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 デザインオプション 独自のデザインオプションタグが全て {block:Hidden} タグで囲われていてブラウザ表示時にHTMLとして出力されていない状態か
  • 独自のmetaタグがHTMLソースに表示されてしまっている
◯
 デザインやHTML等に関して得意ではないテーマ購入者でも簡単に扱えるようになっているか
  • 専門用語を使っていて初心者にとって難しい
  • 設定項目が多すぎて使いこなせない
※多機能なテーマの場合、テーマ作者様がサポートページを独自に用意するケースが多いです
◯
 設定したオプションが適切に反映されるか
  • デザイン編集で入力した内容が反映されない
  • オン/オフが反映されない
◯
 各オプションの見出し、説明等は適切かどうか
  • 設定項目がショップページのデザインのどこを指しているのか分からない
  • 日本語として違和感がある
◯
 色の設定が多すぎないか ( 購入したユーザが適切に設定できる範囲の数であるか )
  • ユーザが何色にすれば良いのか分からなくなるほど設定項目が多い
  • ショップページのカラーテーマとして共通の色とすべきところでも、オプションとして分かれていて設定することが手間になっている
※カラーピッカーで選択した色のカラーコードのコピーが上手くできず、色の統一が難しくなる可能性があります
◯
 不必要なオプションがないか
  • 設定項目として存在していてもそれが反映される場所が無い
◯
 各オプションをオンにした時、オフにした時で不都合はないか
  • オフにした時に、その項目とセットになる見出しだけが残ってしまう
  • オフにしたことで余白がなくなり隣接する要素とくっついてしまう
◯
 特定のエリアに背景色を設定できるようにした場合、設定した背景色の上に乗るテキストが読みづらくならないか
  • 背景を黒などの濃い色にした場合、上に乗るテキストが黒または同様の濃い色でローコントラストとなり読みづらい
※背景色を設定できるようにする場合は、そのエリアが含むテキストなどのコンテンツの色も設定できる必要があります。
◯
 特定の要素にテキスト色を設定できるようにした場合、設定したテキスト色の背景がテキスト色と似ていて読みづらくないか
  • テキストを白などの薄い色にした場合、背景色が白または同様の薄い色でローコントラストとなり読みづらい
※テキスト色を設定できるようにする場合は、そのテキストが含まれるエリアの背景色も設定できる必要があります。
◯
 画像選択フィールド内、初期設定の画像に禁止事項に該当するファイルを用いていないか
  • ※権利者による許諾を得ていない各種素材の使用、知的財産権を侵害するおそれのある素材の使用をしていないか
※テーマ内で初期値として設定されている画像はそのまま購入したショップで利用できてしまう仕様のため、素材サイトなどを利用している場合、サイトによっては「再配布」となる場合があります。
素材サイトなどを利用される場合は規約を確認し、必要があれば素材サイトに問い合わせをしてご利用ください。
◯
 グルーピング機能を利用する場合、すべてのオプションが適切なグループに割り振られているか
  • 一部のオプションのみグルーピングが設定されている
  • HOMEでしか使われていないオプションが「HOME設定」以外に割り振られている
※グルーピング機能の利用自体は必須ではありません。

全体共通パーツ

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 カートリンク、BASEロゴリンク カートアイコン、BASEロゴリンクがわかり易い場所に設置、表示されているか
  • BASEロゴをCSSで意図的に非表示にしている(レギュレーション違反となります)
◯
 カートアイコン、BASEロゴリンクをクリックしたときに正常に遷移できるか
◯
 カートアイコン、BASEロゴが最小サイズの14px以下になっていないか
◯
 ナビゲーション 各ページへ正しく遷移できるか
◯
 各ページ名の表記が正しい状態か
  • 初期値とは違うページ名になっている
  • 表記の大文字小文字がテーマ全体として統一されていない
◯
 各種Appをインストールしていないのに不要なリンクが表示されていないか
  • Blog Appを使用していないのにBlogへのリンクが表示されている

TOPページ

TOPページに商品一覧を実装しない場合には下記チェックは不要です。 商品一覧を実装した場合は、商品一覧の項目をチェックしてください。

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ページコンテンツ TOPページに表示されるべきコンテンツが正常に表示されているか
  • ブラウザによって動かない・表示崩れが見られる
  • スマートフォン環境で表示が崩れる
  • 構文エラーがみられる
  • タイトルやキャッチコピーの文字数が多いと表示崩れを起こす
  • デザインオプションで追加されたものが正常に表示されていない。
  • 様々な条件での表示に対応していない。
◯
 Apps対応 対応するAppsが正しく表示されているか ※詳細なチェックは各Appsの項目を参照してください
◯
 商品一覧 商品一覧が正しく表示されるか ※商品一覧と同様のチェックをお願いします。

商品一覧

商品一覧が設置されるのは、「TOPページ」、カテゴリ管理App使用時のカテゴリページ、商品検索App使用時の検索結果ページとなります。
ショップに登録されている商品数のチェックパターンにご注意ください。

  • 商品登録数が1〜3個 (極端に少ない)
  • 商品登録数が25個未満 (商品の追加ロードが発生しない数)
  • 商品登録数が25個以上 (商品の追加ロードが発生する数)
必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品一覧 レイアウトが正しく表示されているかどうか
  • 登録商品数が少数(1〜3個程度)の場合
  • 登録商品数が25個未満の場合
  • 登録商品数が25個以上の場合
  • 商品数によってレイアウトが崩れる
  • 登録商品数が25個以上の場合、追加で読み込まれた商品だけ崩れる
  • IEの場合に崩れる
  • レスポンシブで特定の画面幅の場合に崩れる
  • 商品画像のアスペクト比に影響されて崩れる
◯
 商品名が正しく表示されているか
  • 登録商品数が25個未満の場合
  • 登録商品数が25個以上の場合
  • 追加で読み込まれた商品の表示が不適切。または表示されない。
  • 商品名が長い場合にはみ出す
  • 商品名が正しく折り返さない
  • 商品名が極端に短い文字数で途切れる
◯
 金額が表示されているか
  • 登録商品数が25個未満の場合
  • 登録商品数が25個以上の場合
  • 追加で読み込まれた商品の表示が不適切。または表示されない。
  • 金額が大きい場合に崩れる
◯
 在庫が無い場合にSOLD OUT表記があるか
  • 登録商品数が25個未満の場合
  • 登録商品数が25個以上の場合
  • 追加で読み込まれた商品の表示が不適切。または表示されない。
  • SOLD OUTの視認性が悪い
  • 各Apps(セールApp、販売期間設定App、予約販売Appなど)で表示されるステータスとのデザイン的整合性が取れていない
◯
 商品画像が正常に表示されているか
  • 登録商品数が25個未満の場合
  • 登録商品数が25個以上の場合
  • 画像のアスペクト比が保たれていない。(縦長、横長の画像が歪んでいないか)
  • IEの表示だけ画像の表示が崩れる。(IE非対応のCSSプロパティを使用している)
  • 追加で読み込まれた商品の表示が不適切。または表示されない。
◯
 「もっと見る」ボタンやスクロールに応じてajaxで商品を追加で読み込むことができるか
  • 登録されている商品数が25個未満なのに「もっと見る」ボタンが表示されている
  • これ以上追加で読み込む商品が無い状態なのに「もっと見る」ボタンが表示されている
  • 特定の条件の場合にJavaScriptエラーがある
◯
 ajaxで商品を追加読み込みをした場合、商品をクリック→商品ページ→ブラウザバックでTOPページに戻った場合にスクロール位置が保たれているか
  • ブラウザバックで戻った場合にスクロール位置が保たれておらず、毎回追加読み込みをしなければならない状況になる
◯
 商品の追加読み込みをスクロール量によって自動で読み込む実装にしている場合、アクセスできないコンテンツが無いかどうか
  • 自動で読み込まれるためフッターにたどり着けない
◯
 対応するAppsが正しく表示されているか
(セールApp、ラベルAppなど商品一覧の表示に関わるApps)		 ※詳細なチェックは各Appsの項目を参照してください

商品詳細

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品画像 商品画像が正常に表示されているか
  • 画像のアスペクト比が保たれていない。(縦長、横長の画像が歪んでいないか)
  • IEの表示だけ画像の表示が崩れる。(IE非対応のCSSプロパティを使用している)
  • 背景透過されているPNG画像を使用した場合、視認しにくい。複数の写真が重なってしまう。
◯
 画像が複数枚登録されている場合、すべての画像を正常に閲覧できるか(1枚の時、3枚の時、20枚の時などそれぞれ)
  • 画像のスライドが正常に動作しない(独自にスライドを実装した場合)
  • 画像枚数によってスライドデザインが崩れる(1枚~20枚)
  • IEでスライドが動作しない(プラグイン等が非対応)
◯
 商品名 商品名は正しく表示されているか
  • 背景色とのコントラストが足りず読みにくい
  • 商品名が短いときにデザインが崩れる
  • 商品名が長いときにデザインが崩れる
  • モバイル表示のときにデザインがくずれる
◯
 商品説明 商品説明文は正しく表示されているか
  • 背景色とのコントラストが足りず読みにくい
  • 商品説明が短いときにデザインが崩れる
  • 商品説明が長いときにデザインが崩れる
  • モバイル表示のときにデザインがくずれる
◯
 価格 価格は正しく表示されているか
  • 背景色とのコントラストが足りず読みにくい
  • 価格が6桁、7桁、8桁の時にデザインが崩れる
  • 英語・外貨対応App使用時、外貨表示の場合に桁数が多くなり崩れる
◯
 在庫が無い場合にSOLD OUT表記があるか
  • 在庫が無いことがユーザに伝わらない
◯
 注意文 {ItemAttentionTag}で表示される内容は正しく表示されるか
  • 文字が小さすぎて読みづらい
◯
 数量選択 商品の数量を選択できるか
  • クリックしても反応しない
◯
 バリエーション選択 商品にバリエーションが登録されている場合に正しくバリエーションを選択できるか
  • クリックしても反応しない
◯
 コンバージョンボタン カートに入れるボタンは正しく表示されるか
  • ボタンにスタイルがあたっていない
  • クリックしてもカートページへ遷移しない
◯
 ソーシャルボタン ソーシャルボタンは正常に機能するか
  • 正しくシェアできない
◯
 報告するボタン {IllegalReportTag} は正しく機能するか
  • デザインが崩れている
  • モーダル背景が表示されない
◯
 関連商品 関連商品が正しく表示されるか
  • 商品名、価格、画像、URLがダミーのままになっている。
  • ブラウザやOSの違いによりデザインが崩れる
◯
 関連商品がない場合にも見出しが表示されていないか
  • 関連商品の見出しが判定の外にあり、関連商品が無いのに見出しだけが表示されている
Pay ID あと払いウィジェット {ItemBnplBannerTag}は正しく機能するか
  • デザインが崩れている
  • ヘルプアイコンをクリックしても反応しない
◯
 Apps対応 セールApp、ラベルApp、販売期間設定App、予約販売App、デジタルコンテンツ販売App、レビューApp、送料詳細Appなど作成するテーマが対応する予定のAppの表示が正しいか ※詳細なチェックは各Appの項目を参照してください

Aboutページ

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ページコンテンツ {ShopIntroduction}が正しく設置され、管理画面の「ショップ設定」の「ショップの説明」に入力された内容が正常に表示されているか
  • ショップ説明が設置されていない
  • テキスト色、背景色、デザインオプションなどで設定された内容により配色として文字が読めない状態になっている
  • リンクがリンクであると判別できない文字色になっている

お問い合わせ

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 フォーム お問い合わせフォームが正しく設置され、入力ページ→確認ページ→完了ページと遷移し問い合わせができるか
  • 入力ページのみスタイルがあたっており、確認ページ以降のデザイン確認がされていない
  • input系のスタイルがブラウザのデフォルトのままになっている
  • 入力エリアの背景色が設定されておらず、透過してしまっている

プライバシーポリシー

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ページコンテンツ プライバシーポリシーが正常に表示され読むことができるか
(フォントサイズ、設定された背景色とテキスト色の濃淡、行間)
  • テキスト色、背景色、デザインオプションなどで設定された内容により配色として文字が読めない状態になっている

特定商取引法に基づく表記

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ページコンテンツ 特定商取引法に基づく表記が正常に表示され読むことができるか(フォントサイズ、設定された背景色とテキスト色の濃淡、行間)
  • テキスト色、背景色、デザインオプションなどで設定された内容により配色として文字が読めない状態になっている
◯
 電話番号認証が済んでいない場合、済んでいる場合のそれぞれのスタイルが正常か
  • 電話番号と認証済みは画像で出力されるため、背景色によって色が同化してしまい読めない状態になっている
◯
 電話番号認証が済んでいる場合に表示される「認証済み」ラベルをホバーした時に表示されるテキスト「有効であることが確認された正しい電話番号です。」がちゃんと読める配色になっているか
  • テキスト色、背景色、デザインオプションなどで設定された内容により配色として文字が読めない状態になっている

BASE Apps全般

以降のチェック項目に関しては、申請するテーマとして対応するAppsのみチェックを行ってください。
非対応のAppsに関してはテーマ販売ページのテーマ情報「対応Apps」のアイコンが半透明になります。

商品検索App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 商品検索Appをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
◯
 検索結果ページ 検索結果の商品一覧が正しく表示されるか ※商品一覧と同様のチェックをお願いします。
◯
 検索結果一覧で商品が多い場合、追加読み込みが正常に行われるか ※商品一覧と同様のチェックをお願いします。
◯
 「検索キーワードの検索結果」という表示が正常にされているか
  • 検索キーワードの文字数が多い場合に崩れる
◯
 検索結果が0件だった場合の表示が正常か
  • 0件だったことが表示されない
◯
 検索フォーム ショップページのアクセスしやすい場所に検索フォームが設置されていて、正常に検索を行うことができるか
  • 他の重要な要素の操作、閲覧を阻害している(画面に対して検索フォームが位置固定の場合などに起こりやすい

カテゴリ管理App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 カテゴリ管理Appをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
◯
 ナビゲーション グローバルナビゲーションやドロワーメニューから各カテゴリページへアクセスできるか
  • Appインストール済みなのにナビゲーションに表示されない
  • App未インストールなのにナビゲーションに表示されている
  • ナビゲーションのUIとしてカテゴリの大カテゴリ、中カテゴリへのリンクへアクセスしづらい
◯
 ナビゲーション カテゴリ数がかなり多い場合でも問題なく表示できるか
  • カテゴリ名の文字数、カテゴリ自体の数が多い場合にはみでる、切れる、想定外に折り返すなどでデザインが崩れ機能しない。
カテゴリページ パンくずメニューが表示されているか
◯
 現在表示しているカテゴリページの見出しがあるか
◯
 商品が登録されていないカテゴリページの表示は正常か
  • 「出品されている商品がありません。」の表示が考慮されていない
◯
 商品一覧 そのカテゴリの商品一覧が正常に表示されているか ※TOPページの商品一覧と同様のチェックをお願いします。
◯
 そのカテゴリの登録商品が多い場合、追加で商品が正常に読み込まれデザインが崩れていないか ※TOPページの商品一覧と同様のチェックをお願いします。
◯
 ajaxで商品を追加読み込みをした場合、商品をクリック→商品ページ→ブラウザバックでカテゴリページに戻った場合にスクロール位置が保たれているか
  • ブラウザバックで戻った場合にスクロール位置が保たれておらず、毎回追加読み込みをしなければならない状況になる

ラベルApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 ラベルAppをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
◯
 商品一覧 商品一覧にラベルが正常に表示されているか
  • 商品画像とラベルが重なっている場合、ラベルのエリアをクリックしても商品詳細ページへ遷移できない
商品詳細 商品詳細ページにラベルが正常に表示されているか
  • 他の要素のクリック領域を妨害している

Blog App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 BlogAppをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
◯
 ナビゲーション グローバルナビゲーションやドロワーメニューからBlog一覧ページへアクセスできるか
  • Appインストール済みなのにナビゲーションに表示されない
  • App未インストールなのにナビゲーションに表示されている
◯
 ブログ固定記事リンク TOPページに固定記事設定のされているブログ記事への導線が設置されているか
  • 設置されていない
  • 表示できない設定を選べてしまう
※TOPページに導線を設置することが必須です。
◯
 Blog一覧ページ 記事一覧のはじめに固定記事が正常に表示される
◯
 ブログ記事の画像が正常に表示される
  • 縦長の画像、横長の画像、表示領域に対して大きい画像、小さい画像が考慮されておらずアスペクト比が保てていない、はみ出す、拡大されすぎて画質が荒れる。
◯
 記事タイトル、公開日時、本文冒頭テキストが正常に表示される
  • 記事に画像がある場合、無い場合が考慮されておらず無駄な余白がができたり、逆に要素がくっついてしまってる
  • 記事タイトルが長い場合、短い場合が考慮されておらずデザインが崩れている
  • レスポンシブ表示が考慮されておらずモバイル表示でデザインが崩れている
◯
 記事数が16件以上のときに表示されるページ送りリンクが正常に表示されている
  • 記事数がかなり多い場合にモバイルで表示が崩れる
  • 記事数が15件以下のときにページ送りリンクが表示されてしまう
◯
 各記事へのリンクをクリックして正常に遷移できる
◯
 Blog記事ページ 記事タイトル、公開日時、記事本文が正常に表示されている
  • 記事タイトルが長い場合、短い場合が考慮されておらずデザインが崩れている
◯
 本文のスタイルが正常に表示されている
  • テーマのCSSでhtmlタグ(pタグ、hタグなど)に対してリセットを行っており、それが影響して記事のスタイルが崩れている
  • BlogAppで記事を書く時に設定できる「B」、「I」、「h」のスタイルがあたっていない
  • 画像と隣接するとき、見出しと隣接するときなど要素の組み合わせにより余白が正常ではない
  • 記事本文のはじめに表示される要素がテキスト、画像などのパターンが考慮されておらず余計な余白がある
  • 記事本文内のリンク色が設定されていない、背景と同化して見えない。
◯
 画像が正常に表示されている
  • 縦長の画像、横長の画像、表示領域に対して大きい画像、小さい画像が考慮されておらずアスペクト比が保てていない、はみ出す、拡大されすぎて画質が荒れる。
◯
 埋め込みのYouTubeが正常に表示される
  • モバイル表示ではみ出す
  • アスペクト比が不自然になる
◯
 埋め込みの商品リンクが正常に表示される
  • モバイル表示ではみ出す
  • アスペクト比が不自然になる
  • 枠線だけが伸び、余白が不自然になる
◯
 記事のシェアボタンが正常に動作する
  • 背景と同化してシェアボタンが見えない
  • 背景に対してローコントラストとなり見づらい

セールApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 セールAppをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストールの場合でもセール価格表示のエリアが確保されてしまい不自然な余白が表示される
◯
 商品一覧 セール価格と割引率が正常に表示され、セール価格であることがユーザに伝わるように強調されているか
  • 追加読み込みの商品にセール価格が表示されない
◯
 セールが設定されてる場合で商品の価格の桁数が多い場合にデザインがくずれないか
  • 商品の価格の桁数が6桁、7桁、8桁など多い場合に不自然に改行される
◯
 在庫が無くSOLD OUT状態でも価格はセール価格が表示されているか
  • 通常価格しか表示されない
※通常価格しか表示されないと、在庫が補充された瞬間にセール価格に戻るので不自然となります
◯
 商品詳細 セール価格と割引率が正常に表示され、セール価格であることがユーザに伝わるように強調されているか
◯
 セールが設定されてる場合で商品の価格の桁数が多い場合にデザインがくずれないか
  • 商品の価格の桁数が6桁、7桁、8桁など多い場合に不自然に改行される
◯
 在庫が無くSOLD OUT状態でも価格はセール価格が表示されているか
  • 通常価格しか表示されない
※通常価格しか表示されないと、在庫が補充された瞬間にセール価格に戻るので不自然となります

英語・外貨対応App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 英語・外貨対応Appをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストール状態でもセレクトボックスの場所が確保されてしまい不自然になる
◯
 言語・通貨切替セレクト 表示が正常、かつ言語切替、通貨切り替えが正常に行える
  • セレクトボックスが他の要素の閲覧、操作を妨害している
  • 切り替えても表示が変わらない
◯
 翻訳 ローカライズテキストタグが正常に設置され、英語表示の場合に正しく翻訳されている
  • タグが使われていないため翻訳されない
◯
 商品一覧
(TOP、カテゴリ、商品検索結果)		 正常に外貨表示されデザインが崩れていない
  • 商品の価格の桁数が6桁、7桁、8桁など多い場合に不自然に改行される
  • 「￥」記号の後ろで改行されてしまう
  • 在庫が無い場合のSOLD OUT状態、セール価格表示など複合的な条件の時にデザインが崩れる
◯
 商品詳細ページ 正常に英語・外貨表示されデザインが崩れていない
  • 英語表記の場合、アルファベットの単語が不自然な箇所で改行され読みづらい

BASEロゴ非表示App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 カートリンク、BASEロゴリンク Appインストール済み(有料)の場合に正常にBASEロゴが消える ※テーマ側での制御は特にありません。表示はショップオーナーの課金状況によって自動で切り替わります。
※未課金の状態で、CSSでBASEロゴを非表示にする行為は禁止されています

デジタルコンテンツ販売App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 商品のデジタルコンテンツのファイル名が商品詳細ページの中でユーザに伝わるように表示されているか
  • タグ自体が設置されておらずファイル名が表示されていない
  • ファイル名が長く、英数字とアンダースコアでファイル名が構成されている場合1単語扱いとなり、正常に改行されず想定外にエリアを突き抜ける

レビューApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 商品詳細ページにレビューが正しく表示される
  • レビュー内のテキストと背景がローコントラストとなり読みづらい
  • なんらかのJavascriptが動作を阻害しレビューのアコーディオンが開かない、タブ切り替えが効かない、スクロールできないなどの動作不良を起こしている

販売期間設定App

詳細なチェックを行うには下記ページで販売期間の表示の起こりうるケースをご確認ください。
販売期間表示パターン

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 販売期間設定Appをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストールの場合、販売期間ステータスを表示するエリアが確保されて余計な余白ができる

予約販売App

詳細なチェックを行うには下記ページで予約期間の表示の起こりうるケースをご確認ください。
予約販売表示パターン

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 予約販売Appをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストールの場合、予約期間ステータスを表示するエリアが確保されて余計な余白ができる

メッセージApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 下部固定のメッセージアイコンや「ショップに問い合わせる」ボタンによって、重要な要素の閲覧・操作が阻害されないかどうか
  • カートに入れるボタンが下部固定などの場合、ボタンが押せない
  • フッターがある場合、メッセージアイコンがフッターリンクでの遷移を阻害している
◯
 メッセージウィンドウ メッセージ内の要素が正常に表示される
  • メッセージテキスト
  • 商品情報（商品名、商品画像）
  • ユーザが通知を受け取るための情報表示エリア
  • 表示位置がずれている
  • テキスト色、背景色、デザインオプションなどで設定された内容により、メッセージウィンドウの要素がローコントラストになり、視認性が低い状態になる。
◯
 メッセージウィンドウ 画像に関する表示や動作が正常か
  • メッセージ入力エリア内の画像アイコンタップで画像選択
  • 画像送信前のプレビュー
  • プレビュー画像のバツボタンで削除
  • 画像送信後のサムネイルの表示
  • サムネイルのバツボタンで画像削除
  • サムネイルタップで拡大表示
  • 拡大表示時のバツボタンタップで閉じる
  • 表示位置がずれている
  • 画像のアスペクト比が正しくない
  • 各要素をタップしても動作しない

送料詳細設定App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 送料詳細を表示するモーダルが正常に表示される
  • 上位のスタイル指定によりモーダル内のスタイルが崩れる

商品説明カスタムApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 意図した箇所に商品説明カスタムの内容が表示されているか
  • 上位のスタイル指定によりブロック内のスタイルが崩れる

抽選販売App

詳細なチェックを行うには下記ページで抽選販売のテストパターンをご確認ください。
抽選販売テストパターン

必須
項目
チェック内容
よくあるNG事例・注意事項
全般 抽選販売Appをインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストールの場合、抽選販売ステータスを表示するエリアが確保されて余計な余白ができる

テイクアウトApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 営業時間・受け取り店舗を表示するモーダルが正常に表示される
  • 上位のスタイル指定によりモーダル内のスタイルが崩れる

商品オプションApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ オプション名と選択UI（またはテキスト入力UI）の関係性はわかりやすいか
  • オプション間の余白が狭く、オプション名と入力UIの関係がわかりにくい
  • オプション名とオプション選択（または入力）UIの間の余白が、オプション同士の余白より大きいため、オプション名とオプション選択UIの関係性がわかりにくい
  • 種類および数量の選択UIを表示していた場合、商品オプションの選択UIまたはテキスト入力UIの表示（レイアウト・スタイル）が、種類および数量の表示と揃っていないため、外観に意図しない不整合をもたらしている
◯
 選択式オプションが正しく表示されるか
  • オプション選択UIがエリア外にはみ出している
◯
 文字入れ式オプションが正しく表示されるか
  • 入力フォームが極端に小さく、入力した文字列が読みづらい
◯
 入力エラー発生時の表示は正しいか
  • 文字入れ式オプションの文字数が入力上限を超えているのに、「文字数上限を超えました」のエラー文が表示されない
  • 文字入れ式オプションの文字数が入力上限を超えた時に、「カートに入れる」ボタンがdisabledであることが視覚的にわかりづらい
  • エラー文と他の本文との文字色が同じで、目立たない
  • エラー文の文字色と背景色のコントラストが低く、読みづらい
  • 文字入れ式オプションのフォームが空欄のまま「カートに入れる」ボタンを押した時に、「カートに入れる」ボタンがdisabledであることがわかりづらい
◯
 有料オプションの金額表記が正しいか
  • 金額（数値）の途中で改行が起きている
  • 金額の桁数が多い場合や外貨表示時など、金額表示の文字数が多かった場合に、文字が見切れてしまう
◯
 入力ガイドテキストが正しく表示されるか
  • 入力ガイドテキストを文字数上限まで設定していた場合に、文面の一部が見切れる
  • 入力ガイドテキストがオプション名ラベルの右に表示され、意図せず違和感を生じている
◯
 画面幅を変えてもレイアウトに不具合ないか
  • スマホ、タブレットなどの各種デバイスで表示した場合や、PCでブラウザのウィンドウ幅を変えた場合など、表示画面幅を変更した際にレイアウトが意図しない状態になる

コミュニティApp

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 ナビゲーション コミュニティAppをインストール済みでコミュニティ開設中、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストール状態でもナビゲーションにリンクが表示される
商品一覧ページ 会員限定商品のラベルが表示されているか
  • 会員限定商品以外の商品にラベルが表示されている
  • 上位のスタイル指定によりラベルのスタイルが崩れる
◯
 商品詳細ページ 会員限定商品についての情報が表示されているか
  • テキスト色、背景色、デザインオプションなどで設定された内容により配色として文字が読めない状態になっている
◯
 会員限定商品の場合にカートに入れるボタン・Pay IDログインボタンが表示されているか
  • タグ自体が設置されておらず、表示されていない
  • タグを正しく設置できておらず、会員限定商品以外のデザインが崩れている（詳細は 購入ボタンの制御に関する変数 を参照してください）
◯
 Pay IDログイン前にカートに入れるボタンを押下した際のモーダルが正常に表示されているか
  • 上位のスタイル指定によりモーダル内のスタイルが崩れる
  • なんらかのJavaScriptが動作を阻害しモーダルが表示されないなどの動作不良を起こしている
◯
 コミュニティページ コミュニティコンテンツが表示されているか
  • タグ自体が設置されておらず、表示されていない（詳細は コミュニティページ を参照してください）
  • 上位のスタイル指定によりデザインが崩れる
  • コミュニティ名が最大文字数の場合はみだして表示される
  • 商品一覧のレイアウトが崩れている
  • 会員限定公開URLが3つの場合領域からはみ出して表示される
  • 会員限定公開URLのリンク部分の視認性が低い
  • 退会するモーダル：レスポンシブ対応されているか
◯
 Pay IDログイン前、ログイン後の表示が崩れなく表示されているか
  • 上位のスタイル指定によりデザインが崩れる
◯
 退会するモーダルが正常に表示されているか
  • 上位のスタイル指定によりモーダル内のスタイルが崩れる
  • なんらかのJavaScriptが動作を阻害しモーダルが表示されないなどの動作不良を起こしている

再入荷自動通知App

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 再入荷自動通知Appをインストール済みの場合、未インストールの場合のどちらのケースでもデザインが崩れていないか
  • 再入荷自動通知Appが有効で商品がSOLD OUT状態の場合、カートボタンの文言が「再入荷通知を受け取る」になった際、ボタンのスタイルが崩れる
  • テキスト色、背景色、デザインオプションなどで設定された内容により、カートボタンの視認性が悪い
◯
 再入荷のお知らせを希望するモーダルが正常に表示されている
  • 上位のスタイル指定によりモーダル内のスタイルが崩れる
  • なんらかのJavaScriptが動作を阻害しモーダルが表示されないなどの動作不良を起こしている

年齢制限App

国税庁による酒類販売における表示基準を満たすためには、酒類販売時の注意文言のフォントサイズが重要となりますのでご注意ください。

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 商品詳細ページ 年齢制限Appをインストール済みで「酒類」を設定した場合、酒類販売時の注意文言が正しく表示されている
  • 酒類販売時の注意文言が表示されない
  • 背景色に黒など濃い色を指定した時に、ローコントラストとなり酒類販売時の注意文言の閲覧が難しい
◯
 酒類販売時の注意文言には商品価格よりも大きいフォントサイズが指定されており、商品価格よりも大きく表示されている
  • 注意文言のフォントサイズに商品価格以下の値が指定されている
◯
 商品をカートに入れる際の年齢確認モーダルが正常に表示されている
  • 上位のスタイル指定によりモーダル内のスタイルが崩れる
  • なんらかのJavaScriptが動作を阻害しモーダルが表示されないなどの動作不良を起こしている
コミュニティAppに対応する場合、コミュニティ限定商品の商品詳細ページにて、コミュニティ購入モーダルと年齢確認モーダルが正常に表示されること
  • コミュニティ購入モーダル内の各種「会員になる」ボタン押下後に年齢確認モーダルが表示されない

お知らせバナーApp

詳細なチェック項目は、下記ページで「お知らせバナー App」の動作のチェックをご確認ください。
「お知らせバナー App」の動作のチェック

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 「お知らせバナー App」をインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストールの場合、お知らせバナーを表示するエリアが確保されて、余計な余白ができてしまう
  • お知らせバナーが、ほかの要素と重なってしまう
◯
 全般 デザイン > お知らせバナー で設定したテキスト・カラー・アイコンがお知らせバナーに正常に反映されているか
  • 40文字（最大文字数）＋アイコンで、デザインが崩れてしまう
  • アイコンやテキストが小さく、視認性が悪い
◯
 テーマ設定 お知らせバナーをデザインするためのデザインオプション（テーマ設定）を独自に設定していないか

メールマガジンApp

詳細なチェック項目は、下記ページで「メールマガジン App」の動作のチェックをご確認ください。
「メールマガジン App」の動作のチェック

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 「メールマガジンApp」をインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • 未インストールの場合、メールマガジン登録フォームを表示するエリアが確保されて、余計な余白ができてしまう
  • メールマガジン登録フォームが、ほかの要素と重なってしまう
◯
 全般 「メールマガジン登録フォーム」とわかるような見出しをつけているか
  • 見出しがなく、「メールアドレス入力欄」と「登録ボタン」しか表示されていない
全般 見出し、説明文などにテキスト入力フィールドを使用する場合、初期値が入力されていること
  • 初期値が入力されていないと、テーマ購入者が「メールマガジン登録フォーム」と判断できないため
◯
 全般 「登録」ボタンクリック後の結果メッセージが表示されるか
  • 結果メッセージの視認性が悪い
  • 結果メッセージが見切れている

メンバーシップApp

詳細なチェック項目は、下記ページで「メンバーシップApp」の動作のチェックをご確認ください。
「メンバーシップApp」の動作のチェック

必須
項目
チェック内容
よくあるNG事例・注意事項
◯
 全般 「メンバーシップApp」をインストール済み、未インストールのどちらのケースでもデザインが崩れていないか
  • テーマ設定で指定したテキストカラーが反映されていない
◯
 「メンバーシップページ」「メンバーシップ・マイページ」「メンバーシップ・ログインページ」のコンテンツが表示されているか
  • タグ自体が設置されておらず、表示されていない（詳細は メンバーシップページ を参照してください）
  • 上位のスタイル指定によりデザインが崩れる
◯
 メンバーシップ退会モーダルが正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • 上位のスタイル指定により他の要素の下に隠れる
  • スマートフォン環境で表示が崩れる
  • メンバーシップが非公開時のモーダルだけ正常に表示されない（詳細は メンバーシップ非公開状態 を参照してください）
  • なんらかのJavaScriptが動作を阻害しモーダルが表示されないなどの動作不良を起こしている
◯
 Pay IDログイン前、ログイン後の表示が崩れなく表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • 上位のスタイル指定により他の要素の下に隠れる
  • スマートフォン環境で表示が崩れる
  • なんらかのJavaScriptが動作を阻害しモーダルが表示されないなどの動作不良を起こしている
◯
 ナビゲーション 「メンバーシップページ」「メンバーシップ・マイページ」の2つのリンクが表示されるか
  • リンクを表示するエリアが確保されて余計な余白ができる
  • 「メンバーシップ・マイページ」へのリンクが表示されていない
◯
 商品詳細ページ 商品購入によって獲得できるポイントの情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • ポイント名が最大文字数の場合にはみ出して表示される
  • 獲得予定（獲得可能な）ポイント数の桁数が5桁以上の場合にはみだして表示される
  • 獲得予定ポイントの下に表示される「メンバーシップに登録」のリンクが表示されていない
◯
 メンバーシップページ メンバーシップに関する情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • 最大文字数のメンバーシップ名・メンバーシップ説明の場合にはみ出して表示される
  • メイン画像が存在しない場合に余分な余白ができる
  • 「メールマガジンを受け取る」のチェックボックスにチェックが入っているか判別できない
◯
 メンバーシップのポイントに関する情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • ポイント名が最大文字数の場合にはみ出して表示される
◯
 メンバーシップの特典に関する情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • 特典名が最大文字数の場合にはみ出して表示される
◯
 メンバーシップ・マイページ メンバーシップ会員に関する情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • 最大文字数のメンバーシップ名・ショップ名の場合にはみ出して表示される
  • メイン画像が存在しない場合に余分な余白ができる
◯
 会員のポイントに関する情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • ポイント名が最大文字数の場合にはみ出して表示される
  • 背景が暗い場合に、「ポイント履歴」「有効期限について」などのテキストリンクが読めなくなる
◯
 メンバーシップの特典に関する情報が正常に表示されているか
  • 上位のスタイル指定によりデザインが崩れる
  • 特典名や特典の説明文が最大文字数の場合にはみ出して表示される
◯
 共通フッター メンバーシップAppをインストールしている場合に「会員規約」へのリンクが常にアクセスできる場所に表示されているか
  • メンバーシップAppをインストールしていない場合にも表示される
  • コントラスト比が低く、視認性が悪い
← テーマのアップデート申請全体構成 →