четверг, 28 марта 2013 г.

Выводим контакты в шапку (2 урок)

Сегодня речь пойдет о:
- как вывести дополнительные поля контактов в админ панели;
- как вывести нужное количество контактов (номеров телефона, skype, ICQ и т.д.);
Также в есть урок первый: Как переместить контакты в шапку
И так, для начала скажу, что бы применить этот урок у себя на сайте, для этого понадобится примерно 30-60 минут времени.
0. Как всегда я рекомендую сделать сделать копии следующих файлов:
\admin\language\russian\setting\setting.php
\admin\view\template\setting\setting.tpl
\admin\controller\setting\setting.php
\catalog\controller\common\header.php
\catalog\view\theme\default\template\common\header.tpl
\catalog\view\theme\default\stylesheet\stylesheet.css
OpenCart 1.5.4.1.
1. Открываем файл: 
\admin\view\template\setting\setting.tpl
находим:
<tr>
<td><span class="required">*</span> <?php echo $entry_email; ?></td>
<td><input type="text" name="config_email" value="<?php echo $config_email; ?>" size="40" />
<?php if ($error_email) { ?>
<span class="error"><?php echo $error_email; ?></span>
<?php } ?></td>
</tr>


после вставляем:

<tr>
<td><?php echo $entry_image_contact; ?>
<td><input type="text" name="config_image_from" value="<?php echo $config_image_from; ?>" />
<?php echo $entry_image_from; ?>
<br><input type="text" name="config_margin_left" value="<?php echo $config_margin_left; ?>" />px
<?php echo $entry_margin_left; ?>
</td>
</tr>

<tr>
<td><?php echo $entry_contact; ?> - 1
<td><input type="text" name="config_contact1" value="<?php echo $config_contact1; ?>" />
<br><input type="text" name="config_contacticon1" value="<?php echo $config_contacticon1; ?>" />
<?php echo $entry_contacticon; ?>
</td></td>
</tr>

<tr>
<td><?php echo $entry_contact; ?> - 2
<td><input type="text" name="config_contact2" value="<?php echo $config_contact2; ?>" />
<br><input type="text" name="config_contacticon2" value="<?php echo $config_contacticon2; ?>" />
<?php echo $entry_contacticon; ?>
</td></td>
</tr>



2. Открываем файл: 
\admin\controller\setting\setting.php
находим:

$this->data['config_address'] = $this->config->get('config_address');
     }


после вставляем:

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

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

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

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


находим:


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


после вставляем:


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



3. Открываем: 
\catalog\controller\common\header.php
находим:

$this->data['logo'] = '';
}


после копируем и вставляем:

$this->data['im_from'] = $this->config->get('config_image_from');
$this->data['marg_left'] = $this->config->get('config_margin_left');
$this->data['cont1'] = $this->config->get('config_contact1');
$this->data['conicon1'] = $this->config->get('config_contacticon1');
$this->data['cont2'] = $this->config->get('config_contact2');
$this->data['conicon2'] = $this->config->get('config_contacticon2');


4. Далее нужно открыть: 
\admin\language\russian\setting\setting.php
ищем:

// Entry


после копируем и вставляем следующий текст:

$_['entry_contact'] = 'Контакты';
$_['entry_contacticon'] = '<span style="color: red;">< < < </span> Иконка контакта';
$_['entry_margin_left'] = '<span style="color: red;">< < < </span> Отступ текста слева';
$_['entry_image_from'] = 'Путь к папке с иконкой';
$_['entry_image_contact'] = 'Иконка';


5. Открываем нужный файл: 
\catalog\view\theme\default\template\common\header.tpl
в этом файле нужно вставить данный текст в то место, где будут выводится наши контакты. Например у меня после контейнера <div id="search">...</div>: 

<div id="contact_bg">

<div id="contact_info_head1">

<div style="padding-left:<?php echo $marg_left; ?>px; height: 16px; line-height: 16px; background: url('<?php echo $im_from; ?><?php echo $conicon1; ?>') no-repeat; background-size: auto; ">
<?php echo $cont1; ?>
</div>

<div style="padding-left:<?php echo $marg_left; ?>px; height: 16px; line-height: 16px; margin-top: 5px; background: url('<?php echo $im_from; ?><?php echo $conicon2; ?>') no-repeat; background-size: auto; ">
<?php echo $cont2; ?>
</div>

</div>
</div>


5.1. Мой стиль <div id="contact_bg"> в файле:
\catalog\view\theme\default\stylesheet\stylesheet.css


