EC-CUBEのプチ(^^ゞカスタマイズ。
今回は、トップページの画像変更です。
EC-CUBEのデフォルトのトップページはこうなっています。
いくら便利なECサイト構築ツールといえども、このままでは使えない場所が3点。
A.ヘッダー左側のロゴ(画像)
B.ヘッダー右側の電話番号・FAX番号・営業時間(画像)
C.中央の画像(画像)
今回は、これを変更してみましょう。
一番手っ取り早い方法は、新しい画像を、現在使われているファイルと同じファイル名でサーバーにUpすること。
では、下記の手順で進めましょう。
1.現在のファイル名の確認
2.新しいファイルの用意
3.準備したファイルをサーバーにUp
1.現在のファイル名の確認
(今回は、ちょっと力業です。EC-CUBEの操作でも確認できるのですが、ちょっと探しにくいので・・・。)
まず、先日の記事『EC-CUBE:まずはテンプレートのバックアップ』の方法でテンプレートのバックアップを取り、そのバックアップファイルを解凍。

フォルダ”header”の中に、ヘッダー部分で使用している画像が有ります。
『logo.gif』が、A.ヘッダー左側のロゴ
『bg.gif』が、B.ヘッダー右側の電話番号・FAX番号・営業時間

フォルダ”main”の中に、メイン部分で使用している画像が有ります。(今回は1枚しか有りませんが。)
『image.gif』が、C.中央の画像
2.新しいファイルの用意
『logo.gif』の大きさは、302x81
『bg.gif』の大きさは、780x95
『image.gif』の大きさは、400x200
これらと同じ大きさの画像を準備。
なお、『bg.gif』の場合は、画像加工ソフト(JTrimなど)で番号を書き換えると手っ取り早いでしょう。
3.準備したファイルをサーバーにUp
![]()
(クリックで拡大されます。)
『EC-CUBE』の管理画面で、「コンテンツ管理」==>>「ファイル管理」と進みます。(ここで、『EC-CUBE』のファイルの操作ができます。画像ファイルの確認も出来ます。)
この画面で、置き換えるファイルを削除し、用意した新しいファイルをアップロードすれば、作業完了です。
上手くできましたか?
税理士法人川中経営
税理士・ITC 川中重司
EC-CUBE:トップページの画像を変更するには