Opencart 2.x - Переделываем Шапку Нашего Магазина (1 Часть)

Тема в разделе "Шаблоны, дизайн и оформление магазина", создана пользователем admin, 24 авг 2017.

  1. TopicStarter Overlay
    Offline

    admin Команда форума Администратор

    Сообщения:
    2.729
    Симпатии:
    129.642
    Репутация:
    215
    Всем привет, в этом цикле статей я расскажу вам как улучшить шапку нашего интернет магазина – сделать её более современной, менее загруженной и на мой взгляд более красивой чем стандартная.

    2017-08-24_114733.png

    Список задач на сегодня:
    • 1. Работаем с файлом header.tpl
    • 2. Работаем с файлом header.php (перевод)
    • 3. Работаем с файлом header.php (контроллер)
    • 4. Работаем с файлом wishlist.php (перевод)
    • 5. Работаем с файлом compare.php (перевод)
    • 6. Работаем с файлом common.js (скрипты)
    Приступим:

    1. Откроем файл ../catalog/view/theme/default/template/common/header.tpl и вместо этих строк (100-131):

    Код:
    <?php if ($categories) { ?>
    <div class="container">
    <nav id="menu" class="navbar">
    <div class="navbar-header"><span id="category" class="visible-xs"><?php echo $text_category; ?></span>
    <button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
    </div>
    <div class="collapse navbar-collapse navbar-ex1-collapse">
    <ul class="nav navbar-nav">
    <?php foreach ($categories as $category) { ?>
    <?php if ($category['children']) { ?>
    <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
    <div class="dropdown-menu">
    <div class="dropdown-inner">
    <?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
    <ul class="list-unstyled">
    <?php foreach ($children as $child) { ?>
    <li><a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a></li>
    <?php } ?>
    </ul>
    <?php } ?>
    </div>
    <a href="<?php echo $category['href']; ?>" class="see-all"><?php echo $text_all; ?> <?php echo $category['name']; ?></a> </div>
    </li>
    <?php } else { ?>
    <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
    <?php } ?>
    <?php } ?>
    </ul>
    </div>
    </nav>
    </div>
    <?php } ?>
    вставим эти:

    Код:
    <nav id="top">
    <div class="container">
    <?php if ($categories) { ?>
    <div class="btn-group category-header col-sm-3 col-xs-12">
    <button type="button" class="btn btn-navbar" data-toggle="dropdown"><span><?php echo $text_category; ?> <i class="fa fa-bars"></i></span></button>
    <ul class="dropdown-menu nav col-sm-12 col-xs-12">
    <?php foreach ($categories as $category) { ?>
    <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
    <?php } ?>
    </ul>
    </div>
    <?php } ?>
    </div>
    </nav>
    Смотрим что у нас получилось:

    2017-08-24_114741.png

    Неказисто, но мы же только начали!

    Теперь нам необходимо переместить поиск, удаляем эти строки (94-95):

    Код:
    <div class="col-sm-5"><?php echo $search; ?>
    </div>
    а после этих строк (100-109):

    Код:
    <?php if ($categories) { ?>
    <div class="btn-group category-header col-sm-3 col-xs-12">
    <button type="button" class="btn btn-navbar" data-toggle="dropdown"><span><?php echo $text_category; ?> <i class="fa fa-bars"></i></span></button>
    <ul class="dropdown-menu nav col-sm-12 col-xs-12">
    <?php foreach ($categories as $category) { ?>
    <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
    <?php } ?>
    </ul>
    </div>
    <?php } ?>
    вставляем эту:

    Код:
    <div class="col-sm-6 col-xs-12"><?php echo $search; ?></div>
    Результат:

    2017-08-24_114750.png

    Теперь переместим закладки и добавим сравнение товаров

    Удалим эту строку (71):

    Код:
    <li><a href="<?php echo $wishlist; ?>" id="wishlist-total" title="<?php echo $text_wishlist; ?>"><i class="fa fa-heart"></i> <span class="hidden-xs hidden-sm hidden-md"><?php echo $text_wishlist; ?></span></a></li>
    а после этой строки (109):

    Код:
    <div class="col-sm-6 col-xs-12"><?php echo $search; ?></div>
    вставим эти:

    Код:
    <div class="col-sm-3 col-xs-12">
    <a href="<?php echo $wishlist; ?>" id="wishlist-total" title="<?php echo $title_wishlist; ?>"><i class="fa fa-heart"></i> <span class="total"><?php echo $text_wishlist; ?></span></a>
    <a href="<?php echo $compare; ?>" id="compare-total" title="<?php echo $title_compare; ?>"><i class="fa fa-exchange"></i> <span class="total"><?php echo $text_compare; ?></span></a>
    </div>
    Результат:

    2017-08-24_114800.png

    Как видим появилась пара ошибок, не беспокойтесь всё в порядке, исправим это в следующих шагах.

    2. Откроем файл ../catalog/language/ru-ru/common/header.php и вместо этой строки (4):

    Код:
    $_['text_wishlist']  = 'Мои закладки (%s)';
    вставим эти:

    Код:
    $_['title_wishlist']  = 'Мои закладки';
    $_['text_wishlist']  = '%s';
    $_['title_compare']  = 'Сравнение товаров';
    $_['text_compare']  = '%s';
    аналогично изменим файлы других языков, к примеру ../catalog/language/en-gb/common/header.php (если вы используете несколько языков)

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

    3. Откроем файл ../catalog/controller/common/header.php и после этих строк (52-59):

    Код:
    // Wishlist
    if ($this->customer->isLogged()) {
    $this->load->model('account/wishlist');
    
    $data['text_wishlist'] = sprintf($this->language->get('text_wishlist'), $this->model_account_wishlist->getTotalWishlist());
    } else {
    $data['text_wishlist'] = sprintf($this->language->get('text_wishlist'), (isset($this->session->data['wishlist']) ? count($this->session->data['wishlist']) : 0));
    }
    вставим эти:

    // Compare

    Код:
    $data['text_compare'] = sprintf($this->language->get('text_compare'), (isset($this->session->data['compare']) ? count($this->session->data['compare']) : 0));
    после этой строки (81):

    Код:
    $data['wishlist'] = $this->url->link('account/wishlist', '', true);
    вставим эту:

    Код:
    $data['compare'] = $this->url->link('product/compare', '', true);
    а после этой строки (78):

    Код:
    $data['text_all'] = $this->language->get('text_all');
    вставим эти:

    Код:
    $data['title_wishlist'] = $this->language->get('title_wishlist');
    $data['title_compare'] = $this->language->get('title_compare');
    4. Откроем файл ../catalog/language/ru-ru/account/wishlist.php и вместо этой строки (8):

    Код:
    $_['text_wishlist'] = 'Закладки (%s)';
    вставим эту:

    Код:
    $_['text_wishlist'] = '%s';
    5. Откроем файл ../catalog/language/ru-ru/product/compare.php и вместо этой строки (19):

    Код:
    $_['text_compare']  = 'Сравнение товаров (%s)';
    вставим эту:

    Код:
    $_['text_compare']  = '%s';
    6. Откроем файл ../catalog/view/javascript/common.js и вместо этой строки (263):

    Код:
    $('#wishlist-total').attr('title', json['total']);
    вставим эту:

    Код:
    $('#wishlist-total').attr('title');
    а после этой строки (320):

    Код:
    $('#compare-total').html(json['total']);
    добавим эту:

    Код:
    $('#compare-total').attr('title');
    P.S. — Это необходимо чтобы при наведении на иконки закладок и сравнения товара после добавления товара в закладки или сравнения при наведении показывался заголовок, а не количество добавленных товаров.

    Сравниваем до и после:
    2017-08-24_114808.png
    2017-08-24_114733.png
    На этом всё, продолжим в следующей статье.
     
    Последнее редактирование: 24 авг 2017
    215151 нравится это.
  2. Offline

    215151 Пользователь

    Сообщения:
    82
    Симпатии:
    306
    Репутация:
    1
    Круто, давно не было статей от админа а тут прорвало спасибо всегда на высоте:agree:
     
  3. Offline

    13bnj Пользователь

    Сообщения:
    34
    Симпатии:
    1
    Репутация:
    0
    все сделал так же, от и до. но ничего не изменилось . (opencart.pro 2.3)
     
  4. Offline

    Moon Пользователь

    Сообщения:
    40
    Симпатии:
    13
    Репутация:
    8
    Кэш не пробовали обновлять и чистить?
     
  5. Offline

    13bnj Пользователь

    Сообщения:
    34
    Симпатии:
    1
    Репутация:
    0
    пробовал. чистил
     
  6. Offline

    13bnj Пользователь

    Сообщения:
    34
    Симпатии:
    1
    Репутация:
    0
    2 часть тоже пробовал. Результат 0, за исключением только админки. там "ссылки в шапке" появились. На сайте никаких изменений.
     
  7. TopicStarter Overlay
    Offline

    admin Команда форума Администратор

    Сообщения:
    2.729
    Симпатии:
    129.642
    Репутация:
    215
    @13bnj, Здравствуйте. Проблема может быть только в кэше. Нажмите кнопку обновить в модификаторах и если используете vqmod папка cache.