Автор Тема: Шапка сайта  (Прочитано 5409 раз)

20 Марта 2012, 12:14:26
  • Новичок
  • *
  • Сообщений: 2
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Здравствуйте, я новичек в PrestaShop и вообще в разработке сайтов. У меня есть сайт на движке PrestaShop. Я хочу добавить в шапку сайтов номера телефонов и описание сайта. Подскажите какой код нужно добавить в global.css и header.tpl. Вот на картинке пример сайта, как бы я хотел сделать себе на сайт.


free image hosting
20 Марта 2012, 13:36:39
Ответ #1
  • Администратор
  • Ветеран
  • *****
  • Сообщений: 102467
  • Репутация: +34217/-0
    • Просмотр профиля
1. Добавьте новый блок с номерами телефонов в шаблон:
/** /themes/prestashop/header.tpl **/
<!-- Header -->
<div id="header">
.................
Ваш блок
2. Добавьте описание стилей в файл :
/themes/prestashop/css/global.css
20 Марта 2012, 17:55:16
Ответ #2
  • Новичок
  • *
  • Сообщений: 2
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Можно по подробнее :(
20 Марта 2012, 23:40:43
Ответ #3
  • Администратор
  • Ветеран
  • *****
  • Сообщений: 102467
  • Репутация: +34217/-0
    • Просмотр профиля
Все написано подробно. Вы знаете какие файлы менять, осталось поставить ваши значения. Этого никто делать не будет, так как только вы знаете, что вам нужно получить в итоге.
Если вам не понятно что и как делать, то лучше ничего не меняйте, обратитесь к специалисту, создайте тему в ветке Предложения о работе.
24 Марта 2012, 12:34:24
Ответ #4
  • Ветеран
  • *****
  • Сообщений: 20843
  • Репутация: +25277/-0
  • Prestashop - просто и эффективно
    • Просмотр профиля
Цитировать
1. Добавьте новый блок с номерами телефонов в шаблон:
/** /themes/prestashop/header.tpl **/
<!-- Header -->
<div id="header">
.................
Ваш блок
2. Добавьте описание стилей в файл :
/themes/prestashop/css/global.css
Шаблон
/** /themes/prestashop/header.tpl **/
<!-- Header -->
<div id="header">
.................
  <div class="telefon">
    +38(096) 123-45-45
    +38(096) 123-45-45
   </div>
</div>
Стили
/themes/prestashop/css/global.css

.telefon
{
  float:right;
  withd: 120px;
  font-size: 1.2em;
}
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
25 Августа 2012, 14:57:19
Ответ #5
  • Новичок
  • *
  • Сообщений: 1
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
не получилось  :-\
PrestaMan, напишите мне в личку, мне не удается отправить вам сообщение
17 Августа 2015, 17:09:59
Ответ #6
  • Ученик
  • Фрилансер
  • *
  • Сообщений: 180
  • Репутация: +0/-0
  • Создание продающих сайтов.
    • Просмотр профиля
    • Создание продающих сайтов, интернет-магазинов, визиток, блогов и порталов. Аудит системы продаж сайта!
Подскажите пожалуйста как правильно настроить в версии 1.6 отображение в телефоне  и компьютере например я так же добавил немного описания и телефоны я хочу чтобы телефон был на компьютере с права а на телефоне или по центру все по очереди как обычно или чтобы уменьшился и не терялся ,в компьютере у меня все ровно и красиво ,если я добавляю к примеру класс  от лого к своему тексту к номерам телефона то в телефоне все красиво и ровно но на компе все ужасно как их правильно согласовать или может быть это из за того что классы надо поставить в другие контейнера? Класс от лого я просто попробовал ,у меня настроены свои и отображения выставленного текста и телефонов в самом телефоне желал бы лучшего,заранее спасибо !
17 Августа 2015, 20:53:42
Ответ #7
  • Ветеран
  • *****
  • Сообщений: 1211
  • Репутация: +30/-1
  • Сообщество PrestaShop
    • Просмотр профиля
@media (max-width: 767px) {
    стили для телефона
.....     
}
Нужно сделать разные стили для разных разрешений.
17 Августа 2015, 21:04:04
Ответ #8
  • Ученик
  • Фрилансер
  • *
  • Сообщений: 180
  • Репутация: +0/-0
  • Создание продающих сайтов.
    • Просмотр профиля
    • Создание продающих сайтов, интернет-магазинов, визиток, блогов и порталов. Аудит системы продаж сайта!
@media (max-width: 767px) {после
    стили для телефона
.....     
}
Нужно сделать разные стили для разных разрешений.
Спасибо буду пробовать!
18 Августа 2015, 14:35:45
Ответ #9
  • Ученик
  • Фрилансер
  • *
  • Сообщений: 180
  • Репутация: +0/-0
  • Создание продающих сайтов.
    • Просмотр профиля
    • Создание продающих сайтов, интернет-магазинов, визиток, блогов и порталов. Аудит системы продаж сайта!
получается она поменяла стили и на компе и на телефоне совершенно без моих стилей прижало к левому краю и уменьшило шрифт а это от чего зависит ??
правильным было бы наверное @media only screen and (min-width: 768px)
 }стили
    display: none;}
