Moushe.ru

Блог обо всём

OpenCart 1.5.3 делаем шаблон GreenTea (4 часть)



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

AdminPanelFinalHeader

Урок состоит из трёх частей:

1 – Работаем с админкой

2 – Вставляем контакты в шаблон (витрину)

3- Создаём стиль оформления для контактов

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

1.1. Откроем файл setting.tpl (../admin/view/template/setting) и после этих строк (38-45):

<tr>
<td><span class="required">*</span> <?php echo $entry_address; ?></td>
<td><textarea name="config_address" cols="40" rows="5"><?php echo $config_address; ?></textarea>
<?php if ($error_address) { ?>
<span class="error"><?php echo $error_address; ?></span>
<?php } ?></td>
</tr>

вставим эти:

<tr>
<td><?php echo $entry_headcontacts; ?></td>
<td><textarea name="config_headcontacts" cols="40" rows="5"><?php echo $config_headcontacts; ?></textarea></td>
</tr>

1.2. Откроем файл setting.php (../admin/language/russian/setting) и после этой строки (29):

$_['entry_address']            = 'Адрес магазина:';

вставим эту:

$_['entry_headcontacts']            = 'Контакты магазина:';

1.3. Откроем файл settings.php (../admin/controller/setting) и после этой строки (52):

$this->data['entry_address'] = $this->language->get('entry_address');

вставим эту:

$this->data['entry_headcontacts'] = $this->language->get('entry_headcontacts');

и после этих строк (339-343):

if (isset($this->request->post['config_address'])) {
$this->data['config_address'] = $this->request->post['config_address'];
} else {
$this->data['config_address'] = $this->config->get('config_address');
}

эти:

if (isset($this->request->post['config_headcontacts'])) {
$this->data['config_headcontacts'] = $this->request->post['config_headcontacts'];
} else {
$this->data['config_headcontacts'] = $this->config->get('config_headcontacts');
}

Теперь идём в админку:

Система > Настройки > Изменить:

и видим новый пункт, которого не было раньше:

AdminPanel

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

2.1. Открываем файл header.php (../catalog/controller/common) и после этой строки (43):

$this->data['text_home'] = $this->language->get('text_home');

вставляем эту:

$this->data['headcontacts'] = nl2br($this->config->get('config_headcontacts'));

 

2.2. Открываем файл header.tpl ( ../catalog/view/theme/greentea/template/common ) и после этих строк (47-48):

<div id="container">
<div id="header">

вставляем эту:

<?php echo $headcontacts; ?>

Обновляем нашу главную страницу и смотрим на изменения:

HeadContacts

ура, наши контакты появились.

3.1. Закинем эту картинку в папку image (../catalog/view/theme/greentea/image):

mobileme

Через пару уроков мы заменим эту картинку на что-то более симпатичное, а эта нам нужна просто как заглушка — мы создадим отступы и тд в css, а картинка поможет нам увидеть что всё сделано правильно.
Если же мы будем вставлять графику через n-ное количество времени у нас может поехать весь шаблон и править придётся на много больше кода, чем с использованием стрёмной, но всё таки картинки.

3.2. Откроем файл header.tpl (../catalog/view/theme/greentea/template/common) и вместо этой строки (49):

<?php echo $headcontacts; ?>

вставим эту:

<div id="headcontacts"><?php echo $headcontacts; ?></div>

3.3. Откроем файл stylesheet.css (../catalog/view/theme/greentea/stylesheet) и вместо этих строк (100-106):

#header {
height: 90px;
margin-bottom: 7px;
padding-bottom: 4px;
position: relative;
z-index: 99;
}

вставим эти:

#header {
height: 190px;
margin-bottom: 7px;
padding-bottom: 4px;
position: relative;
z-index: 99;
}
#headcontacts {
position: absolute;
top: 80px;
right: 0px;
background: url('../image/mobileme.png')  no-repeat;
padding-left: 55px;
padding-bottom: 10px;
font-size: 15px;
color: #686868;
}

Результат нашей работы:

FinalHeader

