EC-CUBE ネットショップテンプレート
コンテンツの登録・編集
3.ロゴ画像の編集（PCサイト用）
CSSの編集によりにPCサイトフロント側のロゴ画像設置が可能です。
携帯サイトのロゴ画像もテンプレートファイルを編集することで同じ画像を使用することができます。
※CSSの知識が必要です。ご理解ある方のみ対象です。
CSSカスタマイズの問合せの受付、サポートは行っておりません。
携帯サイトのロゴ画像もテンプレートファイルを編集することで同じ画像を使用することができます。
※CSSの知識が必要です。ご理解ある方のみ対象です。
CSSカスタマイズの問合せの受付、サポートは行っておりません。
ロゴ画像を用意
ファイル名は「logo.gif」で保存してください。
例）横幅220px、縦幅50px
例）横幅220px、縦幅50px
テンプレートセットを用意 テンプレートキングのテンプレートを使用中の場合は、管理画面の「デザイン管理＞テンプレート設定」からテンプレートセットをダウンロードし、「tpl_package_************.tar.gz」を解凍をします。
※管理画面からの編集ではなくFTPで作業を行っている場合はデータが失う恐れがあるので、必ずバックアップをとってから行ってください。
テンプレートキングのテンプレート未使用の場合は、テンプレートキングからダウンロードした「テンプレート名.tar.gz」を解凍します。
解凍したフォルダにロゴ画像を保存します。
【保存場所】
_packages/img/shop/logo.gif
※管理画面からの編集ではなくFTPで作業を行っている場合はデータが失う恐れがあるので、必ずバックアップをとってから行ってください。
テンプレートキングのテンプレート未使用の場合は、テンプレートキングからダウンロードした「テンプレート名.tar.gz」を解凍します。
解凍したフォルダにロゴ画像を保存します。
【保存場所】
_packages/img/shop/logo.gif
CSSファイルの編集 解凍したフォルダ内のCSSファイル（main.css）を編集します。
【保存場所】
_packages/css/shop/main.css
下記記述をmain.cssの最下部に追加
追加内容↓
#header h1 a {
text-indent:-9999px;
display: block;
width: 220px; /* ロゴ画像の横幅 */
height: 50px; /* ロゴ画像の縦幅 */
background: url(../img/shop/logo.gif) no-repeat;
}
【保存場所】
_packages/css/shop/main.css
下記記述をmain.cssの最下部に追加
追加内容↓
#header h1 a {
text-indent:-9999px;
display: block;
width: 220px; /* ロゴ画像の横幅 */
height: 50px; /* ロゴ画像の縦幅 */
background: url(../img/shop/logo.gif) no-repeat;
}
テンプレートセットを圧縮圧縮ソフトを利用し、編集した「tpl_package_************」フォルダをtar.gz形式で再度圧縮ください。
圧縮後、改めて管理画面「デザイン管理＞テンプレート追加」からテンプレート追加/テンプレート設定してください。
圧縮後、改めて管理画面「デザイン管理＞テンプレート追加」からテンプレート追加/テンプレート設定してください。
サイトの確認メニューの上段にある「SITE CHECK」をクリックします。
サイトを表示し、デザインが適応されているのを確認してください。
サイトを表示し、デザインが適応されているのを確認してください。