コマースクリエイターご利用店舗様専用の記事です
また、スタートアップテーマをご利用されている方向けの内容です

スタートアップテーマのトップページにて配置されている、
FINAL SALE実施中、スタッフのおすすめ、NEW ITEM 箇所のバナーの変更についてご案内いたします。

こちらの箇所は「コラムパーツ」にて設定されています。
コラムパーツを利用すると画像の表示や、画像と文字のセットの表示を簡単に行うことが可能です。

また、簡単な設定変更で横に並べる数を変更することも可能です。

目次

１：レイアウト→コラムパーツの変更

２：コラムパーツの変更

２－１：コラムの変更

２－２：コラムの削除

２－３：コラムの追加

３：コラムを横に並べる数の指定

４：パーツの保存

１：レイアウト→コラムパーツの変更

commerce creator＞テーマ＞レイアウト と進み、
種類箇所の「トップページ」にチェックを入れ、
「検索する」をクリックしてください。

表示されたトップページレイアウト箇所右側の をクリックして
「レイアウト変更」画面を開いてください。

レイアウト変更画面左側のメインエリア箇所の をクリックして、
その後に表示されるコンテンツエリア箇所の もクリックしてください。

表示されたトップページコラム箇所の右側の「…」をクリックし、
「パーツを変更する」をクリックしてください。

コラムパーツを非表示にする場合

入っているバナー箇所自体を非表示にする場合は、
操作するをクリックした後に「表示しない」もしくは「パーツを外す」のいずれかをクリックして
レイアウト変更画面の右下の「保存する」ボタンをクリックしてください。

「表示しない」と「パーツを外す」の違い どちらもECサイト上からは表示されなくなります。 (HTMLのコメントアウトでもないのでHTMLにも出力されません) 再表示させる場合の手順に違いがあります。 表示しない・・・・一時的に非表示にする場合にオススメです。 　　　　　　　　　再度表示させる際は「操作をする」箇所をクリックした際に表示される 　　　　　　　　　「表示する」をクリックするだけで表示できます。 パーツを外す・・・今後表示させる予定がない場合にご利用ください。 　　　　　　　　　再度表示させる際はレイアウト変更画面にてパーツを再セットする必要があります。

 

２：コラムパーツの変更

２－１：コラムの変更

バナー箇所自体は残したまま、ダミーの画像・文言を変更する方法をご案内いたします。
コラムパーツ内では画像とテキストの1セットを「コラム」として設定をしています。

そのため、画像やテキストを変更する場合は「コラムの変更」が必要です。
コラムの表示順箇所に並んでいるコラム箇所の右端の をクリックしてください。

なお、１つのコラムパーツの中では最大４つのコラムを設定できます。

画像の変更

コラム変更ページで表示される画像箇所にて、画像を変更することができます。
画像がすでにアイテムにアップロードされているかどうかで作業が異なります。

アップロードする画像をまだアイテム上にアップロードしていない場合 下記の手順でアップロードを行うことができます。 １：「画像を読み込む」をクリックし、 　　画面下部の「アップロードするファイルをドロップしてください。」にて、 　　画像をアップロードしてください。 　　ドラッグアンドドロップで画像をアップロードすることもできますし、 　　「アイテムをアップロードする」ボタンを押してファイルを選んでアップロードすることも可能です。 ２：表示されるアイテム追加箇所で設定後、「保存する」をクリック ３：最後にアップロードした画像右端の をクリックしてください。 アップロードする画像をすでにアイテム上にアップロードしている場合 「画像を読み込む」をクリックし、差し替えたい画像右端の をクリックしてください。

テキストの変更

見出し、本文箇所の文言を必要に応じてご調整ください。
また、見出し、本文のいずれも空白で登録することも可能です。

リンク先の設定

バナーをクリックした際の飛び先のリンク設定できます。

クリックした際に新規ウインドウ(タブ)で開く場合は、
「新規ウインドウで開く」にチェックを入れてください。

設定の変更が完了したら「OK」ボタンを押してください。
その後、「コラム変更ページ」で「保存する」をクリックして
保存してください。
「保存する」をクリックするまでは変更内容が確定されませんのでご注意ください。

２－２：コラムの削除

不要なコラムを削除する場合、
削除をするコラムの をクリックしてください。
その後表示されるコラム変更ページの左下に表示されている、
「コラムを削除する」ボタンより削除が可能です。

２－３：コラムの追加

コラムを追加したい場合は画面左下の
「コラムを追加する」ボタンをクリックすることで追加できます。

３：コラムを横に並べる数の指定

スタートアップテーマの場合、
コラムパーツのclass指定を変更することで
「コラムを横にいくつ並べるか」を変更することが可能です。

コラム変更ページのclass箇所の記述をご希望に応じてご調整ください。

各コラムを横に2つ並べたい場合、classに「fs-pt-column--2」と入力。
各コラムを横に3つ並べたい場合、classに「fs-pt-column--3」と入力。
各コラムを横に4つ並べたい場合、classに「fs-pt-column--4」と入力。

 

配置指定用のclass以外にclassを入力する場合は、classを半角空白で区切って入力してください。
またはパーツオプション設定にてパーツを囲むHTML要素を設定し、classを入力してください。

４：パーツの保存

「コラム変更ページ」で「保存する」をクリックして
保存してください。
「保存する」をクリックするまではコラムの追加や変更した内容などが
確定されませんのでご注意ください。

■オンラインマニュアル：コラムパーツ追加・変更

スタートアップテーマで編集が必要なパーツ

スタートアップテーマで編集や確認が必要なパーツにつきましては、
下記のマニュアルをご確認ください。

■オンラインマニュアル：スタートアップテーマのご利用方法