Размер шапки и цвет шрифта я специально сделал такими – скоро мы вставим в шапку красивую картинку и тогда подкорректируем стили как надо.

На сегодня всё, следите за нашими новостями. Улыбка

48 Комментариев

  1. Денис

    03.12.2012 at 16:14

    Здравствуйте!Спасибо за урок!Возник такой вопрос,как сделать для версии 1.5.3 красивое вертикальное меню?например как здесь http://shebeko.com/demo/cssmenu1/9menu/index.htm

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

      03.12.2012 at 21:19

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

  2. Денис

    08.12.2012 at 17:07

    Подскажите каким образом можно изменить шрифт и размер букв в вашем примере для вывода контактов в шапку? И можно ли регулировать координаты размещения иконки (будет два телефона, хочется отобразить иконки МТС и Велком напротив каждого). Заранее спасибо!

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

      08.12.2012 at 19:10

      1. Что мешает вам нарисовать две иконки на одном общем фоне.
      2. Угадайте что делает эта строка:
      font-size: 15px;
      (размер шрифта: 15px)
      3. Вот ссылка как изменить шрифт — http://marina-makarova.info/kak-izmenit-shrift-v-bloge/

  3. Денис

    09.12.2012 at 16:23

    Спасибо!!!!!!!!!!!! Родина вас не забудет!

  4. Николай

    16.12.2012 at 03:45

    Здравствуйте. на версии 1.5.4.1 выдает ошибку на главной «Notice: Undefined variable: headcontacts in /home/kottarco/domains/kottar.com.ua/public_html/catalog/view/theme/hyla/template/common/header.tpl on line 60»

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

      16.12.2012 at 21:19

      Эх, вы думаете я просто так указываю — OpenCart 1.5.3 делаем шаблон GreenTea? Я сейчас работаю с 1.5.3, и 1.5.4 пока ещё не устанавливал. Когда допишу цикл статей по OpenCart 1.5.3 начну работать с новой версией движка. 🙂

  5. антон стежкин

    21.12.2012 at 01:17

    у меня вопрос:
    хочу ВЕРТИКАЛЬНОЕ меню в сайте на opencart 1.5.4.1. Я, конечно выдрал код … из header.tpl, вставил в column_left.tpl … А оно не видит переменную $categories.
    Ругаетсо: «Notice: Undefined variable: categories in C:\xampp\htdocs\oc\catalog\view\theme\rcmodel\template\common\column_left.tpl on line 8»
    Что и где надо переписать, чтобы переменная была видна? 😥

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

      21.12.2012 at 17:35

      Заходите в модули, категории — и включаете их в левую колонку на нужных страницах, и это в OC с 1.5.1 без проблем делается.

  6. Наталья

    14.01.2013 at 01:40

    А у меня и на Opencart 1.5.4 телефончики вставились, все отлично. Одно только не решилось, почему-то иконка не видна, а остальное все ок! Спасибо, вы лучший!

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

      14.01.2013 at 23:32

      Картинка в jpg или png? Если формат записанный в header.tpl отличается от формата картинки то она не будет отображаться.

  7. Артем

    24.01.2013 at 19:20

    Спасибо большое за уроки Владислав!
    Подскажите пожалуйста, возможно ли отдельно для номера телефона задать размер шрифта, не трогая остального текста?

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

      24.01.2013 at 21:35

      Без проблем, смотрите последние уроки — мы переделываем вывод телефонов — добавляем в форму чтение html кода, благодаря этому можно настроить цвет, размер и т.д. для телефонов и вывести ссылку на почту и т.д. Наше дополнение становится более функциональным.

  8. Вадим

    06.02.2013 at 14:45

    Здравствуйте! Почему-то во всех браузерах кроме Оперы, картинка корзины отображается над текстом — Корзина покупок. Размер header стандартный. Как сделать что бы отображалась картинка слева, и в других браузерах? 🙁

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

      06.02.2013 at 21:23

      Размер картинки корзины уменьшите, а ещё лучше если что-то не правильно отображается — давать ссылку.

  9. Алексей

    13.02.2013 at 02:26

    сделал по вашей схеме все , все настроил отлично работает но вышел такой баг

    при сохранение или изменении параметров в : система — настройки
    выскакивает такое окно
    Warning: Cannot modify header information — headers already sent by (output started at /home/delabuti/public_html/admin/language/russian/setting/setting.php:1) in /home/delabuti/public_html/system/engine/controller.php on line 28Warning: Cannot modify header information — headers already sent by (output started at /home/delabuti/public_html/admin/language/russian/setting/setting.php:1) in /home/delabuti/public_html/system/engine/controller.php on line 29

    причем когда я возвращаюсь при помощи браузера назад все настойки которые я изменил сохраняются
    код весь перерыл все правильно возможно ли с этим что то сделать ?

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

      13.02.2013 at 21:30

      Версия ОпенКарта какая? Статья написана для 1.5.3 и протестирована на ней же.

  10. Алексей

    14.02.2013 at 01:29

    версия 1.5.4.1 русская локализация осторе
    доп модули не ставил все стандарт.- причем вот все супер просто ! и телефон поставил и в админке изменяется только при сохранении параметров системы такую лажу пишет….. 😥
    что делать не знаю…… я и файлы пробовал заменять controller.php и setting.php не помогает . вот к Ваш обратился ….

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

      14.02.2013 at 21:29

      Будет свободное время — напишу такую же статью для 1.5.4

  11. Владимир Наумов

    18.05.2013 at 00:37

    Владислав, Вы просто молодец, что проводите такую полезную работу. Спасибо Вам огромное. По теме у меня к Вам вопрос. При редактировании файла header.tpl после загрузки картинки mobileme, Вы даете замену строки 49:
    , Но у меня строки с таким содержанием нет. Сначала я подумал, что это связано с тем, что у меня версия 1.5.4.1, но проверив этот файл в версии 1.5.3, я убедился, что и там нет этой строки. А без нее, вставляя замену в блок шапки, картинка сопровождается информацией:Notice: Undefined variable: headcontacts in Z:\home\localhost\www\snomik\catalog\view\theme\greentea\template\common\header.tpl on line 56 (вставка вместо замены в 56 строку). Подскажите, в чем может быть дело? Заранее благодарю, Владимир.

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

      18.05.2013 at 22:07

      Посмотрите в этой статье пункт 2.2. Что мы делаем в нём?

  12. Владимир Наумов

    20.05.2013 at 00:03

    Извините, Владислав — «промухал». Спасибо. Есть еще вопрос. Зеленая полоса меню у Вас на скрине сплошная, а получается составная (лесенкой). Так должно быть или где-то у меня все таки прокол? Пробовал менять настройки, не получается, видимо, нужно изменять сам рисунок navi_on. Хочется сплошной окрас. Заранее благодарю. Почему-то плохо срабатывает капча, хотя все набирается правильно, с трудом удается отправить комментарий.

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

      20.05.2013 at 00:29

      Скачайте фон опять, некоторые браузеры его криво скачивают. И не нужно 15 раз отправлять комментарий, проходит некоторое время проверки комментария и он появляется.

  13. А у меня проблема ! как мне контакты поставить в центр , что бы не мешало другим радиокнопкам !
    вот сайт http://avtopokup.ru/ , как видно на сайте не корректно отоброжается , мешает корзине !??

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

      14.06.2013 at 19:43

      Отступ задайте слева побольше.

  14. Андрей

    26.06.2013 at 11:36

    Здравствуйте! Опенкарт 1.5.3.1
    При выполнении пункта 1.3. При сохранении в «Контакты магазина:» Вылетает ошибка

    Warning: Cannot modify header information — headers already sent by (output started at … www\admin\language\russian\setting\setting.php:1) in \www\vqmod\vqcache\vq2-system_engine_cntroller.php on line 28Warning: Cannot modify header information — headers already sent by (output started at …www\admin\language\russian\setting\setting.php:1) in …\www\vqmod\vqcache\vq2-system_engine_controller.php on line 29

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

      26.06.2013 at 13:44

      У вас установлен vqmod, какой то файл использует код который вы модифицируете…

    • Андрей

      26.06.2013 at 13:54

      Понятно! И что мне делать с этим подскажите пожалуйста?

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

      26.06.2013 at 16:26

      Удалить vqmod который мешает работе шапки, либо вносите изменения из него в файлы и после этого вносите мои изменения

  15. Здравствуйте! Сделал все как написано, в админке этот пункт появился, ввожу контакты и сохраняю, но на самом сайте контакты не появляются. В чем проблема?

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

      27.06.2013 at 19:44

      Вы выполнили второй шаг урока (2.1 и 2.2)? Если выполнили то для шаблона который выбран в админке или к другому?

  16. Спасибо!!! Все получилось, действительно пропустил шаги 2.1 и 2.2!

  17. Дмитрий

    27.08.2013 at 00:48

    Добрый вечер! Не подскажите что за ошибка и как ее исправить?
    Notice: Undefined index: 2 in /home/optturkey.ru/httpdocs/catalog/controller/module/welcome.php on line 8
    Код:
    language->load(‘module/welcome’);

    $this->data[‘heading_title’] = sprintf($this->language->get(‘heading_title’), $this->config->get(‘config_name’));

    $this->data[‘message’] = html_entity_decode($setting[‘description’][$this->config->get(‘config_language_id’)], ENT_QUOTES, ‘UTF-8’);

    if (file_exists(DIR_TEMPLATE . $this->config->get(‘config_template’) . ‘/template/module/welcome.tpl’)) {
    $this->template = $this->config->get(‘config_template’) . ‘/template/module/welcome.tpl’;
    } else {
    $this->template = ‘default/template/module/welcome.tpl’;
    }

    $this->render();
    }
    }
    ?>

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

      27.08.2013 at 13:45

      Здравствуйте, нет не знаю.

  18. Инструкция классная, всё работает. Один вопрос: как изменить ширину текста контактов, а то у меня в одну строчку не умещается: http://maslomkartiny.ru/

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

      29.08.2013 at 22:32

      у нас же не фиксированная ширина у контактов, возможно упирается в другие div’ы

  19. Спасибо за статью, у меня подучилось все сделать на 1.5.6 на очень не дефолтном шаблоне http://rozetkamsk.ru прадв пришлось немного места вставок кода поискать. У вас замечательные уроки, но можно кроме названия делаем шаблон такой-то, сделать где-то список того что вы меняеете в статье, наверное далеко не все делают точно такой же шаблон. Еще раз спасибо.

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

      24.06.2014 at 12:12

      В новых статьях есть список задач на сегодня, в нём указано что мы делаем в материале.

  20. Спасибо огромное все получилось как в лучших домах. Всем советую, очень удобно.

  21. Дмитрий

    09.07.2014 at 23:49

    Владислав, спасибо Вам огромное! Ну очень помогли!

  22. добрый день, в чем может быть проблема. Когда я все прописал, как у вас написано у меня не исчезают номера с верхнего, левого угла…
    вот так получается — http://love-plitka.ru
    надеюсь на скорейший ответ

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

      05.10.2014 at 12:32

      Не вижу проблемы, уже исправили?

  23. ДА, спасибо, разобрался…. кеш подвис — бывает

  24. Добрый день выдает ошибку Notice: Undefined variable: entry_headcontacts in /home/host1269168/dhanvantary-hmmarket.ru/htdocs/www/admin/view/template/setting/setting.tpl on line 46
    Версия 1.5.5.1.2

    • 1. Если код копировали — вставляли — пробуйте писать всё руками.
      2. Если использовали не специализированный редактор кода — вполне возможны ошибки — слетает кодировка, добавляется лишняя информация.
      3. Если стоят вкмодули — пробуйте отключить.

  25. Здравствуйте! Спасибо за уроки. Очень помогают. У меня такой вопрос: Я делаю логотип как картинку на ширину всей шапки. Подскажите пожалуйста как сделать эти контактные данные поверх этого логотипа? Кнопка «поиск» отображается поверх, а контакты перекрывает логотип. Спасибо!

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

Your email address will not be published.

*

CAPTCHA image
*

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

Вверх ↑



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