自社デザインに組み込む
下準備方法【スタッフ情報CMS】
古いWEBデザインの場合、レイアウトが崩れる可能性がありますが、組み込み自体は可能なので、ダウンロード後に崩れた部分のhtmlやcssを調整してみて下さい。
また、ご利用中のCSSなどに影響を受ける場合もあります。その際も生成後に調整してみて下さい。
必ず元ファイルはバックアップしておいて下さい。
CMSテンプレート化システムを通すと、不要なファイルが削除されたり、CMS専用のファイル・フォルダ類が追加されます。
必ずオリジナルファイルはバックアップしておいて下さい。
①index.htmlの確認
トップページ用ファイル(index.html)を準備して下さい。
通常、トップページはindex.htmlなのでそれがちゃんとあればOK。もしない場合は準備して下さい。
②list.htmlの準備
トップページ以外の土台となるファイル(list.html)を準備します。
list.htmlというファイル名がない場合、既存のhtmlを複製し、ファイル名をlist.htmlに変更してメインコンテンツを空にしておいて下さい。
既にlist.htmlというファイルを使っている場合、そのファイルは一旦別名に変更して下さい。
※生成後、ここで準備したlist.htmlはもう使わないので削除してもらってOKです。
③CMSのメインコンテンツ用のタグを入れます
<!--CMS-TEMPLATE-main-->
上で準備したindex.htmlとlist.htmlにそれぞれ1行、CMSのメインコンテンツを出力させる目印タグを追加します。タグはhtml側から追加して下さい。CMSとは関連なく表示させたおきたいメインコンテンツ情報はそのまま残しておきます。
④ - 1 サブコンテンツ専用のタグを入れます
<!--CMS-TEMPLATE-sub-side-->
上で準備したindex.htmlとlist.htmlに、CMSのサブコンテンツ専用タグを出力させる目印タグを追加します。必ずサブコンテンツブロック内に入れて下さい。
※サブコンテンツが「ない」デザインの場合、このステップは飛ばして次のステップをお読み下さい。
このステップのタグと、下のステップのタグから出力される内容は「全く同じ内容」です。
ただ、出力用のレイアウトが異なっています。
④ - 2 サブコンテンツがないデザインをご利用の場合
<!--CMS-TEMPLATE-sub-top-->
1カラムレイアウトなど、サブコンテンツがないデザインをご利用の場合、コンテンツ上部に横並びで出力させるレイアウト用のタグを利用します。基本的には<!--CMS-TEMPLATE-main-->のすぐ上の行に入れればOK。
※サブコンテンツが「ある」デザインの場合、このステップは飛ばして下さい。
このステップのタグと、上のステップのタグから出力される内容は「全く同じ内容」です。
ただ、出力用のレイアウトが異なっています。
該当データが「4個以上」で、横スライドショーが起動します。
3個だと、単に3列の固定並び、それ以下だとレイアウトが崩れる可能性があります。
スライドの個数を変更したい場合は、ダウンロードファイルのslick.jsを開いて「slidesToShow」で枚数を調整して下さい。
④最後に、フォルダごとzip圧縮して下さい
その他のファイルが入っていても構いませんので、WEBサイト用のファイルを丸ごとzip圧縮をかけておいて下さい。
容量が大きな画像フォルダなどは、とりあえずzipから省いておいて頂くと、スムーズにダウンロードが進みます。
⑤以上で下準備は完了です!
あとはzipをアップロードし、テーマを選んでからダウンロードボタンを押すだけです。