運用サポート(平日10:00~17:00) 06-6485-6485
コマースクリエイター未利用コマースクリエイター移行中(有効)コマースクリエイター利用中説明を表示 ▼

アイテム一覧(画像・CSS・JavaScriptなど)

×

マニュアル閲覧上の注意

店舗の状態にあわせて、上のボタンからいずれかを選択してください。表示される項目が変更されます。

コマースクリエイター未利用
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用されている場合(コマースクリエイターをご利用でない場合)はこちらを選択してください。
コマースクリエイター移行中(有効)
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用しながら、コマースクリエイター管理画面が使用できる場合はこちらを選択してください。
コマースクリエイター利用中
コマースクリエイター管理画面で構築し、コマースクリエイター専用ECサイト(ユーザー画面)で店舗を新規構築・運用されている場合(以前からのユーザー画面をご利用でない場合)はこちらを選択してください。

上記のボタンは再選択できます。店舗の状態がわからない方はコマースクリエイターご利用状況の確認方法についてをご覧ください。

コマースクリエイター>アイテム一覧

ECサイトに表示する画像やCSS・JavaScriptなどのファイルを登録、管理できます。

作業されているPCから管理画面にてアップロードします。登録した画像の置換文字をコピーできます。

設定項目

  • 関連情報
    管理画面からの画像登録の他、FTPやCSVを利用した画像一括登録や一括削除などについて

アイテムとは

アイテムとは、ECサイトに表示する画像やCSS・JavaScriptなどのファイルを管理する機能です。
アイテム一覧では、アイテムを検索し、一覧で表示でき、アイテムのパス・更新日時・サイズを確認できます。画像は拡大して確認できます。アイテムの変更(ファイル入れ替え)、置換文字のコピーができます。 またアイテムはこの画面からアップロードして追加できます。

アップロードするアイテムを準備します。作業されているPCから管理画面にてアップロードします。

アイテム一覧

アイテムを検索し、一覧表示できます。

検索条件

キーワード
アイテムを「アイテム名」「アイテム置換文字」「パス」で検索できます。部分一致で検索できます。半角・全角や英字の大文字・小文字については、区別して検索できます。複数指定する場合は、空白で区切ってください。AND検索になります。
パス
アイテムをパスで検索できます。部分一致で検索できます。
種類
アイテムの種類を指定して検索できます。画像・CSS・JS(JavaScript)・その他から検索できます。複数指定した場合は、OR検索になります。
管理タグ
アイテムを管理タグで検索できます。管理タグ欄を選択すると、候補が表示されます。インクリメンタルサーチ機能があり、文字を入力するたびに前方一致で候補が絞込まれます。
検索するボタン
指定した条件でアイテムを検索できます。

削除する

チェックしたアイテムを削除するボタンを押下すると、アイテムをまとめて削除できます。

一覧表示項目

選択
削除する際にアイテムを選択します。
パス
アイテムのパスが表示されます。項目名を選択すると並び替えできます。
画像
画像が表示されます。画像によっては縮小表示されます。
画像を押下すると、拡大表示できます。画像ファイル以外はアイコンが表示されます。
種類 アイコン 説明
画像欄に表示されるアイコン
画像ファイル 容量が大きい場合など、サムネイル表示できない画像ファイルです。
cssファイル cssファイルです。
JavaScriptファイル JavaScriptファイルです。
PDFファイル PDFファイルです。
フォントファイル フォントファイルです。(ttfファイル、woffファイル)
テキストファイル テキストファイルです。
その他のファイル HTMLファイル他、その他の形式のファイルです。
アイテム名
アイテム名が表示されます。一括アップロード時はファイル名が登録されています。
項目名を選択すると並び替えできます。
更新日時
アイテムの更新日時が表示されます。項目名を選択すると並び替えできます。
サイズ
アイテムのファイルサイズが表示されます。項目名を選択すると並び替えできます。
変更
アイテムを変更します。変更ボタンを押下すると、アイテム変更画面へ遷移します。
置換文字コピー
押下すると、アイテム置換文字をコピーできます。

アイテム置換文字が利用できる場所

表示したい箇所に置換文字を貼り付けてください。

アイテムのURLについて

アイテムのパス(URL)は以下となります。「itembox.design」はアイテム管理専用サーバのドメイン名(システム固定)となります。

https://{店舗key}.itembox.design/item/{アイテム一覧で指定したパス}

「静的なHTML」については、URLが異なります。HTMLファイルをアイテムとしてアップロードするをご覧ください。また自動生成のトップページをご利用にならない場合に、静的なHTMLでトップページを管理する場合については、トップページを静的HTMLファイルで運用するをご覧ください。

