Урок 8 Свои классы для разных страницы магазина
Процесс доработки внешнего вида того или иного интернет — магазина на opencart — процесс несомненно веселый и увлекательный. Каждый заказчик уникален в своих запросах и требованиях, и порою приходится вносить довольно специфические правки в шаблон. Зачастую бывает такое, что для разных страниц необходимо применить уникальную стилистику и оформление, чтобы она не пересекалась с другими страницами магазина.
Хорошим решением в данном случае является назначение уникального класса тегу <body>. И сделать это можно достаточно просто. В контроллере header.php, которой находится по адресу
1 |
\catalog\controller\common\header.php |
необходимо добавить немного кода.
Вам необходимо найти следующие строчки
1 2 3 4 5 |
if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/common/header.tpl')) { return $this->load->view($this->config->get('config_template') . '/template/common/header.tpl', $data); } else { return $this->load->view('default/template/common/header.tpl', $data); } |
И сразу перед ними добавить следующий код
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
// Добавление класса страницы if (isset($this->request->get['route'])) { if (isset($this->request->get['product_id'])) { $class = '-' . $this->request->get['product_id']; } elseif (isset($this->request->get['path'])) { $class = '-' . $this->request->get['path']; } elseif (isset($this->request->get['manufacturer_id'])) { $class = '-' . $this->request->get['manufacturer_id']; } elseif (isset($this->request->get['information_id'])) { $class = '-' . $this->request->get['information_id']; } else { $class = ''; } $data['class'] = str_replace('/', '-', $this->request->get['route']) . $class; } else { $data['class'] = 'common-home'; } |
Уточню, что это для версии 2.1. Если же у Вас магазин на 2.3 версии, то данный код Вам необходимо добавить перед
1 |
return $this->load->view('common/header', $data); |
Теперь для того, чтобы вывести класс страницы, необходимо в файле header.tpl
1 |
\catalog\view\theme\default\template\common\header.tpl |
в тег <body> добавить вывод заданного класса, в результате чего должно получиться следующее
1 |
<body class="<?php echo $class; ?>"> |
Здравствуйте !
а можно на примере , для новичка
к примеру у меня ID, двух категорий 1002 и 1005
только для них надо прописать css код
.category-list__item {
font-size: 1.2em;
Описанная доработка уже все делает. Добавляет к body вот такие классы product-category-65_66, где цифры — это и есть id категории
Соответственно в файле стилей прописываете
.product-category-65_66 тут_ваш_селектор {
тут_ваши_стили
}
Как результат, стили будут работать только на данной странице.
не получается !
у меня не дефаултная тема (((
строка
<body class="<?php echo $class; ?>">
уже прописана
может в этом причина ?
Возможно. Наверно у Вас уже это встроено по умолчанию, и добавлять данную доработку не надо. Проверьте контроллер и темплейт.
Здравствуйте! Я меняю CSS классы для отдельных статей, типа «доставка», «оплата». Верно ли будет ссылаться на них так: .information-10 .мой-класс-для-статей { то что требуется поменять в CSS }
Тут цифра 10 — это идентификатор конкретной статьи. Или я неправильно связываю id + information ??
ps И сразу вопрос про path — например есть адрес корзины «/cart.html»
Как на него правильно сослаться в таблице стилей?
Добрый. Класс прописывается для тега body, поэтому лучше указать body.information-10 .класс_нужного_элемента {тут стиль}
10 — верно, это идентификатор статьи
По поводу корзины — смотрите в исходный код страницы, какой класс у body, его и используйте в конструкции
Понял. Спасибо огромное!
скажите, а если 2 магазина, каждому можно задать отдельный класс?
Здравствуйте.
Не совсем понял что именно Вы хотите. У Вас мультимагазин?