Moushe.ru

Блог обо всём

OpenCart 1.5.4 делаем шаблон CompStore (5 часть)



В последнее время я был очень занят и поэтому уроки по переводу модулей так затянулись, сегодняшний урок будет состоять из двух частей: перевода последнего модуля и работой над меню категорий.

CompStore

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

1. Перевод модуля Product Tab

2. Переделаем стиль меню категорий

3. Копируем шаблоны модулей

И так приступим:

1. Откроем папку module (../admin/language/english/module) и копируем файл product_tab.php в папку module (../admin/language/russian/module), откроем его и изменим этот код (1-24):

<?php
// Heading
$_['heading_title']       = 'Product Tab';

// Text
$_['text_module']         = 'Modules';
$_['text_success']        = 'Success: You have modified module Product Tab!';
$_['text_content_top']    = 'Content Top';
$_['text_content_bottom'] = 'Content Bottom';
$_['text_column_left']    = 'Column Left';
$_['text_column_right']   = 'Column Right';

// Entry
$_['entry_limit']         = 'Limit:';
$_['entry_image']         = 'Image (W x H):';
$_['entry_layout']        = 'Layout:';
$_['entry_position']      = 'Position:';
$_['entry_status']        = 'Status:';
$_['entry_sort_order']    = 'Sort Order:';

// Error
$_['error_permission']    = 'Warning: You do not have permission to modify module Product Tab!';
$_['error_image']         = 'Image width &amp; height dimensions required!';
?>

на этот:

<?php
// Heading
$_['heading_title']       = 'Вкладки продуктов';

// Text
$_['text_module']         = 'Модули';
$_['text_success']        = 'Настройки модуля обновлены!';
$_['text_content_top']    = 'Верх страницы';
$_['text_content_bottom'] = 'Низ страницы';
$_['text_column_left']    = 'Левая колонка';
$_['text_column_right']   = 'Правая колонка';

// Entry
$_['entry_limit']         = 'Лимит:';
$_['entry_image']         = 'Изображение (Ширина x Высота):';
$_['entry_layout']        = 'Схема:';
$_['entry_position']      = 'Позиция:';
$_['entry_status']        = 'Статус:';
$_['entry_sort_order']    = 'Порядок сортировки:';

// Error
$_['error_permission']    = 'У Вас нет прав для управления этим модулем!';
$_['error_image']         = 'Введите рамеры изображения!';
?>

Не забываем изменить кодировку файла!

1.2. Откроем папку module (../catalog/language/english/module) и копируем файл product_tab.php в папку module (../catalog/language/russian/module), откроем его и вместо этого кода (1-12):

<?php
// Heading
$_['heading_title'] = 'Our Products';

$_['tab_latest'] = 'Latest';
$_['tab_bestseller'] = 'Bestseller';
$_['tab_featured'] = 'Featured';
$_['tab_special'] = 'Special';

// Text
$_['text_reviews']  = 'Based on %s reviews.';
?>

вставим этот:

<?php
// Heading
$_['heading_title'] = 'Наши Продукты';

$_['tab_latest'] = 'Последние';
$_['tab_bestseller'] = 'Бестселлеры';
$_['tab_featured'] = 'Рекомендуемые';
$_['tab_special'] = 'Специальные';

// Text
$_['text_reviews']  = 'На основании %s отзывов.';
?>

Не забываем изменить кодировку файла!

2. Откроем файл stylesheet.css (../catalog/view/theme/CompStore/stylesheet) и изменим это (319-332):

#menu {
background: #585858;
border-bottom: 1px solid #000000;
height: 37px;
margin-bottom: 15px;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
-khtml-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: 0px 2px 2px #DDDDDD;
-moz-box-shadow: 0px 2px 2px #DDDDDD;
box-shadow: 0px 2px 2px #DDDDDD;
padding: 0px 5px;
}

на это:

#menu {
background: #585858;
height: 37px;
margin-bottom: 15px;
-webkit-border-radius: 7px 7px 7px 7px;
-moz-border-radius: 7px 7px 7px 7px;
-khtml-border-radius: 7px 7px 7px 7px;
border-radius: 7px 7px 7px 7px;
padding: 0px 5px;
}

