Moushe.ru

Блог обо всём

Создание магазина BearStore (10 часть)



Продолжим работать с нашим шаблоном BearStore, в этой статье мы затронем футер магазина, удалим лишние варианты сортировки из категорий и страниц поиска, переместим цену в категориях (вид список) и в поиске (вид список).

12

Список задач на сегодня:

1. Правим футер шаблона

2. Поправим заголовок модуля приветствие

3. Удаляем сортировки по рейтингу, по модели

4. Перемещаем цену (вид список)

Приступим:

1. Откроем файл ../catalog/view/theme/bearstore/stylesheet/stylesheet.css и вместо этих строк (1588-1627):

#footer {
clear: both;
overflow: auto;
min-height: 100px;
padding: 20px;
border-top: 1px solid #DBDEE1;
border-bottom: 1px solid #DBDEE1;
background: #F8F8F8;
}
#footer h3 {
color: #000000;
font-size: 14px;
margin-top: 0px;
margin-bottom: 8px;
}
#footer .column {
float: left;
width: 25%;
min-height: 100px;
}
#footer .column ul {
margin-top: 0px;
margin-left: 8px;
padding-left: 12px;
}
#footer .column ul li {
margin-bottom: 3px;
}
#footer .column a {
text-decoration: none;
color: #000;
}
#footer .column a:hover {
text-decoration: underline;
}
#powered {
margin-top: 5px;
text-align: right;
clear: both;
}

вставим эти:

#footer {
clear: both;
overflow: auto;
min-height: 100px;
padding: 20px;
border-top: 2px solid #007148;
}
#footer h3 {
color: #000000;
font: bold 15px Verdana;
margin-top: 0px;
margin-bottom: 10px;
}
#footer .column {
float: left;
width: 25%;
min-height: 100px;
}
#footer .column ul {
margin: 0px;
padding: 0px;
list-style: none;
}
#footer .column ul li {
margin-bottom: 5px;
padding-left: 5px;
}
#footer .column a {
font: 14px Arial;
text-decoration: none;
color: #000;
}
#footer .column a:hover {
color: #007148;
text-decoration: underline;
padding-left: 1px;
}
#powered {
margin-top: 5px;
padding-bottom: 10px;
text-align: center;
clear: both;
}

(мы изменили шрифт и размер заголовков, удалили дурацкие кружки у ссылок, настроили отступы и поправили стили ссылок, также мы сместили копирайты из правого угла в центр шаблона и добавили им отступ снизу)

2. Откроем файл ../catalog/language/russian/module/welcome.php и вместо этой строки (2):

$_['heading_title'] = 'Добро пожаловать в Интернет-магазин %s';

вставим эту:

$_['heading_title'] = 'Интернет-магазин %s';

3. Откроем файл ../catalog/controller/product/category.php и удалим эти строки (315-339):

if ($this->config->get('config_review_status')) {
$this->data['sorts'][] = array(
'text'  => $this->language->get('text_rating_desc'),
'value' => 'rating-DESC',
'href'  => $this->url->link('product/category', 'path=' . $this->request->get['path'] . '&sort=rating&order=DESC' . $url)
);

$this->data['sorts'][] = array(
'text'  => $this->language->get('text_rating_asc'),
'value' => 'rating-ASC',
'href'  => $this->url->link('product/category', 'path=' . $this->request->get['path'] . '&sort=rating&order=ASC' . $url)
);
}

$this->data['sorts'][] = array(
'text'  => $this->language->get('text_model_asc'),
'value' => 'p.model-ASC',
'href'  => $this->url->link('product/category', 'path=' . $this->request->get['path'] . '&sort=p.model&order=ASC' . $url)
);

$this->data['sorts'][] = array(
'text'  => $this->language->get('text_model_desc'),
'value' => 'p.model-DESC',
'href'  => $this->url->link('product/category', 'path=' . $this->request->get['path'] . '&sort=p.model&order=DESC' . $url)
);

3.1. Откроем файл ../catalog/controller/product/search.php и удалим эти строки (324-348):

if ($this->config->get('config_review_status')) {
$this->data['sorts'][] = array(
'text'  => $this->language->get('text_rating_desc'),
'value' => 'rating-DESC',
'href'  => $this->url->link('product/search', 'sort=rating&order=DESC' . $url)
);

$this->data['sorts'][] = array(
'text'  => $this->language->get('text_rating_asc'),
'value' => 'rating-ASC',
'href'  => $this->url->link('product/search', 'sort=rating&order=ASC' . $url)
);
}

