閉じる
  1. iPhoneやiPadで誤ってアプリケーションを購入した場合の返金方法…
閉じる
閉じる
  1. vimでペースト・貼り付けたら余計なインデントが混ざる(解決)
  2. ヤフーショップが個人出店者をヤフオクへ強制移店させるそうだ(期限は来年…
  3. トラックパッドのピンチイン、アウトで拡大縮小出来ない場合の対処法
  4. 海外のGoogleで検索する方法とURLを紹介します
  5. VMware上の仮想OSでキーボード、マウスが効かない(解決)
  6. サイトをまるごとダウンロードする方法(wgetコマンド編)
  7. 最新OS「Mojave」の新機能。デスクトップアイコンをまとめて整理す…
  8. WordPressが遅い!ページ表示を高速化するプラグインWP-Opt…
  9. PythonでScrapyインストール時にエラー発生。解決!
  10. Excelで簡単に日付と時刻を入力する方法(ショートカット活用)
閉じる

ALPHACAST|アルファキャスト

EC-CUBEで商品一覧の画像が小さい→大きくする方法

アルファキャストec-cubeロゴ

EC-CUBEで商品一覧の画像が小さい→大きくする方法

EC-CUBEは非常に完成されたECプラットフォームです。
お客様より独自の通販サイトの構築を依頼されたら必ずEC-CUBEをご提案しています。
WordPressも好きですが、論理的に体系化されたファイル構成は非常に好感が持てます。

さて、今回は表記の通り
商品一覧画面の画像を一段階大きく表示したい
場合の手順のご紹介です。

環境

EC-CUBEバージョン 2.13.5
PHPバージョン PHP 5.3.3
DBバージョン MySQL 5.1.73

商品画像が小さい

ズバリこのような状態です。

表示画面サイズや、使用するテンプレートにもよりますが、よく起こります。
無駄な余白が気になりますし、なにより大切な商品の写真が栄えません。

一覧表示のソースを書き換える

対象ソースは以下。

<EC-CUBEドキュメントルート>/eccube/data/Smarty/templates/[テンプレート名]/products/list.tpl

画像表示箇所を特定する

ソース内で画像を表示している箇所を特定し以下のように書き換えます。
※ブラウザの開発モードを利用すれば特定は一発です。以下の記事が参考になるかと思います。

ソースを以下のように書き換える

↓以下のように変更

具体的には3行目の一カ所を変更するだけです。

$arrProduct.main_list_image

$arrProduct.main_image

つまり表示に呼び出されている画像ファイルの種類を変更してやります。

結果確認

無事大きくなりました。
めでたしめでたし。

まとめ

EC-CUBEは部品化された多数のテンプレートで構成されています。
今回は商品一覧表示用のテンプレート(list.tpl)を一部編集しましたが、
役割と変更すべき箇所がわかれば、さらなるカスタマイズが可能になります(当たり前か)

繰り返しますがEC-CUBEはファイル構成が非常にスマートなため変更に掛かる工数やリスクを
低く見積もる事が出来ます。これって素晴らしい事ですよね。

最後までご覧いただき有難うございました。

愛のおひねり




育毛剤

関連記事

  1. アルファキャストec-cubeロゴ

    EC-CUBEの会員登録画面の職業項目を変更する(並び順も)

  2. アルファキャストec-cubeロゴ

    無料:EC-CUBEで特定の商品にだけ送料無料設定するプラグイン…

  3. アルファキャストec-cubeロゴ

    EC-CUBEで支払い方法の初期値を設定する

おすすめ記事

  1. iPhoneやiPadで誤ってアプリケーションを購入した場合の返金方法

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

人気の記事

  1. vimでペースト・貼り付けたら余計なインデントが混ざる(解決)
    vimでペースト・貼り付けたら余計なインデントが混ざる(解決)コーディング中、ソース範囲を選択し…
  2. ヤフーショッピング
    ヤフーショップから個人出店者が消滅!移行期限は来年6月末!なんだこれは。Yahoo!ショッピ…
  3. ピンチイン、ピンチアウトが効かない
    MACのトラックパッドで「ピンチイン、アウト」効かない場合の対処法MacBook Proのトラッ…
  4. Google検索方法
    海外のGoogleで検索する方法をご紹介海外のGoogle結果を検索したいことってありますよね。…
  5. vmwareでキーボードが効かない
    VMwareで起動したOSへキーボード、マウスが反応しない環境 ツール:VMware…
  6. wgetのコマンド紹介
    サイトをローカルにダウンロードする方法(wgetコマンド編)コマンドラインからサイトをまるごとダ…

漠速!WordPress特化型サーバ登場

愛のおひねり

子供の頃、ファミコンより「MSX」に飛びついたマイノリティー。

当時、雑誌に掲載されていたソース(BASIC言語)を打ち込み無料でゲームを楽しみ悦に浸る。

某大手電機メーカーの情報システム部門勤務を経て独立。

現在はIT広告媒体全般を請け負う便利屋。

趣味:
ビリヤード、フルート、カラオケ、Amazonプライムビデオ観賞