対応memo
1 STG環境の子サイト「FORCIA CUBE」を複製(サイトの複製)
- 「Case Study」作成
- https://www-stg.forcia.com/casestudy/
2 インデックステンプレート
rss_tech
- 削除
ブログフッター
- 名称変更:事例紹介フッター
- 運営会社部分削除
ブログヘッダー
- 名称変更:事例紹介ヘッダー
- 一部書き換え
- /blog/ → /casestudy/
- <div class="h1"><a href="/casestudy/">Case study</a><span>顧客企業様の事例紹介</span></div>
【SSI】事例紹介(テスト)
- 削除
メインページ
- ヘッダー、フッターを書き換え
- /blog/ → /casestudy/
- テキストを書き換え
<mt:SetVarBlock name="page_title"><$mt:BlogName$></mt:SetVarBlock>
<mt:SetVarBlock name="page_description">顧客企業さまの事例を紹介いたします</mt:SetVarBlock>
<mt:SetVarBlock name="page_keywords">フォルシア,顧客企業,事例</mt:SetVarBlock>
3 記事>カテゴリ
- カテゴリ追加
- キーワード、記事件数が0の時って表示されないんじゃなかったっけ?
- 大当たり。ヘッダー・フッターともに表示されることを確認。(3/10aito)
- キーワード、記事件数が0の時って表示されないんじゃなかったっけ?
4 アーカイブテンプレート>記事 で記事側のページのヘッダー・フッターを修正
記事へ遷移した後のヘッダーフッター(キーワード部分含む)がブログのままで困っていたが、アーカイブテンプレート>記事 の中にヘッダー・フッターの記述あり
それを /casestudy/ に書き換えることで対応できた(3/10aito)
5 ヘッダーナビゲーションに「事例紹介追加」
ダッシュボード > フォルシアHP-STG > テンプレート > 【SSI】日本語版ヘッダー2021
<li class="casestudy"><a href="/casestudy/">事例紹介</a></li>
6 事例紹介用のcssをつくる・アップする・適用させる
- blogに適用されているcssはこれ
- /assets/css/blog201812.css
- https://www-stg.forcia.com/assets/css/blog201812.css
- 事例紹介用はこれ
- /assets/css/casestudy.css
- https://www-stg.forcia.com/assets/css/casestudy.css
(6-1)つくる =書き換える部分は二か所
- もとの「blog201812.css」をダウンロードする
- 「casestudy.css」と名前を変えて保存
- 【書き換え1】ナビゲーションに関する部分 =gNav(609行目)
- blog → casestudy へ変更
↓変更後
/* ----------------------------------------------
Media Queries
------------------------------------------------ */
@media (min-width: 768px) {
/* ヘッダー */
#gNav ul.main li.casestudy > a {
border-bottom: 4px solid #63acf1;
(下記を適用させている)
<nav>
<div id="gNav">
<div class="gNavWrap">
<ul class="main">
<li class="casestudy"><a href="/casestudy/">事例紹介</a></li>
<li class="technology"><a href="/technology/">テクノロジー</a></li>
</div><!-- /.gNavWrap -->
</div><!-- /#gNav -->
</nav>
- 【書き換え2】ヘッダーのロゴを差し替えて、そのリンクに書き換える
- 「Case Study」文字ロゴ作成
- STG、本番どちらにもアップ済み
- /assets/images/casestudy_title.png
- 「Case Study」文字ロゴ作成
(書き換える部分は下記、22行目)
↓変更前
#blogHeader .h1 a {
display: inline-block;
width: 400px;
height: 72px;
background: url(/assets/images/blog/blog_logo.png) no-repeat center center;
↓変更後
#blogHeader .h1 a {
display: inline-block;
width: 400px;
height: 72px;
background: url(/assets/images/casestudy_title.png) no-repeat center center;
cssの元素材格納先はここ
- G:\共有ドライブ\10_経営企画室\横串組織\マーケティングWG\事例紹介\css
(6-2)アップする
ダッシュボード > フォルシアHP-STG > Case Study > アセット > アセットのアップロード
- 上記に(6-1)で作ったcssファイルをアップする
- アップロード先は → /assets/css/
(6-3)適用させる
関連するテンプレートは書き二つ
- ダッシュボード > フォルシアHP-STG > Case Study > テンプレート > メインページ
- 21行目
- ダッシュボード > フォルシアHP-STG > Case Study > テンプレート > 記事
- 88行目
- <link rel="stylesheet" type="text/css" href="/assets/css/blog201812.css" media="screen,print">
- 88行目
これで完成!!!!!!!!!!!