メインコンテンツへスキップ

スマートデザイン編集

スマートデザインは、HTMLを直接修正して使用できます。
制約なく思い通りのデザインを適用できます。
ショップサイトのアクセス速度を速くすることができます。
どのブラウザでも快適なショッピング環境を提供できます。

編集画面の詳細機能

 

フォルダ追加/ページ追加

任意のパスにフォルダやページを作成できます。
例えば、新しい機能を適用するために案内される内容がある場合、フォルダ追加/ページ追加機能を利用できます。

 

名前を付けて保存

選択したファイルを指定した名前で新しいファイルとして保存できます。

 

最新のソース

現在編集中のページの最新バージョンを確認できます。
修正後は「保存」をクリックしてください。
ソースが反映されます。

 

ソース一括変更

編集中のファイルで特定のソースを検索して一度に修正できます。
分割表示、HTML表示モードでのみ可能です。
この機能を使用した後、変更前に戻したい場合は、編集履歴機能を利用してください。

 

編集画面モード: 画面表示

編集中の画面をプレビュー形式で確認できます。
修正するとすぐに修正内容が反映されます。
ただし、変更は自動で保存されないため、「保存」ボタンをクリックしてください。
マウスの動きに応じてモジュール単位で領域が表示されます。
任意の領域の「編集」ボタンをクリックして修正できます。
モジュール追加機能はサポートされていないため、モジュールを選択できない状態で表示されます。

 

編集画面モード: 分割表示

編集中の画面を画面表示領域とHTML領域に分けて、2つの状態を同時に確認できます。
画面表示領域でモジュール単位を選択すると、選択したモジュールのソース位置がHTML領域に表示されます。
HTML領域でソースを修正してから「プレビュー」ボタンをクリックするか保存すると、画面表示領域に修正内容が反映されます。
モジュール追加機能がサポートされているため、任意の位置にマウスカーソルを置いて「モジュール追加」をクリックすると、任意のモジュールを追加できます。

 

編集画面モード: HTML表示

編集中の画面のHTMLソースのみを確認できます。
モジュール追加機能がサポートされているため、任意の位置にマウスカーソルを置いて「モジュール追加」をクリックすると、任意のモジュールを追加できます。

 

モジュール

モジュールとは、プログラムを構成する最小単位で、1つ以上のコンテンツと機能をまとめたものです。
各モジュールはHTMLと変数がひとまとまりになって動作します。
モジュールは1つの独立した完全なプログラムとして、ユーザーが入力したmodule=""モジュールID(モジュール名)""に応じて判断され動作します。
Cafe24では様々なモジュールを提供しています。
モジュールコードをHTMLソースの任意の位置に挿入して使用できます。

 

モジュール追加/置換

モジュールを追加または置換する方法は次の2つです。

 

1. モジュール編集画面の利用

スマートデザイン編集画面でモジュールの「編集」ボタンをクリックします。
モジュール編集画面で追加するモジュールを選択し、選択したモジュールが追加される位置を選択してから適用します。

 

2. モジュール追加ボタンの利用

スマートデザイン編集画面で分割表示またはHTML表示の状態で、モジュールを追加する位置をHTML領域で選択します。
「モジュール追加」ボタンでモジュール編集画面を開き、任意のモジュールを選択して適用します。

 

デザイン構造

オンラインショップを含むすべてのWebサイトには、全体的に共通する構造があります。
レイアウトは全体構造のうち、共通して使用される領域を指し、大きく4つの部分に分かれます。

 

1. ヘッダー(Header)

オンラインショップのすべてのページの一番上に表示される領域です。
通常、ロゴ、ログイン情報、検索窓、ショートカットなどが表示されます。

 

2. ナビゲーション(Side)

ショップを閲覧するのに役立つメニューが表示される領域です。
ログイン、マイページ、サイドバー型検索窓、商品カテゴリメニュー、企画展、カスタマーサポート案内、掲示板リスト、人気商品などが表示されます。

 

3. 本文(Body)

ヘッダーとフッターの間の領域です。
ヘッダーやフッターとは異なり、固定されておらず、ページごとに異なるデザインで表示されることがあります。

 

4. フッター(Footer)

オンラインショップのすべてのページの一番下に表示される領域です。
会社情報、利用案内、カスタマーセンター案内などが表示されます。

 

 

 

 

このページはお役に立ちましたか?
このページの内容