終了ページまとめ

提供：Wiki@KDS
ナビゲーションに移動 検索に移動

終了ページ

タカシマヤ特集の終了ページ
※サイトマップ＞タカシマヤの母の日　などを参照のこと
※関連特集のメニューがあるものも対応

[end_page]について

shopping以下にend_pageというフォルダがあります。

[end_page] 　→終了ページの共通CSSや画像置き場
├─common 　→共通して使えるもの
│　　├css(end_base.css) 　→基本的に必要なCSS
│　　└img 　→基本的に必要な画像
└─sample.html 　→終了ページのコーディングサンプル


使用する画像やCSSが変われば更新してください。


作成方法

1≫end_page\img　を参照し、新しい画像はスライスしておくこと。
※カテの画像など、もし今後常用する画像が変われば[img]に入れておいてください。
2≫/shopping/end_page/common/css/end_base.css　が終了ページの共通CSSになるので、読み込みます。

<head>
	<link rel="stylesheet" type="text/css" href="/shopping/common/css/default.css">
	<link rel="stylesheet" type="text/css" href="/shopping/common/css/contents_base.css">
	<link rel="stylesheet" type="text/css" href="/shopping/end_page/common/css/end_base.css">
	<script type="text/javascript" src="/js/default.js"></script>
	<script type="text/javascript" src="/common/script.js"></script>
</head>

終了ページに必要なCSS/JSは揃っているので、以上で良いと思います。もし必要があれば適宜調整のこと。

3≫必要な部分はsample.htmlを参照すると楽かもしれないです。
各クラスにpaddingやmarginがついているので、とりあえずpaddingやmarginは指定しないで作ってみたほうが良いかもしれません。

<!-- top-img -->
<p class="txt-end"><em>～クリスマス終了のお知らせ～</em></p>
<h2>＜メインイメージ＞</h2>
<!--/ top-img /-->

emタグで囲まれたところは赤文字です。end_base.cssを読み込んでいる時ににtxt-endを指定すると#fcb1b1;の5px実線で囲まれます。

4≫母の日などと一緒の形なら、ギフトやフードのカテリンクだと思います。
複数段になる場合でも、クラス：cate-wrapにmargin-top:15px;があるのでそのまま積みます。

5≫たまに関連特集というのがあります。
バナーのところは文言とバナーが更新になると思います。
他にもリンク先など変更あれば適宜修正してください。

6≫オンラインショッピング会員登録　クラス：banner
最近のものは特についてます。
バナー自体が変わることもありえるので、その時は同じ名前で更新してください

7≫左下の関連リンク　クラス：each
父の日⇔母の日、お中元⇔お歳暮　など対になるものはリンクします。
特に指定の無い場合はいりません。


定型のものについては以上です

「https://wiki.kohga.tokyo/index.php?title=終了ページまとめ&oldid=6130」から取得