(этим мы убрали раздражающую меня тень, убрали чёрную рамку в 1px вокруг серого фона наших категорий и чуть сильнее закруглили уголки)

изменим это (342-344):

#menu > ul > li > a.active {
background: #000;
}

на это:

#menu > ul > li > a.active {
color: #21c2eb;
}

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

изменим это (356-362):

#menu > ul > li:hover > a {
background: #000000;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}

на это:

#menu > ul > li:hover > a {
color: #21c2eb;
}

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

изменим это (359-371):

#menu > ul > li > div {
display: none;
background: #FFFFFF;
position: absolute;
z-index: 5;
padding: 5px;
border: 1px solid #000000;
-webkit-border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
-khtml-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
background: url('../image/menu.png');
}

на это:

#menu > ul > li > div {
display: none;
position: absolute;
z-index: 5;
padding: 5px;
border-bottom: 1px solid #21c2eb;
border-left: 1px solid #21c2eb;
border-right: 1px solid #21c2eb;
-webkit-border-radius: 0px 0px 7px 7px;
-moz-border-radius: 0px 0px 7px 7px;
-khtml-border-radius: 0px 0px 7px 7px;
border-radius: 0px 0px 7px 7px;
background: url('../image/menu.png');
}

(длинновато получилось, мы удалили одну строку фона, изменили цвет рамки и убрали её сверху)

изменим это (390-395):

#menu > ul > li ul > li > a:hover {
background: #000000;
}
#menu > ul > li > div > ul > li > a {
color: #FFFFFF;
}

на это:

#menu > ul > li ul > li > a:hover {
color: #21c2eb;
}
#menu > ul > li > div > ul > li > a {
color: #000000;
}

(мы перекрасили ссылки выпадающего меню)

2.2. Откроем папку image (../catalog/view/theme/CompStore/image) и закинем в неё эту картинку:

menu

2.3. Удалим из папки xml (../vqmod/xml) файл menu+.xml

3. Откроем папку module (../catalog/view/theme/default/template/module) и копируем из неё эти файлы:

  • anylist.tpl
  • cr2htmlmodule.tpl
  • featuredmanufacturers.tpl
  • product_tab.tpl

и вставляем в папку module (../catalog/view/theme/CompStore/template/module).