アイテム機能では、画像ファイルなどを別ドメイン(itembox.design)サーバで管理・配信することで、アクセス数が増えた場合にも快適にご購入いただけるシステムを実現しています。

最新ファイルを読み込ませる記載方法

CSSに画像ファイルなどのURLを直接記載する場合は、以下のように「タイムスタンプ」を記載してください
「最新ファイルに変更したにもかかわらず表示が変わらない(キャッシュをクリアしなくてはならない)」などを防げます。

https://{店舗key}.itembox.design/item/{アイテム一覧で指定したパス}?t=[タイムスタンプ]

タイムスタンプは、「年月日秒」単位まで指定可能です。(秒数はアップロード時以前の秒であれば、おおよそで構いません。)

【例】2020年7月9日5時00分30秒に更新したファイルを読み込ませたい場合
https://{店舗key}.itembox.design/item/sample.jpg?t=20200709050030

※ファイルを更新した場合は、タイムスタンプも更新してください。

※ファイルをアップロードする前にファイルのパスを記述したページを公開した場合にも、キャッシュが発生(ファイルがない状態をキャッシュ)する場合がありますので、その際には同様にタイムスタンプを記述してください。

初期登録されているアイテム

いくつかのアイテムが初期登録されています。スタートアップテーマの初期設定アイテム一覧をご覧ください。

アイテムの容量

保存できるアイテムの容量はプランによって違います。

保存済みのアイテムの合計ファイルサイズとアイテムを保存できるディスクサイズが表示されます。
十分な空き領域がなければ、アイテムをアップロードできません。
空き領域が少ない場合は、不要なアイテムを削除してください。

※表示されている容量は、commerce creator>アイテムの機能にてアップロードされた画像の合計ファイルサイズとなります。
運用>商品管理からアップロードした商品画像は含まれておりません。
店舗全体のサーバ容量を確認するには、管理>店舗状況にてご確認ください。

管理>店舗状況「画像容量状況」

アイテム追加

一覧にアイテムがない場合は、アップロードできます。

アイテムはファイル単位でアップロードできます。

アイテムをドラッグする

アイテム一覧左下のアップロード領域(「アップロードするファイルをドロップしてください。」と表示されたエリア)に、アップロードする画像ファイルをマウスでドラッグして、ドロップしてください。
または、アイテムをアップロードするボタンを押下して、画像ファイルを選択します。アイテム追加ダイアログが表示されます。

複数のファイルをまとめてアップロードする

複数のファイルをまとめてアップロードする場合は、FTPサーバを利用すると効率的です。

FTPにてアップロードサーバーに接続し、「/itembox/item/」ディレクトリ配下に、FTPソフトを用いてアップロードできます。

アイテム名
アイテムの名称ですが、アップロードされたファイル名になります。
URL
「店舗KEY.itembox.design/item/アップロードされたファイル名」になります。
FTPソフトを用いて、/item/配下に直接ディレクトリを作成できます。
管理タグ
設定されません。アイテム一覧から変更するボタンを押下し、個別に管理タグを設定してください。

アイテム新規登録

アイテム名
アイテムの名称を入力します。未入力の場合は、アップロードされたファイル名になります。
パス
アイテムのファイルパスを指定できます。「https://店舗KEY.itembox.design/item/」に続くパスを指定できます。
/item/以下のディレクトリにあたる部分は、任意に指定できます。ファイルパスにはファイル名を含んで入力してください。ファイル名まで指定すると、指定されたファイル名で保存できます。未入力の場合は、「https://店舗KEY.itembox.design/item/アップロードされたファイル名」になります。
実際のURLは、静的HTMLファイル画像などそれ以外のファイルで異なります。
管理タグ
アイテムにあらかじめ追加された管理タグの中から選択して設定できます。パーツ追加・変更画面などで、管理タグを使用してアイテムを検索できます。
同じフォルダやファイルは上書きする
チェックしてアップロードすると、同じパスのアイテムを上書きできます。
保存する
アップロードされたアイテムとアイテム設定を保存します。
  • アイテムにアップロードできるファイルの最大容量は、1ファイルあたり30MBです。(管理画面・FTPサーバ共通)
  • 動画ファイルについては、1ファイルで30MBを超える場合がございます。
    外部の動画配信サービス(【参考】虎の巻)をご利用ください。CMSサーバー(VPS)への配置もお控えください。
  • パターンパーツなどで、画像として取り扱うファイル形式はJPEG( jpeg / jpg )、GIF(gif)、PNG(png)、SVG(svg)となります。
  • 登録可能な画像ファイルは縦・横とも9,999ピクセルまでとなります。

アイテムを変更する