18 Августа 2015, 16:09:35
Ответ #10
  • Ученик
  • Фрилансер
  • *
  • Сообщений: 180
  • Репутация: +0/-0
  • Создание продающих сайтов.
    • Просмотр профиля
    • Создание продающих сайтов, интернет-магазинов, визиток, блогов и порталов. Аудит системы продаж сайта!
подскажите как правильно сделать к примеру телефон на компе по правую сторону текста в шапке а в мобильном чтоб был по ценру ниже текста
18 Августа 2015, 18:26:36
Ответ #11
  • Ветеран
  • *****
  • Сообщений: 20843
  • Репутация: +25277/-0
  • Prestashop - просто и эффективно
    • Просмотр профиля
Показать с правой стороны
float:rightПоказать с левой
float:leftПоложение блока меняют
margin-left / margin-right
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
18 Августа 2015, 19:30:16
Ответ #12
  • Ученик
  • Фрилансер
  • *
  • Сообщений: 180
  • Репутация: +0/-0
  • Создание продающих сайтов.
    • Просмотр профиля
    • Создание продающих сайтов, интернет-магазинов, визиток, блогов и порталов. Аудит системы продаж сайта!
Показать с правой стороны
float:rightПоказать с левой
float:leftПоложение блока меняют
margin-left / margin-right
PrestaMan Cпасибо за ответ,я это понимаю я не понимаю как мне этот номер телефона или класс или айди в отображении на комьпютере сделать с права а на телефоне посередине!
напримересли подключаю @media only screen and (min-width: 768px) тогда этот класс сбрасывает все настройки css
18 Августа 2015, 19:42:43
Ответ #13
  • Ветеран
  • *****
  • Сообщений: 20843
  • Репутация: +25277/-0
  • Prestashop - просто и эффективно
    • Просмотр профиля
Для десктопа когда размер экрана больше 480px
.myclass {
        float:right;
        margin-right:0;
}
Для телефона когда размер экрана меньше 480px.
@media screen and (max-width: 480px) {
       .myclass {
            margin-right:50%;
       }
}
Эксперт Prestashop - решения всех проблем, написание модулей, создание тем для интернет-магазинов под Prestashop.
Эксперт Magento - создам сайт на Magento, программирование кастомных модулей для Magento, кастомизация тем Magento.
Лучшие цены!!!
18 Августа 2015, 21:00:23
Ответ #14
  • Ученик
  • Фрилансер
  • *
  • Сообщений: 180
  • Репутация: +0/-0
  • Создание продающих сайтов.
    • Просмотр профиля
    • Создание продающих сайтов, интернет-магазинов, визиток, блогов и порталов. Аудит системы продаж сайта!
Для десктопа когда размер экрана больше 480px
.myclass {
        float:right;
        margin-right:0;
}
Для телефона когда размер экрана меньше 480px.
@media screen and (max-width: 480px) {
       .myclass {
            margin-right:50%;
       }
Спасибо !
}