#contact_bg {
position: absolute;
background: url("../image/contact_header_bg.gif") center center no-repeat;
width: 277px;
height: 100px;
right: 0px;
left: 300px;
top: 5px;
}


5.2. Мой стиль <div id="contact_info_head1"> в файле:
\catalog\view\theme\default\stylesheet\stylesheet.css


#contact_info_head1 {
position: absolute;
width:240px;
left: 10px;
top: 10px;
text-align: left;
font-size: 12px;
color: #E8E8E8;
z-index: 8;
}


6. Результат:






62 комментария:

  1. Анонимный31 марта, 2013 19:06

    спасибо, то что мне нужно

    ОтветитьУдалить
  2. Анонимный01 апреля, 2013 09:33

    Помогите пожалуйста! Вот что оно мне пишет в админке.
    Notice: Undefined variable: entry_contact in /home/h32148/data/www/active-point.com.ua/admin/view/template/setting/setting.tpl on line 54 - 1
    Notice: Undefined variable: entry_contacticon in /home/h32148/data/www/active-point.com.ua/admin/view/template/setting/setting.tpl on line 57
    Notice: Undefined variable: entry_contact in /home/h32148/data/www/active-point.com.ua/admin/view/template/setting/setting.tpl on line 62 - 2
    Notice: Undefined variable: entry_contacticon in /home/h32148/data/www/active-point.com.ua/admin/view/template/setting/setting.tpl on line 65

    ОтветитьУдалить
    Ответы
    1. ошибка в файле: /admin/view/template/setting/setting.tpl
      на 54 57 62 и 65 строки.

      Повторите 1 и 2 шаг.

      PS
      как правило все забывают о "}".

      Удалить
    2. еще интересно, почему entry_contacticon? 4 шаг делался?

      Удалить
  3. Анонимный01 апреля, 2013 10:31

    Все пункты проделал повторно. Увы но все так и осталось.

    ОтветитьУдалить
    Ответы
    1. Пришлите мне на мыло нужные файлы. (те что в начале прописаны в 0 пункте, кроме css)

      Удалить
    2. файлы редактированы и отправлены на мыло.

      Удалить
  4. Анонимный05 апреля, 2013 11:11

    спасибо большое

    ОтветитьУдалить
  5. Анонимный05 апреля, 2013 11:18

    Был бы очень признателен если бы вы сделали урок по обратной связи! имею в виду как добавить скайп,тел,аську,email, адрес магазина в Футуре

    ОтветитьУдалить
  6. Анонимный05 апреля, 2013 20:17

    ок! будем ждать!!!

    ОтветитьУдалить
  7. Анонимный06 апреля, 2013 11:55

    точно такие же ошибки как у Анонимного от 1 апреля, со скобками все нормально специально перепроверил, где то ты накосорезил в статье... либо копи-пасты от тебя на статью как то некорректно прошли (например при копировании и поиске со статьи $this->data['logo'] = ' '; в 3-ем пункте нихрена не находит, а если стереть несколько последних символов, то находит...)

    ОтветитьУдалить
    Ответы
    1. В моем блоге "копи-паста" нет.

      Удалить
    2. $this->data['logo'] = ' ';
      нет, потому что в оригинале:
      $this->data['logo'] = '';

      В таких случаях нужно импровизировать.

      Удалить
  8. Был упущен один элемент при создании урока.
    Повторите 2 и 3 шаги.

    ОтветитьУдалить
  9. Анонимный07 апреля, 2013 11:26

    как увеличить текст разобрался а вот как увеличить иконку? а то ее по высоте режет...

    ОтветитьУдалить
    Ответы
    1. 5 шаг.
      height: 16px - размер контейнера.
      background-size: auto; - размер иконки под размер контейнера.

      Удалить
    2. Анонимный07 апреля, 2013 17:02

      еще раз огромное спасибо! все получилось)
      как вариант раз у тебя все таки уроки а не упражнения по ctrl+c и ctrl+v, может в каждом пункте расписать что происходит ну например пункт 5.1 прописываем параметры главной иконки 5.2 прописываем параметры текста и т.д.

      Удалить
    3. http://opencartadm.blogspot.com/2013/03/blog-post_840.html

      Удалить
  10. Анонимный09 апреля, 2013 22:57

    Доброго времени суток, все шаги выполнил, но не чего не изменилось

    ОтветитьУдалить
    Ответы
    1. В каком смысле "ничего"? ошибки, что то да должно было произойти.

      PS
      Ждите новый урок по этой теме, там будем интересней решение.

      Удалить
    2. Анонимный09 апреля, 2013 23:06

      Сейчас повторю все снова)))

      Удалить
    3. Все получится, главное все правильно и в нужно место вставлять.

      Удалить
    4. Анонимный09 апреля, 2013 23:41

      Получилось спасибо!!! Подскажите пожалуйста как мне исправить положение блока получилось вот так av-rostov.ru, и в какую папку размещать иконки контактов? Я не чего не понимаю в программировании, спасибо огромное.

      Удалить
    5. 5.1. пункт.
      смотрите: top: 5px; - поставьте 60px примерно.
      5.2. пункт.
      color: #E8E8E8;
      измените на:
      color: #000000;

      Иконка.
      Посмотрите на скриншот результату: путь к ПАПКЕ с иконками (пусть указать относительно корня сайта. Например: /images/icon). Забрасываем в это папку (Например: /images/icon) иконки контактов (Например: mts.png, life.jpeg)/Далее на скриншоте: "Иконка контакта" вставляем название иконки из папки (Например: /images/icon) - life.jpeg.

      Удалить
    6. Анонимный10 апреля, 2013 00:24

      пункт 5.1 менял от 60 до 200 px не чего не происходит

      Удалить
    7. Это спили. Вы его подключили в heder.tpl?

      Удалить
    8. Анонимный10 апреля, 2013 21:27

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

      Удалить
    9. Там залейте в админ-панели меньший логотип.

      Удалить
  11. Анонимный30 апреля, 2013 04:04

    в \admin\controller\setting\setting.php

    нету $this->data['tab_sms'] = $this->language->get('tab_sms');

    oc 1.5.5.1

    ОтветитьУдалить
    Ответы
    1. Поставьте после

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

      Все это проверялось и заводилось на 1.5.4.1.

      Удалить
  12. подскажите такая проблема все делал по инструкции 2 раза пробовал
    А админке появились контакты 1 и 2
    дальше остался телефон и факс

    ОтветитьУдалить
    Ответы
    1. Анонимный13 мая, 2013 12:06

      Так и не понял сути вопроса. Нужно что-бы еще что-то выводилось?

      Удалить
  13. Анонимный05 июля, 2013 17:04

    Огромное спасибо!
    Подскажите, как выставить телефоны в один ряд?

    ОтветитьУдалить
    Ответы
    1. В уроке №5 - редактировать там нужно, но если все копировалось - тогда смотрите CSS (вообще тут нет кода, который переносит эти строки. поместите в больший контейнер div, например установите #contact_info_head1 {
      width:640px;
      }

      Удалить
  14. Анонимный05 июля, 2013 19:11

    У меня вместо 3 контактов, всего 2. В админке ниже контакт 1 и контакт 2, поля: телефон и факс, которые на сайт не выводятся.
    Мне нужно отобразить на сайте три номера телефона. И как вариант не в столбик, а в одной строке (можно и без лого).
    Заранее благодарен.
    Богдан.

    ОтветитьУдалить
    Ответы
    1. И должно выводится 2 поля в админке для контактов. Если нужно 3 и больше, просто нужно скопировать нужный код у всех файлах и назвать его 3. Смотрите в 1 этапе

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

      Удалить
  15. Все сделала новылез такой вот хвост, в заказах, показать счет пишется кракозябра!!

    ОтветитьУдалить
  16. Нашел лечение, для того что бы в админ-продажи-заказы- показать счет, в счете все работало как часики, а не лезла кракозябра, меняем в: мой сайт\admin\controller\sale\order.php, строчка 2385: с $store_telephone = $store_info['config_telephone']; на $store_telephone = $store_info['config_contact1']; и в строчке 2386: $store_fax = $store_info['config_fax']; на $store_fax = $store_info['config_contact2'];

    ОтветитьУдалить
  17. Анонимный25 июля, 2013 16:08

    Доброго времени суток! подскажите пожалуйста как можно сместить номера в правую сторону?

    ОтветитьУдалить
  18. Анонимный25 июля, 2013 17:34

    Дело в том, что логотип скрывает все((( тема стандартная

    ОтветитьУдалить
    Ответы
    1. Если вам нужно поместить НА логотип, смотрите файл стилей (z-index)

      Удалить
  19. Не показывает иконки ((( Проверил пути, наличие, формат, имена, размеры изображений. Логотип убрал, блок сместил вправо. Текст есть - а иконок нет (((

    ОтветитьУдалить
  20. Здравствуйте! Не совсем понятны шаги 5.1 и 5.2. Куда и что надо вставлять? Эти куски надо вставлять в файл catalog\view\theme\default\stylesheet\stylesheet.css? Если да, то куда конкретно?

    ОтветитьУдалить
    Ответы
    1. Этот ответ многим, кто копирует себе этот кусок кода и думает, что оно должно быть так, как на картинке к "Результат урока". Такого не будет. Во первый потому что каждый использует свой шаблон, свои стили и свой язык написания шаблона и по этому нужно изучить хоть основы Веб верстки.

      небольшой урок:
      - что бы поместить нужный элемент на нужно место - для этого как минимум нужно понимать, как написан шаблон вашего магазина (блочная, табличная, скриптовая, Xhtml тоже не исключаем);
      - Посмотрите книги "css с нуля" автор не имеет значения, тогда у вас будет хоть какая-то информация о том, что этот файл (stylesheet.css например) из себя представляет и как его можно крутить;
      - найдите человека, который это все знает (цена = качество, но не наоборот) заплатите несколько десятков американских рублей и он вам все поправит.

      ps
      изучать верстку не так сложно, как кажется...

      Удалить
  21. Доброе время суток!Проделал всю процедуру,в админке появились дополнительные поля,но на главной так и не выводит... сайт automax.dp.ua шаблон стандартный

    ОтветитьУдалить
  22. Доброго времени суток! Проблема такая же, как у первого комментирующего. Все повторила 2 раза, проверила все скобки - все совпадает, но не работает. Подскажите, пожалуйста, как исправить ошибку? Спасибо

    ОтветитьУдалить
    Ответы
    1. Доброе.
      Какая у вас версия cms?

      Удалить
    2. Этот урок делался на чистом OpenCart 1.5.4.1.

      Удалить
    3. Тогда все понятно, спасибо
      А для версии 1.5.5.1 что-нибудь будет?

      Удалить
    4. Да, но блог сейчас в планах перевести на другой хост.

      Удалить
  23. Ребята, версия Ocstore 1.5.5.1, все добавилось успешно и работает, Спасибо за урок))

    ОтветитьУдалить
  24. Анонимный18 июля, 2014 12:57

    Подскажите пожалуйста, в каком именно шаге мы выбираем место расположения этих контактов, и в каком шаге устанавливаеться кол-во дополнительных контактов?

    ОтветитьУдалить
  25. Не могу понять, в какое место воткнуть :

    #contact_bg {
    position: absolute;
    background: url("../image/contact_header_bg.gif") center center no-repeat;
    width: 277px;
    height: 100px;
    right: 0px;
    left: 300px;
    top: 5px;
    }

    и

    #contact_info_head1 {
    position: absolute;
    width:240px;
    left: 10px;
    top: 10px;
    text-align: left;
    font-size: 12px;
    color: #E8E8E8;
    z-index: 8;
    }
    Подскажите пожалуйста. и так, чтобы это заработало. Спасибо!!

    ОтветитьУдалить
    Ответы
    1. 1. блог уже не активный и переехал на другой адрес (смотрите последние новости);
      2. stylesheet.css - это вот туда нужно "воткнуть";
      3. читаем внимательно 5 шаг.

      Удалить
    2. Я понял, что в stylesheet.css. Я просто с таблицей стилей не работал особо. Нет разницы в какое именно место "воткнуть" или все же есть? Вот с этим никак не могу разобраться...
      Да и 5-й шаг вроде внимательно читал, но может что-то и упустил((

      Удалить
  26. Анонимный07 ноября, 2014 05:26

    Спасибо, очень помогли - все работает! :-)

    ОтветитьУдалить
  27. Помогите плиииз..... в админке всё появилось, но когда вписываешь номер и пути к картинкам и сохраняешь, выход такой
    Warning: Cannot modify header information - headers already sent by (output started at /var/www/vhosts/u0087852.plsk.regruhosting.ru/httpdocs/dust-gold.ru/admin/language/russian/setting/setting.php:1) in /var/www/vhosts/u0087852.plsk.regruhosting.ru/httpdocs/dust-gold.ru/system/engine/controller.php on line 28Warning: Cannot modify header information - headers already sent by (output started at /var/www/vhosts/u0087852.plsk.regruhosting.ru/httpdocs/dust-gold.ru/admin/language/russian/setting/setting.php:1) in /var/www/vhosts/u0087852.plsk.regruhosting.ru/httpdocs/dust-gold.ru/system/engine/controller.php on line 29

    ОтветитьУдалить
    Ответы
    1. Версия OC уже давно не такая, как было указано в уроке... Возможно там есть свои нюансы, которые не учтены в уроке на старой версии.

      Удалить