画像サムネイル/ファイルアイコン
画像サムネイルまたはファイルアイコンが表示されます。アップロードボタンを押下すると、ファイル選択ダイアログが表示され、新しいファイルをアップロードできます。新しいファイルをアップロードすると、アイテムを入れ替えられます。
アイテム名
アイテムの名前です。
パス
アイテムのパスです。変更できません。
管理タグ
アイテムに管理タグを設定できます。管理タグでアイテムを検索できます。
同じフォルダやファイルは上書きする
チェックしてアップロードすると、同じアイテムを上書きできます。
保存する
アップロードされたアイテムとアイテム設定を保存します。

アイテムを一括削除する

削除対象として選択されたアイテムの件数が表示されます。
アイテムを削除するボタンを押下すると、選択されたアイテムを一括削除します。削除したアイテムは復元できません。

HTMLファイルをアイテムとしてアップロードする

静的HTMLファイルのアップロード

アイテムボックスには自動生成ではない(静的に作成した)HTMLファイルをアップロードできます。

  • URLは「https://店舗ドメイン/s/xxxxx.html 」となります。(/s/以降のパスは指定いただけます。)
    入力補助機能として、静的HTMLファイル(拡張子が html または htm)のファイルを選択した場合、「パス」欄に自動的に「s/ファイル名」と入力されます。
  • 「/s/」配下には、htmlファイルおよびJavaScriptファイルのみ配置できます。
    htmlファイル・JavaScriptファイル以外をアップロードすると正しく読み込めなくなる場合があります。その他の形式のファイルは、パスに「/s」以外を指定してください。
  • アイテムボックスの画像を表示する場合、アイテム置換文字は使用できません。画像のリンクは、HTML内でURLを絶対パス(アイテムのドメイン)で記載してください。

静的HTMLファイルには、置換文字による会員情報の表示や、その他パーツ表示などのコマースクリエイターの機能はご利用いただけません。

静的HTMLファイルで運用する特殊なページ

以下のページはアイテムとしてアップロードされた静的なHTMLファイルを使用しています。任意の内容に変更できます。

ページ パス URL
エラーページ /s/error.html https://店舗ドメイン/s/error.html
メンテナンスページ /s/maintenance.html https://店舗ドメイン/s/maintenance.html
notFoundページ /s/notFound.html https://店舗ドメイン/s/notFound.html

notFoundページ(/s/notfound.html)と、ページが見つかりません(/p/notfound)について

ページ一覧にある「ページが見つかりません」は、自動生成ページのURLにて該当ページがない場合に表示されます。具体的には「商品グループ・商品詳細(店舗ドメイン/c/)」「バンドル商品一覧(店舗ドメイン/b/)」「フリーページ(店舗ドメイン/f/)」「マイページ(店舗ドメイン/my/)」「左記以外のページ(店舗ドメイン/p/)」です。
それ以外のURLで該当ページがない場合は、アイテムにあるnotFoundページ(店舗ドメイン/s/notFound.html)が表示されます。
※「アイテムの静的HTMLのディレクトリ(店舗ドメイン/s/)」で該当ページがない場合は、システム制御(変更不可)のnotfoundページが表示されます。

商品画像アイテムがアップロードされるサーバのnotFoundページは別のファイルで固定表示となり、変更できません。

トップページを静的HTMLファイルで運用する

トップページをアイテムにアップロードした静的HTMLファイルで運用できます。アイテムとして扱えるため、ファイル変更により更新できます。

ご利用いただくには、ページ・URL一覧にある「トップページ(自動生成)」から、アイテム(静的HTMLファイル)への切り替え作業(サーバ作業)が必要となります。ご希望の場合はフューチャーショップサポートへお問い合わせください。

アイテムのパスは「/top/index.html」になります。URLは固定です。
トップページのURLは、「https://店舗ドメイン/(index.html)」となります。
(通常のアイテムは「/top/」には配置できません。)

アイテムでトップページを運用する場合、置換文字による会員情報の表示や、その他パーツ表示などのコマースクリエイターの機能はご利用いただけません。

JavaScriptファイルを店舗ドメインで読み込む

アイテムのパス「/s/」配下にはHTMLファイルの他に、JavaScriptファイルをアップロードできます。URLは「https://店舗ドメイン/s/xxxxx.js 」となります。(/s/以降のパスは指定いただけます。)
JavaScriptを使用するにあたって、店舗ドメイン配下に配置する必要のあるJavaScriptファイルのみアップロードしてください。

ファビコンについて

アイテムボックスには、ファビコンをECサイト(店舗)ドメインの直下にアップロードできます。ファビコンはブラウザでECサイトを表示したり、ブックマークに追加した際にタイトルの横に表示される画像です。

