店長日記、関連ページ、掲示板、フリーページのナビゲーションを画像にできますか?

2017-09-29 10:05

スタイルシートの編集と自由記入欄へのHTMLタグの挿入することで設定できます。

→サンプルページ


※下記の一旦メニューを非表示に設定した後に自由記入欄で設定する方法以外に、背景画像を変更する方法もございます。
https://www.ocnk.net/ocnk_ma/ocnkmagazine_asm056.html#de

STEP1 左エリアのナビゲーションを非表示にする

「デザイン管理」>「表示とレイアウトの設定」


左エリア設定部分の店長日記、関連ページ、掲示板のメニューを非表示に設定してください。
※携帯版をご利用の方は、携帯版のメニューも非表示になりますのでご注意ください。
■携帯版と合わせご利用の方は、スタイルシートの下記の箇所を編集してメニューを非表示にしてください。
※PC版のみの方は、管理画面の表示とレイアウトの設定からで問題ありません。
※関連ページは/* リンク集 */を編集してください。

/* 店長日記 */
.diary {
width: ****;
height: ****;
margin: ****;
padding: ****;
background-image: ****);
display: none;
}

/* リンク集 */
.link {
width: ****;
height: ****;
margin: ****;
padding: ****;
background-image: ****);
display: none;
}

/* 掲示板 */
.bbs {
width: ****;
height: ****;
margin: ****;
padding: ****;
background-image: ****);
display: none;
}



STEP2 フリーページのメニューを非表示にする。

管理画面の以下のページを開きます。
「コンテンツ管理」>「フリーページ設定」

フリーページ一覧が表示されますので、メニューを非表示にしたいものは、「メニュー非表示にする」ボタンをクリックしてください。


STEP3
 自由記入欄を使用してHTMLタグを挿入する

「デザイン管理」>「画像とコメントの設定」

画像とコメントの設定→コメント→自由記入欄に、HP作成ソフトやエディタで作成したHTMLタグを貼り付けてください。
その際挿入するテーブルタグの横幅を150~160px(※テンプレートにより多少違いがあります。)に設定してください。

画像ファイルをアップロードする
画像専用管理画面から掲載したい画像ファイルをアップロードしてください。その後、画像URL部分にその画像URLを記載してください。 画像ファイルのURLは絶対パスで記載してください。
例) https://demo.ocnk.net/data/demo/image/test.jpg
また、左エリアに画像を挿入される際は、https://のようにsを記載してください。

挿入テーブルタグ例
---------------------------------------------------------------------------------------
<table width="160" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="45"><a href="https://demo.ocnk.net/diary"><img src="画像URL" alt="店長日記" width="160" height="40" border="0" /></a></td>
</tr>
<tr>
<td height="45"><a href="https://demo.ocnk.net/link"><img src="画像URL" alt="関連ページ" width="160" height="40" border="0" /></a></td>
</tr>
<tr>
<td height="45"><a href="https://demo.ocnk.net/bbs"><img src="画像URL" alt="掲示板" width="160" height="40" border="0" /></a></td>
</tr>
<tr>
<td height="45"><a href="https://demo.ocnk.net/page/1"><img src="画像URL" alt="フリーページ" width="160" height="40" border="0" /></a></td>
</tr>
</table><br />
---------------------------------------------------------------------------------------
上記アンカー部分のdemoは各アカウントIDに変更してください。
店長日記:https://アカウントID.ocnk.net/diary
関連ページ:https://アカウントID.ocnk.net/link
掲示板:https://アカウントID.ocnk.net/bbs
フリーページ1:https://アカウントID.ocnk.net/page/1
フリーページ2:https://アカウントID.ocnk.net/page/2

※独自ドメインの場合
https://アカウントID.ocnk.net/ 部分が → https://www.test.jp/のようになります。


STEP4 設定を完了するボタンをクリックしてください。