На сегодня всё, до новых встреч. Следите за новостями.

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

  1. Привет!
    Не подскажешь, как сделать «короткое» меню и футер как у стандартного шаблона? «Нерезиновое» меню и футер нужны для этого шаблона _http://opencartforum.ru/files/file/381-hyla-шаблон-для-opencart/
    Заренее спасибо 🙂

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

      29.01.2013 at 00:23

      Вопрос сначала не так понял, дайте ссылу на сайт.

  2. bad_mazafakka

    29.01.2013 at 14:07

    Владислав, подскажи, пожалуйста, как менять модуль навигации в версии 1.5.4? Имеется в виду, вместо «Закладки», «Оформление заказа» сделать свои пункты и их наполнять/редактировать? ОООчень надо. Заранее спасибо.

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

      29.01.2013 at 14:34

      Не понял что за модуль навигации? Если вы про панель навигации то в header.tpl:

      <div class="links"><a href="<?php echo $home; ?>"><?php echo $text_home; ?></a><a href="<?php echo $wishlist; ?>" id="wishlist-total"><?php echo $text_wishlist; ?></a><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a><a href="<?php echo $shopping_cart; ?>"><?php echo $text_shopping_cart; ?></a><a href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></div>

      создаёте через админку новые страницы и добиваете свои ссылки сюда, ничего сложного в этом нет.

  3. bad_mazafakka

    29.01.2013 at 14:50

    По возможности, можешь описать подробнее, как создать страницы и какие ссылки затем внести? В админке я не нашёл управление этими пунктами ( Постоянный покупатель, Закладки, Оформление заказа, Корзина покупок) вообще.

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

      29.01.2013 at 16:16

      В админке вы этого и не найдёте, зайдите на свой сайт по ftp и вручную правьте файл header.tpl если для вас это сложно или не понятно — доверьте работу разбирающемуся в сайтах человеку.

  4. bad_mazafakka

    29.01.2013 at 16:32

    «создаёте через админку новые страницы и добиваете свои ссылки сюда, ничего сложного в этом нет» я имел в виду это. Что за новые страницы?

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

      29.01.2013 at 19:10

      1. Каталог > Статьи > Создаёте нужную страницу
      2. После создания страницы она появляется у вас в футере, в первой колонке
      3. Копируете ссылку страницы и прописываете ссылкой в меню links
      4. Открываете свою статью и присваиваете ей — 1 чтобы она не отображалась в футере

  5. bad_mazafakka

    29.01.2013 at 21:57

    Спасибо огромное, всё получилось.

  6. bad_mazafakka

    31.01.2013 at 17:11

    Влад, возник ещё вопрос. Можно ли на главной странице вместо Рекомендуемых товаров разместить Категории в форме сетки ( как товары, с картинкой), щелкая по которым, попадаешь в подкатегории?!

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

      31.01.2013 at 18:17

      Если подправить контроллеры то можно, но вам придётся обращаться за этим к программистам.

  7. Владислав, а как убрать эти меню чтоб сайт не перекосило? https://dl.dropbox.com/u/62237848/waa.png

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

      06.02.2013 at 23:49

      Все элементы шапки имеют абсолютное значение размещения, вы можете удалять что угодно — остальные элементы так и останутся на своих местах.

  8. по Вашему примеру удалял, логотип с корзиной налазят на менюшку с категориями 🙁

  9. все получилось.. руки кривые у меня кэш не обновлял… вопрос созрел как из атрибутов товара убрать напрочь Product Tags(Метки)

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

      07.02.2013 at 21:36

      Пока ещё не возился с этим, если ещё буду делать уроки по OP то постараюсь и это затронуть.

  10. Денис

    15.02.2013 at 16:34

    Владислав доброе время суток.
    Подскажи пожалуйсто, как можно сделать в категориях при переходе по категории попасть на прайс лист xls, при выборе товара в котором он добовлялся в корзину? Не как не могу сделать такой функционал, а он необходим.
    OpenCart версии 1.5.4.1
    Спасибо за рание!

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

      15.02.2013 at 16:51

      Я не способен помочь в этой проблеме, наймите программиста — реализует.

  11. Денис

    15.02.2013 at 16:59

    Просто боюсь попасть на денежный развод и не более того. А по вашим урокам переделал свой шаблон так, как вижу свой сайт.
    Ещё один вопрос, как можно сделать всплывающее меню в категориях с право, по скольку в верхнем меню я поменял ссылки с категорий на кантакты и т.п.

  12. Алексей

    06.04.2013 at 05:06

    Доброго времени суток. вроде все перечитал. но не смог найти как отцентровать слайд шоу, если изменен размер шаблона. слайд шоу всегда слева вылается а не по центру. Заранее благодарен за ответ.

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

      06.04.2013 at 16:19

      В стилях слайдшоу просто добавьте строку с выравниванием текста — в комментах css код не отображается.

  13. Светлана

    01.08.2013 at 09:32

    Добрый день,
    правлю
    stylesheet.css (../catalog/view/theme/CompStore/stylesheet) -для того, чтобы убрать «(этим мы убрали раздражающую меня тень, убрали чёрную рамку в 1px вокруг серого фона наших категорий и чуть сильнее закруглили уголки)»
    Но при изменении файла стилей на сайте не вижу изменений, Скопирован темплейт, подключен к сайту, Подскажите, в чем может быть проблема?
    Заранее благодарю

    • Светлана

      01.08.2013 at 09:54

      Главное, что если меняю, например, параметр Height=50pх вместо 37рх — ОНО действует на сайт, А вот черная эта РАМКА никак не хочет уйти с моего сайта ((((

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

      01.08.2013 at 12:04

      Либо непочистили куки браузера, либо в header.tpl не изменили путь к css стилям.

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

Your email address will not be published.

*

CAPTCHA image
*

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

Вверх ↑



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