アイテムのパスは「/top/favicon.ico」になります。URLは固定です。
favicon.icoファイルのURLは、「https://店舗ドメイン/favicon.ico」となります。
フューチャーショップ独自のファビコンが初期設置されています。変更するボタンから「アイテム変更」モーダルを表示し、アップロードボタンから任意のファビコンファイルに差し替えてください。
(通常のアイテムは「/top/」には配置できません。)

サーチエンジン用ファイルをアップロードする

サーチエンジン用のファイルは、ECサイト(店舗)ドメインの直下にあることが指定されています。SEO施策などで必要な場合、固定のパスを指定し、必要なファイルをアップロードしてください。

robots.txtファイルについて

アイテムボックスには、robots.txtをECサイト(店舗)ドメインの直下にアップロードできます。

アイテムのパスは「/top/robots.txt」になります。URLは固定です。
robots.txtファイルのURLは、「https://店舗ドメイン/robots.txt」となります。
(通常のアイテムは「/top/」には配置できません。)

なお、robots.txtファイルの詳細については、robots.txt を使用して URL をブロックする(Search Console ヘルプ)をご覧ください。

サイトマップについて

アイテムボックスには、サイトマップ用ファイルをECサイト(店舗)ドメインの直下にアップロードできます。サイトマップのうち、テキスト形式およびXML形式に対応しています。

アイテムのパスは「/top/sitemap.txt」「/top/sitemap.xml」「/top/map.xml」のいずれかになります。URLは固定です。
サイトマップのURLはそれぞれ「https://店舗ドメイン/sitemap.txt」「https://店舗ドメイン/sitemap.xml」「https://店舗ドメイン/map.xml」となります。
(通常のアイテムは「/top/」には配置できません。)

コマースクリエイター>ページ一覧コマースクリエイター>フリーページ一覧には「全ページ情報出力」機能があります。「CSVで出力」「出力項目:URL」を選んでダウンロードすると、サイトマップの作成に便利です。(ダウンロードされたファイルの内容をご確認ください。)

なお、サイトマップの詳細については、サイトマップを管理する(Search Console ヘルプ)をご覧ください。

CMS(VPS)オプションをご利用店舗様への注意点

CMSオプションをドメイン直下で利用している場合でも、以下のファイルはアイテムボックスのtopフォルダ内におく必要があります。
「/top/robots.txt」「/top/sitemap.txt」「/top/sitemap.xml」「/top/map.xml」

※ただし別ファイル名であれば、CMSサーバーの直下に置くことが可能です。
(例)sitemap2.xml

関連情報

コマースクリエイターの商品画像登録について
コマースクリエイターでは商品画像の概要と仕様について解説しています。
商品画像登録(コマースクリエイター)
CSVを利用した商品画像の一括登録方法です。
商品画像削除(コマースクリエイター)
CSVを利用した商品画像の一括削除方法です。
FTPサーバから商品画像・商品グループ画像・アイテムをアップロード
商品画像・商品グループ画像・アイテムをFTPサーバからアップロードして登録する方法です。
運用>商品管理>商品画像設定(コマースクリエイター)
商品登録の際に商品画像を管理画面から登録する方法です。
運用>商品管理>商品グループ管理(新規登録・編集)-グループイメージ画像(コマースクリエイター)
商品登録の際に商品グループ画像を管理画面から登録する方法です。

項目表示について

各項目は「以前からのECサイト用」「コマースクリエイター用」「共通」の3種類があります。「コマースクリエイター移行中(有効)」選択時は全ての項目と説明が表示されます。

・以前からのECサイト用項目(コマースクリエイターでは使用しない):右側にこちらの色の点線が表示されます。

・コマースクリエイター専用ECサイト用の項目(以前からのECサイトには影響しない):右側にこちらの色の点線が表示されます。

・上記以外は共通で使用する項目です。(何も表示されません。)

×

店舗の状態にあわせて、下のボタンからいずれかを選択してください。

コマースクリエイター未利用 コマースクリエイター移行中(有効) コマースクリエイター利用中
コマースクリエイター未利用
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用されている場合(コマースクリエイターをご利用でない場合)はこちらを選択してください。
コマースクリエイター移行中(有効)
以前からの管理画面で構築し、以前からのECサイト(ユーザー画面)で店舗を構築・運用しながら、コマースクリエイター管理画面が使用できる場合はこちらを選択してください。
コマースクリエイター利用中
コマースクリエイター管理画面で構築し、コマースクリエイター専用ECサイト(ユーザー画面)で店舗を新規構築・運用されている場合(以前からのユーザー画面をご利用でない場合)はこちらを選択してください。

再度選択できますので、店舗の状態がわからない方はいったん「有効」をお選びください。
詳しくはコマースクリエイターご利用状況の確認方法についてをご覧ください。