$this->data['sorts'][] = array(
'text'  => $this->language->get('text_model_asc'),
'value' => 'p.model-ASC',
'href'  => $this->url->link('product/search', 'sort=p.model&order=ASC' . $url)
);

$this->data['sorts'][] = array(
'text'  => $this->language->get('text_model_desc'),
'value' => 'p.model-DESC',
'href'  => $this->url->link('product/search', 'sort=p.model&order=DESC' . $url)
);

4.  Откроем файл ../catalog/view/theme/bearstore/template/product/category.tpl и вместо этих строк (116-120):

html  = '<div class="right">';
html += '  <div class="cart">' + $(element).find('.cart').html() + '</div>';
html += '  <div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
html += '  <div class="compare">' + $(element).find('.compare').html() + '</div>';
html += '</div>';

вставим эти:

html  = '<div class="right">';

var price = $(element).find('.price').html();

if (price != null) {
html += '<div class="price">' + price  + '</div>';
}

html += '  <div class="cart">' + $(element).find('.cart').html() + '</div>';
html += '  <div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
html += '  <div class="compare">' + $(element).find('.compare').html() + '</div>';
html += '</div>';

удалим эти строки (137-141):

var price = $(element).find('.price').html();

if (price != null) {
html += '<div class="price">' + price  + '</div>';
}

4.1. Откроем файл ../catalog/view/theme/bearstore/template/product/search.tpl и вместо этих строк (174-178):

html  = '<div class="right">';
html += '  <div class="cart">' + $(element).find('.cart').html() + '</div>';
html += '  <div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
html += '  <div class="compare">' + $(element).find('.compare').html() + '</div>';
html += '</div>';

вставим эти:

html  = '<div class="right">';

var price = $(element).find('.price').html();

if (price != null) {
html += '<div class="price">' + price  + '</div>';
}

html += '  <div class="cart">' + $(element).find('.cart').html() + '</div>';
html += '  <div class="wishlist">' + $(element).find('.wishlist').html() + '</div>';
html += '  <div class="compare">' + $(element).find('.compare').html() + '</div>';
html += '</div>';

удалим эти строки (195-199):

var price = $(element).find('.price').html();

if (price != null) {
html += '<div class="price">' + price  + '</div>';
}

4.2. Откроем файл ../catalog/view/theme/bearstore/stylesheet/stylesheet.css и вместо этих строк (893-903):

.product-list .price {
float: right;
height: 130px;
width: 100px;
margin-left: 8px;
text-align: center;
color: #333333;
font-size: 12px;
border-left: 1px solid #EEEEEE;

}

вставим эти:

.product-list .price {
margin-left: 8px;
padding-bottom: 10px;
text-align: center;
color: #333333;
font: bold 17px Arial;
}

(мы удалили высоту, ширину, бордюр слева, отображение справа и увеличили размер шрифта для цены)

вместо этих строк (858-864):

.product-list .right {
height: 130px;
float: right;
padding-left: 18px;
border-left: 1px solid #EEEEEE;

}

вставим эти:

.product-list .right {
height: 130px;
float: right;
padding-left: 10px;
margin-left: 10px;
border-left: 2px dotted #60a859;
}

(мы уменьшили отступ до бордюра справа, добавили отступ слева – чтобы текст не прижимался к бордюру, сделали бордюр шире, изменили его цвет и вместо неразрывной линии сделали его точечным)

Смотрим на результат:

23

На сегодня всё, до новых встреч.

2 Комментария

  1. Владислав, подскажите, пожалуйста, как переверстать страницу категории: весь бокс с описанием категории и списком товаров почему-то смещен вправо, а слева какой-то странный баннер. Как сдвинуть все влево (точнее, равномерно растянуть на всю ширину), а баннер, наоборот, переместить вправо? Совсем не понимаю, как это сделать и какой файл надо редактировать.
    И второй вопрос: что за ерунда творится с ценой товара? в файле эксп/имп. цена указана правильно, в админке тоже отображается верно, а на сайте цена 125 139.01 р.???Откуда она взялась, не понятно. Что не так и где надо исправлять?

    • Владислав Храмцов
      vkontakte.ru Владислав Храмцов

      15.09.2014 at 10:22

      1. Управление баннерами — Админка — Модули — Баннер — либо правьте файл catalogviewtheme*** ваш шаблон ***templateproductcategory.tpl
      2. Посмотрите какая валюта выбрана по умолчанию, возможно по курсу пересчитывает цену из одной валюты в другую.

Добавить комментарий

Your email address will not be published.

*

CAPTCHA image
*

© 2016 Moushe.ru При копировании материалов, ссылка на нас обязательна!

Вверх ↑



Яндекс.Метрика