Автор Тема: Помогите изменить внешний вид Prestashop 1/3  (Прочитано 10107 раз)

15 Августа 2011, 15:25:33
  • Новичок
  • *
  • Сообщений: 36
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Здравствуйте, у меня несколько вопросов на которые очень хотелось бы найти ответ:

1. Как сделать, чтобы сайт был во весь размер страницы браузера, а не по-центру, т.е. получается, что он как-то сжат, а левая и правая колонны находятся достаточно далеко от краев страницы браузера....
2. как поменять цвет текста в заголовках, блоках и т.д. (в global удалось поменять цвет только подвала (права защищены...))
Как, где логотип правее на этом же уровне добавить картинку? а еще лучше карусель, чтобы логотип был неизменным а рядом шли слайды?
Надеюсь на помощь.
16 Августа 2011, 12:45:49
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 105578
  • Репутация: +39546/-0
    • Просмотр профиля
    • Webstudio UwK
Цитата: golkiper89
1. Как сделать, чтобы сайт был во весь размер страницы браузера...
 

Изменить значения в файле стилей - global.css. См. прикрепленный файл, выбираете блок, который хотите изменить, например, для всего сайта - ширина во все окно:
/* global layout */
#page {
width: 980px; /* Меняем на 98% */
...
}
Не забываем вложенные блоки, колонки:
#left_column, #center_column, #right_column {  }

Цитата: golkiper89
2. как поменять цвет текста в заголовках, блоках и т.д. 
Выбираете блок, который хотите изменить, меняете значения в стилях.

Например, блок категорий:

<div class="block" id="categories_block_left">
  <h4>Каталог</h4>
   ......
</div>

файл стилей - category.css

Цитата: golkiper89
Как, где логотип правее на этом же уровне добавить картинку? а еще лучше карусель, чтобы логотип был неизменным а рядом шли слайды?

См. прикрепленный файл, вставить новый блок в header. Поменять положение блоков в header или увеличить размер header.
Cоздание интернет сайтов Webstudio UwK
16 Августа 2011, 12:54:57
Ответ #2
17 Августа 2011, 11:08:20
Ответ #3
  • Новичок
  • *
  • Сообщений: 36
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Огромное спасибо за помощь, с такими советами приятно работать! +100

единственное, не могу найти файлы стилей...искал css - очень маленький выбор, и даже как в примере category.css не нашел
17 Августа 2011, 11:29:35
Ответ #4
  • Администратор
  • Ветеран
  • *****
  • Сообщений: 102467
  • Репутация: +34217/-0
    • Просмотр профиля
Правила css для PrestaShop 1.3 находяться в одном файле, что видно на рисунке в топике о разнице версий 1.3 и 1.4

Для блока категорий, в файле  /themes/prestashop/css/global.css
линия 1237

/* Block categories */
div#categories_block_left ul.tree { padding-left:0.5em; }
div#categories_block_left ul.tree li {
08 Октября 2011, 18:15:07
Ответ #5
  • Новичок
  • *
  • Сообщений: 36
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Здравствуйте, еще есть один серьезный вопрос, подскажите, как в шапке престашоп сделать слайд-шоу?? правее логотипа или сказу под ним
09 Октября 2011, 01:36:00
Ответ #6
  • Администратор
  • Ветеран
  • *****
  • Сообщений: 102467
  • Репутация: +34217/-0
    • Просмотр профиля
Все зависит от того, как вы хотите сделать слайд-шоу. Можно использовать чужой модуль, а можно написать самому. Можно подправить - Модуль PrestaShop "Текстовый редактор для вашей домашней страницы" (модуль должен быть установлен). Он разрешает вставить только одну картинку, нужно будет его подредактировать, чтобы можно было загружать несколько картинок и показывать их с эффектом слайдшоу.
/module/editorial/editorial.php
<?php
<label>'.$this->l('Homepage\'s logo').' </label>
<div class="margin-form">
  <img src="'
.$this->_path.'homepage_logo.jpg" alt="" title="" style="" /><br />
  <input type="file" name="body_homepage_logo" />
  <p style="clear: both">'
