赤い枠で囲ったコンテンツの出力部分のデザインを変更します。
コンテンツの出力部分はシステムから出力されており、標準設定では修正出来ないようにしています。
テンプレートファイルの編集を行うために下記の手順を行います。
※マイページID:bryonをベースにして話を進めます。
cms └── soyshop └── webapp └── src └── mypage └── bryon └── pages ├── ErrorPage.html ├── LoginPage.html ├── LogoutPage.html ├── TopPage.html ├── address │ ├── ConfirmPage.html │ ├── EditPage.html │ └── IndexPage.html ├── campaign │ └── IndexPage.html ├── download │ ├── DetailPage.html │ └── IndexPage.html ├── edit │ ├── CompletePage.html │ ├── ConfirmPage.html │ └── IndexPage.html ├── favorite │ └── IndexPage.html ├── mail │ ├── DetailPage.html │ └── IndexPage.html ├── message │ ├── CompletePage.html │ ├── ConfirmPage.html │ ├── IndexPage.html │ └── detail │ ├── CompletePage.html │ ├── ConfirmPage.html │ └── IndexPage.html ├── notice │ └── IndexPage.html ├── order │ ├── DetailPage.html │ └── IndexPage.html ├── password │ ├── CompletePage.html │ └── IndexPage.html ├── point │ └── IndexPage.html ├── profile │ └── IndexPage.html ├── register │ ├── CompletePage.html │ ├── ConfirmPage.html │ ├── IndexPage.html │ └── tmp │ ├── CompletePage.html │ └── IndexPage.html ├── remind │ ├── CompletePage.html │ ├── InputPage.html │ └── ResetPage.html ├── review │ ├── DetailPage.html │ └── IndexPage.html └── withdraw ├── CompletePage.html └── IndexPage.html
上記のパスはシステムから出力されるコンテンツ部分のHTMLファイルが格納されているディレクトリになります。
太文字で示したpagesディレクトリ毎コピーして、
/ルート/ショップID/.template/mypage/pagesとなるように貼り付けします。
pagesディレクトリを貼付け後、pagesディレクトリのディレクトリ名をマイページID(今回はbryon)に変更します。
※例 ショップIDがshop、マイページIDがbryonの場合
shop └── .template └── mypage ├── bryon │ ├── ErrorPage.html │ ├── LoginPage.html │ ├── LogoutPage.html │ ├── TopPage.html │ ├── address │ │ ├── ConfirmPage.html │ │ ├── EditPage.html │ │ └── IndexPage.html │ ├── campaign │ │ └── IndexPage.html │ ├── download │ │ ├── DetailPage.html │ │ └── IndexPage.html │ ├── edit │ │ ├── CompletePage.html │ │ ├── ConfirmPage.html │ │ └── IndexPage.html │ ├── favorite │ │ └── IndexPage.html │ ├── mail │ │ ├── DetailPage.html │ │ └── IndexPage.html │ ├── message │ │ ├── CompletePage.html │ │ ├── ConfirmPage.html │ │ ├── IndexPage.html │ │ └── detail │ │ ├── CompletePage.html │ │ ├── ConfirmPage.html │ │ └── IndexPage.html │ ├── notice │ │ └── IndexPage.html │ ├── order │ │ ├── DetailPage.html │ │ └── IndexPage.html │ ├── password │ │ ├── CompletePage.html │ │ └── IndexPage.html │ ├── point │ │ └── IndexPage.html │ ├── profile │ │ └── IndexPage.html │ ├── register │ │ ├── CompletePage.html │ │ ├── ConfirmPage.html │ │ ├── IndexPage.html │ │ └── tmp │ │ ├── CompletePage.html │ │ └── IndexPage.html │ ├── remind │ │ ├── CompletePage.html │ │ ├── InputPage.html │ │ └── ResetPage.html │ ├── review │ │ ├── DetailPage.html │ │ └── IndexPage.html │ └── withdraw │ ├── CompletePage.html │ └── IndexPage.html ├── bryon.html └── bryon.ini
ディレクトリのコピーとディレクトリ名の変更が終了したら管理画面を開きます。
サイト管理 > テンプレート管理を開き、アプリケーションページテンプレート一覧にアプリケーションテンプレートのリンクが表示されていることを確認した上でアプリケーションテンプレートのページを開く。
マイページのアプリケーションテンプレート一覧にIDがbryonのマイページコンテンツが表示されていれば、コンテンツの箇所のテンプレートのカスタマイズの準備が出来たことになります。
テンプレートはサーバに上がっているファイルを直接修正、もしくは管理画面からの修正となります。
今回紹介しました機能は非推奨ですので、テンプレート内で使用しているsoy:idの説明はありません。
編集するのであれば、
コードの色付き表示のエディタでサーバにあるファイルを直接開いて編集することをおすすめします。