Перейти к содержанию
suzume

Смещение поиска, изменения в "Featured"

Рекомендуемые сообщения

Добрый день.

Помогите, пожалуйста. Возникла пара вопросов:

1. Что/где изменять, чтобы сместить поле+кнопку поиска вправо (прямо к корзине)? 

k.1368296014.png

 

Либо, может, будет симпатичнее смотреться, если его уменьшить и переместить вот на эту панель:

(на месте "Информация", "Корзина", "Оформление заказ" - так как это все доступно из личного кабинета/корзины) 

Image8.1368296160.png

 

Находила темы с подобными вопросами, но там для других версий oC.

 

2. Как сделать, чтобы на строке вместо 6 товаров (в "рекомендуемых" и "новых поступлениях") было 4, например? 

    И чтобы они были по центру, а не по левому краю. Не нравится пустое место вот тут: 

Image11.1368296826.png

либо туда поставить модуль "Акции", но он уходит вверх под модуль "Слайд-шоу" (в настройках по Правой колонке):

Image12.1368297003.png

 

 

3. И хотелось бы продлить концы ленточек в разные стороны:

Image13.1368297135.png

 

 

Шаблон: palioxis

Версия oC: v1.5.4.1

 

Заранее спасибо с:

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А пиши в личку! Распишем все твои проблемы по полкам! 

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А пиши в личку! Распишем все твои проблемы по полкам! 

Хорошо. 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Так, в чем-то разобралась сама.
Все изменения в /catalog/view/theme/название темы/stylesheet - stylesheet.css

- 166 строка, в контейнере в конце добавила text-align: center; , чтобы была центровка всего на странице -

 

#container {
width: 980px;
margin-left: auto;
margin-right: auto;
text-align: center;
}


1. Смещение поиска
Строка 263, смещение вправо со значением 170px
в итоге:



#header #search {
position: absolute;
top: 23px;
right: 170px;
width: 298px;
z-index: 15;
padding: 10px 14px 10px 10px;
}

Из-за центровки надпись "Поиск" сместилась чуть правее, в итоге частично закрывала изображение с лупой.
Решилось так: пропись позиции (absolutely не работает) с relative + вправо на 10px
строка 290, #header .bst
 

#header .bst {
color: #626262;
font-size: 10px;
font-weight: bold;
line-height: 27px;
padding-left: -6px;
-webkit-text-shadow: 0px -1px 0 #e9e6e6;
-moz-text-shadow: 0px -1px 0 #e9e6e6;
text-shadow: 0px -1px 0 #e9e6e6;
position: relative;
right: 10px;
}

2. Правка модулей "Последние" (они же Новые поступления) и "Рекомендуемые"
начнем со второго.
Рекомендуемые = Featured (Module)
1004 строка и далее.
Конкретно нужен был кусок со значением ширины: width: **px; (1029 строка и далее). Ставим нужное кол-во px.
В конце выглядит так:



.featured-box > div {
width: 220px;
display: inline-block;
vertical-align: top;
margin-left: auto;
margin-right: auto;
margin-top: 8px;
margin-bottom: 10px;
border-bottom: 1px solid #f1f5f6;
}

Правка "Последние"
Нужно Latest, Special and Bestsellers Module, это 1247 строка
Правим то же самое, что и выше:
 

.box-cl > div {
width: 220px;
display: inline-block;
vertical-align: top;
margin-left: 5px;
margin-bottom: 5px;
padding: 0px;}

Также можно добавить и там, и там:
 

.box-cl > div:hover { 
cursor:pointer;
border: 1px solid #ddd;
box-shadow: 0px 0px 30px 0px #ddd; 
width: 220px; 
padding: -3px;
}

Дает обводку вокруг товара:
Image19.1368324899.png

Ну и заодно изменила вид отображения товаров:
1630 строка и далее

 

.product-grid > div {
width: 120px;
display: inline-block;
vertical-align: top;
margin-left: auto;
margin-right: auto;
margin-bottom: 15px;
text-align: center;
}
.product-grid > div:hover {
cursor:pointer;
border: 1px solid #ddd;
box-shadow: 0px 0px 30px 0px #ddd ;
width: 120px;
padding: -3px;
}
 

P.S. Далее нужно изменить размер изображений (для Последних и Рекомендуемых в модялях), размер изображений в просмотре товара в настройках админки (Система-Настройки-*магазин*-Изображения). Для нормального отображения лучше проставить -20px от того размера, что проставляли в stylesheet.css.

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.