概要
＊ローカル環境で作るページは全部で2ページ
①article.html（ブログ一覧ページ）
②articledetail.html（ブログ詳細ページ）
→これは最終的にCMSの「テンプレート設定」にコピペすることになる
→CMS上ではCSSの調整ができないのでいったんローカルでCSSを当てたファイルをつくるため
＊index.htmlにもブログ一覧を掲載
※なので、「ブログを実装する」ときにいじるファイルは、
article.html
articledetail.html
index.html
の三つ
article.htmlのつくり方
1）下層ページの特徴のないページをコピペ
→飲食だったらアクセスページとか、bodyのコンテンツ部分が単にテキストで構成されているシンプルなもの（もちろん別のページでもできなくはない）
2）<head>、<header>と<footer>は残す（コンテンツ以外は使い回し）
3）これを<head>〜〜〜</head>の中に入れる
<script src="https://static.ccmphp.com/fetch/1.0.0/articles.js"></script>
4）bodyのコンテンツ部分に
<div class="CMS-ARTICLE-INDEX" CMS-ARTICLE-LIMIT="10" CMS-STORE-ID="16">
<div class="CMS-ARTICLE-ITEM">
<img class="CMS-ARTICLE-THUMBNAIL">
<div class="CMS-ARTICLE-TIME"></div>
<div class="CMS-ARTICLE-LINK"></div>
</div>
</div>
を入れる
※IDはそのブログを実装したいCMSの店舗ID
5）上記のclassをcssで調整（レスポンシブの際は、メディアクエリ注意）
articledetail.htmlのつくり方
1）先につくったarticle.htmlをコピペ
2）<head>、<header>と<footer>は残す（コンテンツ以外は使い回し）
3）これを<head>〜〜〜</head>の中に入れる
<script src="https://static.ccmphp.com/fetch/1.0.0/articles.js"></script>
※article.htmlをコピペしていれば入っているはず
4）bodyのコンテンツ部分に
<div class="CMS-ARTICLE-DETAIL">
<div class="CMS-ARTICLE-TITLE"></div>
<div class="CMS-ARTICLE-CONTENT"></div>
</div>
を入れる
5）上記のclassをcssで調整（レスポンシブの際は、メディアクエリ注意）
6）CMSの「記事管理」→「テンプレート設定」→丸っとすべてコピペ
7）「記事一覧」の左上赤いボタン「テンプレートの一括適用」を押す
8）試しに「新規投稿」で実際に反映されるかテスト ※テストして問題なければ、テスト投稿した記事は削除 ※サムネイルの大きさ、画像の大きさ、テキストの表示（フォントの大きさ、左寄り・中央寄せなど） をチェック
index.htmlへのブログ一覧の反映
1）これをindex.htmlの<head>〜〜〜</head>の中に入れる
<script src="https://static.ccmphp.com/fetch/1.0.0/articles.js"></script>
※article.htmlをコピペしていれば入っているはず
2）所定の位置に、article.htmlでいれたものと同じ
<div class="CMS-ARTICLE-INDEX" CMS-ARTICLE-LIMIT="3" CMS-STORE-ID="16">
<div class="CMS-ARTICLE-ITEM">
<img class="CMS-ARTICLE-THUMBNAIL">
<div class="CMS-ARTICLE-TIME"></div>
<div class="CMS-ARTICLE-LINK"></div>
</div>
</div>
を入れる
※IDはそのブログを実装したいCMSの店舗ID
※CMS-article-LIMIT="3"→3記事まで掲載されるという意味、4でもいい
3）上記のclassをcssで調整（レスポンシブの際は、メディアクエリ注意）
CMSのテンプレートにarticledetail.htmlをコピペする
＞記事管理＞テンプレート設定
ローカルで制作した、articledetail.htmlをコピペ
href=" "
src=""
上記リンクの部分はすべて「絶対パス」で書く
つまり、そのページのTOPページURLをコピペする