Перейти к содержанию

Рекомендуемые сообщения

Необходимо добавить изображения в категории. 

Это я сделал вот так: 

Для добавления такого же функционала в категорию для начала нам надо добавить дополнительную таблицу в базу данных product_image. Делаем запрос в базу через phpmyadmin:

CREATE TABLE IF NOT EXISTS `oc_category_image` (
`category_image_id` int(11) NOT NULL AUTO_INCREMENT,
`category_id` int(11) NOT NULL,
`image` varchar(255) DEFAULT NULL,
`sort_order` int(3) NOT NULL DEFAULT '0',
PRIMARY KEY (`category_image_id`),
KEY `category_id` (`category_id`)
) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;
После этого открываем файл модели admin/model/catalog/category.php и добавляем возможность сохранения фотографий в базу данных. Для этого ищем в функции addCategory и editCategory строку:

if (isset($data['image'])) {
перед ней вставляем:

if (isset($data['category_image'])) {
	foreach ($data['category_image'] as $category_image) {
		$this->db->query("INSERT INTO " . DB_PREFIX . "category_image SET category_id = '" . (int)$category_id . "', image = '" . $this->db->escape($category_image['image']) . "', sort_order = '" . (int)$category_image['sort_order'] . "'");
	}
}
Далее добавляем функцию выборки картинок категории, например перед строкой:

public function getCategory($category_id) {
Вставляем:

public function getCategoryImages($category_id) {
	$query = $this->db->query("SELECT * FROM " . DB_PREFIX . "category_image WHERE category_id = '" . (int)$category_id . "' ORDER BY sort_order ASC");
	
	return $query->rows;
}
После этого у нас изображения уже записываются в базу с формы редактирования товара. Далее открываем контроллер admin/controller/catalog/category.php находим строку:

$data['placeholder'] = $this->model_tool_image->resize('no_image.png', 100, 100);
и после нее вставляем код обработки фото:

// Images
if (isset($this->request->post['category_image'])) {
	$category_images = $this->request->post['category_image'];
} elseif (isset($this->request->get['category_id'])) {
	$category_images = $this->model_catalog_category->getCategoryImages($this->request->get['category_id']);
} else {
	$category_images = array();
}

$data['category_images'] = array();

foreach ($category_images as $category_image) {
	if (is_file(DIR_IMAGE . $category_image['image'])) {
		$image = $category_image['image'];
		$thumb = $category_image['image'];
	} else {
		$image = '';
		$thumb = 'no_image.png';
	}

	$data['category_images'][] = array(
		'image'      => $image,
		'thumb'      => $this->model_tool_image->resize($thumb, 100, 100),
		'sort_order' => $category_image['sort_order']
	);
}
После этого открываем форму редактирования категории admin/view/template/catalog/category_form.tpl и ищем строку:

<li><a href="#tab-data" data-toggle="tab"><?php echo $tab_data; ?></a></li>
после нее добавляем код вкладки:

<li><a href="#tab-image" data-toggle="tab">Изображения</a></li>
Далее ищем строку:

<p class="tab-pane" id="tab-design">
И перед ней вставляем блок вкладки с формой добавления изображений:

<div class="tab-pane" id="tab-image">
	 <?php $button_remove = 'Удалить'; $button_image_add = 'Добавить'; ?>
	<div class="table-responsive">
		<table id="images" class="table table-striped table-bordered table-hover">
			<thead>
				<tr>
					<td class="text-left">Изображение</td>
					<td class="text-right"><?php echo $entry_sort_order; ?></td>
					<td></td>
				</tr>
			</thead>
			<tbody>
				<?php $image_row = 0; ?>
				<?php foreach ($category_images as $category_image) { ?>
					<tr id="image-row<?php echo $image_row; ?>">
					<td class="text-left"><a href="" id="thumb-image<?php echo $image_row; ?>" data-toggle="image" class="img-thumbnail"><img src="<?php echo $category_image['thumb']; ?>" alt="" title="" data-placeholder="<?php echo $placeholder; ?>" /></a><input type="hidden" name="category_image[<?php echo $image_row; ?>][image]" value="<?php echo $category_image['image']; ?>" id="input-image<?php echo $image_row; ?>" /></td>
					<td class="text-right"><input type="text" name="category_image[<?php echo $image_row; ?>][sort_order]" value="<?php echo $category_image['sort_order']; ?>" placeholder="<?php echo $entry_sort_order; ?>" class="form-control" /></td>
					<td class="text-left"><button type="button" onclick="$('#image-row<?php echo $image_row; ?>').remove();" data-toggle="tooltip" title="<?php echo $button_remove; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>
				</tr>
				<?php $image_row++; ?>
				<?php } ?>
			</tbody>
			<tfoot>
				<tr>
					<td colspan="2"></td>
					<td class="text-left"><button type="button" onclick="addImage();" data-toggle="tooltip" title="<?php echo $button_image_add; ?>" class="btn btn-primary"><i class="fa fa-plus-circle"></i></button></td>
				</tr>
			</tfoot>
		</table>
	</div>
</div>
И после этого конечно оживляем все кнопки скриптом. Внизу файла перед строкой

<script type="text/javascript"><!--
Вставляем этот код:

<script type="text/javascript"><!--
var image_row = <?php echo $image_row; ?>;

function addImage() {
html  = '<tr id="image-row' + image_row + '">';
html += '  <td class="text-left"><a href="" id="thumb-image' + image_row + '"data-toggle="image" class="img-thumbnail"><img src="<?php echo $placeholder; ?>" alt="" title="" data-placeholder="<?php echo $placeholder; ?>" /></a><input type="hidden" name="category_image[' + image_row + '][image]" value="" id="input-image' + image_row + '" /></td>';
html += '  <td class="text-right"><input type="text" name="category_image[' + image_row + '][sort_order]" value="" placeholder="<?php echo $entry_sort_order; ?>" class="form-control" /></td>';
html += '  <td class="text-left"><button type="button" onclick="$(\'#image-row' + image_row  + '\').remove();" data-toggle="tooltip" title="<?php echo $button_remove; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>';
html += '</tr>';

$('#images tbody').append(html);

image_row++;
}
//--></script> 
Для вывода фото на странице категорий нам необходимо добавить функцию выборки изображений из базы данных в модель. Для этого открываем файл catalog/model/catalog/category.php и, например перед строкой:

public function getCategories($parent_id = 0) {
вставляем нашу функцию

public function getCategoryImages($category_id) {
$query = $this->db->query("SELECT * FROM " . DB_PREFIX . "category_image WHERE category_id = '" . (int)$category_id . "' ORDER BY sort_order ASC");

return $query->rows;
}
После этого полученные данные надо обработать в контроллере, для этого идем в файл catalog/controller/product/category.php и перед строкой:

$data['description'] = html_entity_decode($category_info['description'], ENT_QUOTES, 'UTF-8');
вставляем код обработки:

$data['images'] = array();

$results = $this->model_catalog_category->getCategoryImages($category_id);

if($results){
	$this->document->addScript('catalog/view/javascript/jquery/magnific/jquery.magnific-popup.min.js');
	$this->document->addStyle('catalog/view/javascript/jquery/magnific/magnific-popup.css');
	foreach ($results as $result) {
		$data['images'][] = array(
			'popup' => $this->model_tool_image->resize($result['image'], $this->config->get($this->config->get('config_theme') . '_image_popup_width'), $this->config->get($this->config->get('config_theme') . '_image_popup_height')),
			'thumb' => $this->model_tool_image->resize($result['image'], $this->config->get($this->config->get('config_theme') . '_image_additional_width'), $this->config->get($this->config->get('config_theme') . '_image_additional_height'))
		);
	}
}
После этого у нас в шаблон идет массив $images в котором находятся фотографии категории. Для отображения их на сайте надо сделать вывод в шаблоне. Для этого открываем файл catalog/view/theme/default/template/product/category.tpl и в нужном месте вставляем код:

 <?php if ($images) { ?>
	   <p class="row images">
		<?php foreach ($images as $image) { ?>
		<p class="col-xs-6 col-sm-6 col-md-3"><a class="thumbnail" href="<?php echo $image['popup']; ?>" title="<?php echo $heading_title; ?>"> <img src="<?php echo $image['thumb']; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></p>
		<?php } ?>
	   </p>
		<hr>
		<script>
			$(document).ready(function() {
				$('.images').magnificPopup({
					type:'image',
					delegate: 'a',
					gallery: {
						enabled:true
					}
				});
			});
		</script>
 <?php } ?>

 

Теперь мне нужно вывести эти изображения в каталог, т.е. когда видно весь перечень категорий на каждую категорию есть одна фотография, а нужно чтоб выводило все. Наглядно на картинке пример сделала. Буду благодарна за любую помощь.

ПРИМЕР.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.