Thay đổi ảnh nền trong admin Opencart

Thay đổi ảnh nền opencart từ admin panel

Mìnht thường thay đổi ảnh nền cho website theo các sự kiện lớn. Việc thay đổi ảnh nền vừa làm cho website “mới” hơn khi khách hàng ghé thăm vừa thể hiện được nội dung các khuyến mãi. Đối với những bạn biết code thì việc này cũng đơn giản chỉ là upload ảnh nền và sửa CSS. Tuy nhiên mỗi lần như vậy cũng khá mất công. Còn đối với những người không biết code thì chức năng thay đổi ảnh nền thì không thể thiếu được. Thủ thuật này sẽ giúp các bạn thêm chức năng thay đổi ảnh nền vào trong setting của cửa hàng trong admin panel.
Các bạn thực hiện các bước sau:
+ Sửa file …\admin\view\template\setting\setting.tpl
Tìm đoạn code:

            <tr>
              <td><?php echo $entry_logo; ?></td>
              <td><div class="image"><img src="<?php echo $logo; ?>" alt="" id="thumb-logo" />
                  <input type="hidden" name="config_logo" value="<?php echo $config_logo; ?>" id="logo" />
                  <br />
                  <a onclick="image_upload('logo', 'thumb-logo');"><?php echo $text_browse; ?></a>&nbsp;&nbsp;|&nbsp;&nbsp;<a onclick="$('#thumb-logo').attr('src', '<?php echo $no_image; ?>'); $('#logo').attr('value', '');"><?php echo $text_clear; ?></a></div></td>
            </tr>

Thêm đoạn code này vào ngay bên dưới nó:

            <tr>
              <td><?php echo $entry_background; ?></td>
              <td><div class="image"><img src="<?php echo $background; ?>" alt="" id="thumb-background" />
                  <input type="hidden" name="config_background" value="<?php echo $config_background; ?>" id="background" />
                  <br />
                  <a onclick="image_upload('background', 'thumb-background');"><?php echo $text_browse; ?></a>&nbsp;&nbsp;|&nbsp;&nbsp;<a onclick="$('#thumb-background').attr('src', '<?php echo $no_image; ?>'); $('#logo').attr('value', '');"><?php echo $text_clear; ?></a></div></td>
            </tr>

+ Sửa file …\admin\language\vietnamese\setting\setting.php
Thêm dòng code này vào:

$_['entry_background']        = 'Background:';

+ Sửa file …\admin\controller\setting\setting.php
– Tìm dòng code

$this->data['entry_logo'] = $this->language->get('entry_logo');

Thay thế:

$this->data['entry_background'] = $this->language->get('entry_background');

– Tìm đoạn code sau:

if ($this->config->get('config_logo') && file_exists(DIR_IMAGE . $this->config->get('config_logo')) && is_file(DIR_IMAGE . $this->config->get('config_logo'))) {
            $this->data['logo'] = $this->model_tool_image->resize($this->config->get('config_logo'), 100, 100);      
        } else {
            $this->data['logo'] = $this->model_tool_image->resize('no_image.jpg', 100, 100);
        }

Thêm sau nó đoạn code:

if (isset($this->request->post['config_background'])) {
            $this->data['config_background'] = $this->request->post['config_background'];
        } else {
            $this->data['config_background'] = $this->config->get('config_background');          
        }

        if ($this->config->get('config_background') && file_exists(DIR_IMAGE . $this->config->get('config_background')) && is_file(DIR_IMAGE . $this->config->get('config_background'))) {
            $this->data['background'] = $this->model_tool_image->resize($this->config->get('config_background'), 100, 100);      
        } else {
            $this->data['background'] = $this->model_tool_image->resize('no_image.jpg', 100, 100);
        }

OK. Đến đây thì trong admin bạn có thể upload ảnh nền và lưu vào setting được rồi

Thay đổi ảnh nền trong admin Opencart
Thay đổi ảnh nền trong admin Opencart

Muốn hiển thị ảnh nền thì chúng ta phải chỉnh sửa một chút nữa ngoài fontend
+ Sửa file ..\catalog\view\theme\default\template\common\header.tpl
Thay đổi thẻ body như sau:

<body<?php if ($background) { ?> style="background-image: url(<?php echo $background; ?>)"<?php } ?>>

+ Sửa file ..\catalog\controller\common\ header.php
Tìm đoạn code sau

		if ($this->config->get('config_logo') && file_exists(DIR_IMAGE . $this->config->get('config_logo'))) {
			$this->data['logo'] = $server . 'image/' . $this->config->get('config_logo');
		} else {
			$this->data['logo'] = '';
		}	

Thêm vào bên dưới nó:

		if ($this->config->get('config_background') && file_exists(DIR_IMAGE . $this->config->get('config_background'))) {
			$this->data['background'] = $server . 'image/' . $this->config->get('config_background');
		} else {
			$this->data['background'] = '';
		}

Như vậy là cơ bản đã xong 99% rồi việc còn lại bạn chỉnh css cho phù hợp với website của bạn là ok.