.$this->l('Will appear next to the Introductory Text above').'</p>
</div>         
?>
Заменить:
<?php
<label>'.$this->l('Homepage\'s logo').' </label>';
$e=1
for(
$i=0$i<count($this->listeImg); $i++) {
  
$nameImg $this->listeImg[$i];
  
$cheminImg $this->_path.$nameImg.'.jpg';
  
$this->_html .= '
  <div class="margin-form"><hr /><br />
    Image '
.$e.' : <input type="file" name="'.$nameImg.'" /><br /><br />
    <input type="checkbox" name="sup_'
.$nameImg.'" /> Удалить картинку после подтверждения<br /><br />';
    if(
file_exists(dirname(__FILE__).'/'.$nameImg.'.jpg'))
    
$this->_html .= '<img src="'.$cheminImg.'" alt="" title="" style="" /> ';
    
$this->_html .= '</div>';
  
$e++;
  }
$this->_html .='
?>
Также нужно вснести измения в функцию getContent():
/* upload the image */
....
Добавить переменные для использования в шаблоне :
$smarty->assign(array(
.....
Внести измения в шаблон editorial.tpl.
Добавить описание стилей css.
09 Октября 2011, 13:21:37
Ответ #7
  • Ветеран
  • *****
  • Сообщений: 105578
  • Репутация: +39546/-0
    • Просмотр профиля
    • Webstudio UwK
Цитата: Виктор Демидов
Можно подправить - Модуль PrestaShop "Текстовый редактор для вашей домашней страницы"
/module/editorial/editorial.php
..................................

Способ хороший, в результате будет модуль, с помощью которого можно легко вставлять slideshow.
Требует времени и знаний PrestaShop.

Можно сделать проще, добавить все в файл - /themes/ваша_тема/header.tpl
1.js функции
<script type="text/javascript" src="{$content_dir}themes/ваша_тема/js/jquery_plugins.js"></script>
<script type="text/javascript" src="{$content_dir}themes/ваша_тема/js/ваш_js_scripts.js"></script>
2. блок со своим slideshow
Правее логотипа:
<!-- Header -->
<div id="header">
  <a id="header_logo" href="{$base_dir}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
    <img class="logo" src="{$img_ps_dir}logo.jpg?{$img_update_time}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
  </a>
  <div id="header_right">
     <!--- Ваш код  -->
Сам блок Slideshow:
<!--- Begin Slideshow  -->
<div id="slideshow">
    <ul>
      <li><a href="#"><img width="Размер_слайда" height="Размер_слайда" src="{$base_dir}themes/ваша_тема/slide1.jpg" alt="" /></a></li>
      ...
    </ul>
</div> <!-- slideshow --> 
<!--- End Slideshow -->
3. Добавить слайды и стили для вашего slideshow
4. Перенести все файлы на сервер.
Cоздание интернет сайтов Webstudio UwK
09 Октября 2011, 16:11:24
Ответ #8
  • Фрилансер
  • *
  • Сообщений: 242
  • Репутация: +3/-0
    • Просмотр профиля
Тоже интересут.
Можете по шагам объяснить про изменение Модуль PrestaShop "Текстовый редактор для вашей домашней страницы".
Описать как урок по созданию модуля prestashop.
Заранее спасибо.
17 Октября 2011, 14:54:19
Ответ #9
  • Новичок
  • *
  • Сообщений: 36
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Ребята, а кто-нибудь может все-таки буквально помочь мне? т.е. готовый пример, который осталось бы просто вставить в определенное место кода. если потребуется, готов за услугу заплатить
17 Октября 2011, 22:38:48
Ответ #10
  • Ветеран
  • *****
  • Сообщений: 86057
  • Репутация: +25403/-0
  • Сообщество PrestaShop
    • Просмотр профиля
26 Января 2012, 12:23:53
Ответ #11
  • Новичок
  • *
  • Сообщений: 6
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Цитата: golkiper89
1. Как сделать, чтобы сайт был во весь размер страницы браузера...
 

А на 1.4 как?
26 Января 2012, 14:25:54
Ответ #12
  • Администратор
  • Ветеран
  • *****
  • Сообщений: 102467
  • Репутация: +34217/-0
    • Просмотр профиля
Смотрите второй пост, там все описано. Изменение темы Prestashop с помощью замены стилей.
Различия между prestashop 1.3 и 1.4