Перейти к содержимому


Пара Вопросов


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 38

#1 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 12:46

Здравствуйте! Есть несколько вопросов по дизайну...
1.Подскажите, как закрепить фон на месте?, но чтобы остальное содержимое сайта прокручивалось...

2.Возможно ли сделать на главной странице, каталог слева убрать, а в место него выложить под слайдером категории каталога отдельными блоками с легким описанием (как на фото 1)
1.jpg

#2 empty9228

empty9228

    Активный участник

  • Модератоpы
  • 618 сообщений

Отправлено 23 Апрель 2014 - 14:20

Здравствуйте, по 1ому вопросу.

найдите в файле main.css код
#container {width: 100%;margin-left: auto;margin-right: auto;text-align: left;background: url(http://o20829.storeland.net/fon555.jpg) ;}/* фон */

замените его на
#container {width: 100%;margin-left: auto;margin-right: auto;text-align: left;background: url(http://o20829.storeland.net/fon555.jpg) no-repeat center;background-size: 100%;}/* фон */


#3 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 15:50

Просмотр сообщенияempty9228 (23 Апрель 2014 - 14:20) писал:

Здравствуйте, по 1ому вопросу.

найдите в файле main.css код
#container {width: 100%;margin-left: auto;margin-right: auto;text-align: left;background: url(http://o20829.storeland.net/fon555.jpg) ;}/* фон */

замените его на
#container {width: 100%;margin-left: auto;margin-right: auto;text-align: left;background: url(http://o20829.storeland.net/fon555.jpg) no-repeat center;background-size: 100%;}/* фон */

Ничего не вышло(( фон прокручивается вместе с содержимым ...есть еще задумки)))???

#4 Castiel

Castiel

    Активный участник

  • Модераторы
  • 3 519 сообщений
  • ГородНижний Новгород

Отправлено 23 Апрель 2014 - 15:58

Просмотр сообщенияAlex777 (23 Апрель 2014 - 15:50) писал:

Ничего не вышло(( фон прокручивается вместе с содержимым ...есть еще задумки)))???
В файле "main.css".
Найти:
#container {
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
background: url(http://o20829.storeland.net/fon555.jpg);
}

Заменить:
#container {
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
background: url({ASSETS_IMAGES_PATH}fon555.jpg) fixed;
}

2. Для того чтобы создать такую структуру вам необходимо будет самостоятельно написать html код.
В шаблоне HTML добавляем в желаемое место  {% IF index_page %}  это условие для отображения только на главной
{% IF index_page %}
Код вашего блока
{% ENDIF %}

Потом добавляем стили, чтобы он отображался именно так как вам необходимо в файле main.css

#5 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 16:19

Просмотр сообщенияCastiel (23 Апрель 2014 - 15:58) писал:

В файле "main.css".
Найти:
#container {
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
background: url(http://o20829.storeland.net/fon555.jpg);
}

Заменить:
#container {
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: left;
background: url({ASSETS_IMAGES_PATH}fon555.jpg) fixed;
}

2. Для того чтобы создать такую структуру вам необходимо будет самостоятельно написать html код.
В шаблоне HTML добавляем в желаемое место  {% IF index_page %}  это условие для отображения только на главной
{% IF index_page %}
Код вашего блока
{% ENDIF %}

Потом добавляем стили, чтобы он отображался именно так как вам необходимо в файле main.css

Спасибо!!! С первым вопросом помогло)))

#6 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 19:03

Добрый вечер! Подскажите:

1. как удалить кнопку которая скрывает шапку?
2. где находится код отвечающий за цвет блока верхнего меню (лента во всю ширину экрана)?
3. как установить категории (каталог) на главную страницу и растянуть этот блок с категориями на равную ширину?

На фото показано визуально...

Прикрепленные изображения

  • 1.jpg


#7 MikDark

MikDark

    Активный участник

  • Модераторы
  • 6 468 сообщений

Отправлено 23 Апрель 2014 - 19:15

Просмотр сообщенияAlex777 (23 Апрель 2014 - 19:03) писал:

Добрый вечер! Подскажите:

1. как удалить кнопку которая скрывает шапку?
2. где находится код отвечающий за цвет блока верхнего меню (лента во всю ширину экрана)?
3. как установить категории (каталог) на главную страницу и растянуть этот блок с категориями на равную ширину?

На фото показано визуально...

1) В main.css найдите код:
.toggler {
position: absolute;
display: block;
width: 25px;
height: 22px;
background-color: #ff0551;
bottom: -22px;
left: 0;
text-indent: -9999px;
cursor: pointer;
z-index: 1000;
}

и замените на:
.toggler {
position: absolute;
display: none;
width: 25px;
height: 22px;
background-color: #ff0551;
bottom: -22px;
left: 0;
text-indent: -9999px;
cursor: pointer;
z-index: 1000;
}

2) За цвет отвечает код:
.header_top {
width: 100%;
margin: 0 auto;
min-height: 40px;
background-color: #f5f5f5;
}

параметр #f5f5f5

3) В main.css найдите и удалите код:
#column-left + #content {
margin-left: 235px;
}

далее в бэк-офисе зайдите в раздел Сайт - Главная страница и выберите в списке Каталог

#8 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 19:43

Просмотр сообщенияMikDark (23 Апрель 2014 - 19:15) писал:

1) В main.css найдите код:
.toggler {
position: absolute;
display: block;
width: 25px;
height: 22px;
background-color: #ff0551;
bottom: -22px;
left: 0;
text-indent: -9999px;
cursor: pointer;
z-index: 1000;
}

и замените на:
.toggler {
position: absolute;
display: none;
width: 25px;
height: 22px;
background-color: #ff0551;
bottom: -22px;
left: 0;
text-indent: -9999px;
cursor: pointer;
z-index: 1000;
}

2) За цвет отвечает код:
.header_top {
width: 100%;
margin: 0 auto;
min-height: 40px;
background-color: #f5f5f5;
}

параметр #f5f5f5

3) В main.css найдите и удалите код:
#column-left + #content {
margin-left: 235px;
}

далее в бэк-офисе зайдите в раздел Сайт - Главная страница и выберите в списке Каталог

Спасибо! С первыми 2 вопросами - нет проблем))
3  вопрос - каталог встал на главной, но общий блок не растянулся на ширину страницы (левая часть главной - пустая, блок каталога я удалил)...что делать, чтобы категории закрыли эту область?

#9 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 19:55

Все разобрался...спасибо!)) только теперь не работает левый каталог в категориях (не отвечает на клики) и фото категорий упали вниз к подвалу...как здесь быть? на фото понятнее...

Прикрепленные изображения

  • 11.jpg


#10 MikDark

MikDark

    Активный участник

  • Модераторы
  • 6 468 сообщений

Отправлено 23 Апрель 2014 - 20:18

Просмотр сообщенияAlex777 (23 Апрель 2014 - 19:55) писал:

Все разобрался...спасибо!)) только теперь не работает левый каталог в категориях (не отвечает на клики) и фото категорий упали вниз к подвалу...как здесь быть? на фото понятнее...

Верните, пожалуйста, из 3-го пункта код в main.css. Далее в шаблоне HTML ищем:
<div id="content">
	   
		  {BODY}

и меняем на:
<div id="content" {% IF index_page %}style="margin-left: 0px !important;"{% ENDIF %}>
	   
		  {BODY}


#11 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 21:04

Просмотр сообщенияMikDark (23 Апрель 2014 - 20:18) писал:

Верните, пожалуйста, из 3-го пункта код в main.css. Далее в шаблоне HTML ищем:
<div id="content">
	
		 {BODY}

и меняем на:
<div id="content" {% IF index_page %}style="margin-left: 0px !important;"{% ENDIF %}>
	
		 {BODY}

Спасибо огромное! Все как хотел)))
Пожалуйста, еще пару вопросов:

1.Как закруглить края блоков категорий с фото?
2.Как выровнить блоки с категориями на главной - относительно ширины страницы? т.к. с левой стороны расстояние меньше, чем справа...а надо ровно - по сторонам...

#12 MikDark

MikDark

    Активный участник

  • Модераторы
  • 6 468 сообщений

Отправлено 23 Апрель 2014 - 21:10

Просмотр сообщенияAlex777 (23 Апрель 2014 - 21:04) писал:

Спасибо огромное! Все как хотел)))
Пожалуйста, еще пару вопросов:

1.Как закруглить края блоков категорий с фото?
2.Как выровнить блоки с категориями на главной - относительно ширины страницы? т.к. с левой стороны расстояние меньше, чем справа...а надо ровно - по сторонам...

1) В main.css ищем:
.prod_hold {
width: 250px;
}

и меняем на:
.prod_hold {
width: 250px;
border-radius: 5px;
}

5px - это закругление, его можно менять.

2) Лучше эти блоки не трогать. т.к. это повлияет на адаптивность сайта.

#13 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 23 Апрель 2014 - 21:26

Просмотр сообщенияMikDark (23 Апрель 2014 - 21:10) писал:

1) В main.css ищем:
.prod_hold {
width: 250px;
}

и меняем на:
.prod_hold {
width: 250px;
border-radius: 5px;
}

5px - это закругление, его можно менять.

2) Лучше эти блоки не трогать. т.к. это повлияет на адаптивность сайта.
Спасибо! Все ОК!!

#14 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 24 Апрель 2014 - 13:35

Добрый день! Подскажите:

1. На странице с товаром (внизу): где изменить цвет надписи "С этим товаром смотрят"?

2. На главной: изменить цвет надписи "Новинки"

3. В подвале: изменить цвет нижнего меню

4. Где изменить цвет линии над нижнем меню?

5. На страницах категорий и товаров: верхняя широкая линия (серая) с названиями товаров - где изменить цвет и параметры (толщину) этой линии?
6. Где изменить цвет самой нижней линии в подвале , где написано " все права защищены" и пр...

#15 Dars

Dars

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 410 сообщений

Отправлено 24 Апрель 2014 - 15:17

Просмотр сообщенияAlex777 (24 Апрель 2014 - 13:35) писал:

Добрый день! Подскажите:

1. На странице с товаром (внизу): где изменить цвет надписи "С этим товаром смотрят"?
В шаблоне "Товар" найдите строчку
<h3 class="heading_title">С этим товаром смотрят</h3>
и измените её таким образом:
<h3 class="heading_title" style="color:#ffffff;">С этим товаром смотрят</h3>
где ffffff - цвет в 16-ричной системе (как и во всех примерах ниже).


Цитата

2. На главной: изменить цвет надписи "Новинки"
В шаблоне HTML найдите строку
<h2 class="heading_title"><span>Новинки</span></h2>
и измените её на:
<h2 class="heading_title" style="color:#ffffff;"><span>Новинки</span></h2>


Цитата

3. В подвале: изменить цвет нижнего меню
В main.css найдите строчку
#footer a{text-decoration: none;}
и замените её на
#footer a{text-decoration: none;color:red;}

Цитата

4. Где изменить цвет линии над нижнем меню?
В main.css в строке
#footer {clear: both;margin-top: 30px;min-height: 100px;padding:0 0 30px 0;border-top:4px solid #333333;}
значение 333333 измените на нужный вам цвет.

Цитата

5. На страницах категорий и товаров: верхняя широкая линия (серая) с названиями товаров - где изменить цвет и параметры (толщину) этой линии?
В main.css в строке
.title-holder {background:url('http://o20829.storeland.net/inner_shadow2.png') 50% 3px no-repeat;background-color:#f1f1f1;border-bottom:1px solid #e9e9e9;position:relative;overflow:hidden;z-index:0;padding:13px 0 15px 0;clear:both; }
значение f1f1f1 замените на нужный вам цвет.

Цитата

6. Где изменить цвет самой нижней линии в подвале , где написано " все права защищены" и пр...
В main.css найдите строку
#powered {text-align: center;clear: both;padding:8px 0;background-color:#e0e0e0;font-size:11px;}
и измените значение #e0e0e0 на нужный вам цвет

#16 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 24 Апрель 2014 - 18:24

Просмотр сообщенияDars (24 Апрель 2014 - 15:17) писал:

В шаблоне "Товар" найдите строчку
<h3 class="heading_title">С этим товаром смотрят</h3>
и измените её таким образом:
<h3 class="heading_title" style="color:#ffffff;">С этим товаром смотрят</h3>
где ffffff - цвет в 16-ричной системе (как и во всех примерах ниже).



В шаблоне HTML найдите строку
<h2 class="heading_title"><span>Новинки</span></h2>
и измените её на:
<h2 class="heading_title" style="color:#ffffff;"><span>Новинки</span></h2>



В main.css найдите строчку
#footer a{text-decoration: none;}
и замените её на
#footer a{text-decoration: none;color:red;}

В main.css в строке
#footer {clear: both;margin-top: 30px;min-height: 100px;padding:0 0 30px 0;border-top:4px solid #333333;}
значение 333333 измените на нужный вам цвет.

В main.css в строке
.title-holder {background:url('http://o20829.storeland.net/inner_shadow2.png') 50% 3px no-repeat;background-color:#f1f1f1;border-bottom:1px solid #e9e9e9;position:relative;overflow:hidden;z-index:0;padding:13px 0 15px 0;clear:both; }
значение f1f1f1 замените на нужный вам цвет.

В main.css найдите строку
#powered {text-align: center;clear: both;padding:8px 0;background-color:#e0e0e0;font-size:11px;}
и измените значение #e0e0e0 на нужный вам цвет
Спасибо! Все отлично..

#17 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 24 Апрель 2014 - 19:09

Помогите еще, пожалуйста))) - на ФОТО понятней..

1. Где код на перемещение верхнего меню? и код за цвет при наведении?

2. Как сузить расстояние между блоком связи и значком "телефон"?

3. Как изменить цвет слов в верхнем блоке категорий: Главная>>Каталог>> и пр...?

4. Как удалить выдачу (товаров в категории) в верхнем блоке?

5. Как удалить полосу под товарами?

Прикрепленные изображения

  • 1.jpg


#18 Dars

Dars

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 410 сообщений

Отправлено 24 Апрель 2014 - 19:46

Просмотр сообщенияAlex777 (24 Апрель 2014 - 19:09) писал:

Помогите еще, пожалуйста))) - на ФОТО понятней..

1. Где код на перемещение верхнего меню? и код за цвет при наведении?
Код на цвет в main.css, строка
a:hover{ text-decoration:underline; color:#ff0551; }
Меняете ff0551 на нужный вам цвет.
Код на перемещение:
#header .links {padding-right: 10px;float:left;margin-left:30px;clear: both;}
Если не справитесь сами, то пришлите скриншот, где будет указано желаемое вами расположение.

Цитата

2. Как сузить расстояние между блоком связи и значком "телефон"?
В main.css в строчке
#header #support .sup_phone{display:block;width:36px;height:36px;background-color:#333333;-webkit-border-radius: 50%;-moz-border-radius: 50%;-khtml-border-radius: 50%;border-radius: 50%;-ms-border-radius: 50%;transition: all 0.5s ease 0s;-webkit-transition: all 0.5s ease 0s;-ms-transition: all 0.5s ease 0s;-moz-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;background: url('http://o20829.storeland.net/phone_circle.png') center center no-repeat;background-color:#333333;position:absolute;top:0px;right:0;}/* телефон */
измените значение последнего параметра (
right:0;
на
right:40px;
Можете изменить "40" на приемлемое для вас значение.

Цитата

3. Как изменить цвет слов в верхнем блоке категорий: Главная>>Каталог>> и пр...?
В main.css:
.breadcrumb {color: #777777;margin-bottom: 5px;font-size:10px;}
отвечает за цвет каталога, на котором сейчас находится пользователь, а
.breadcrumb a {color: #999999;font-size:10px;}
- за вид каталогов, на которые можно кликнуть.
То есть например если вы находитесь в каталоге "Футболки", то надпись "Футболки" будет задана первым цветом, а надписи "Главная" и "Каталог" - вторым.

Цитата

4. Как удалить выдачу (товаров в категории) в верхнем блоке?
Из шаблона HTML замените строку:
{% ELSEIF MOD_LNAME=catalog %}
				 {% IF IS_FULL_CATALOG %}Каталог ({GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории){% ELSE %}{CATEGORY_NAME} ({GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории){% ENDIF %}
строкой:
{% ELSEIF MOD_LNAME=catalog %}
				 {% IF IS_FULL_CATALOG %}Каталог ({GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории){% ELSE %}{CATEGORY_NAME}{% ENDIF %}

Цитата

5. Как удалить полосу под товарами?
В main.css найдите строчку:
.product-list, .product-list2, .product-list3, .product-list4 {padding: 10px;margin-bottom:15px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;border-bottom:4px solid #e1e1e1;box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);*border: solid 1px #e1e1e1;border: solid 1px #e1e1e1\0/;float: left;width: 100%;box-sizing: border-box;
и замените её на:
.product-list, .product-list2, .product-list3, .product-list4 {padding: 10px;margin-bottom:15px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);*border: solid 1px #e1e1e1;border: solid 1px #e1e1e1\0/;float: left;width: 100%;box-sizing: border-box;}


#19 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 29 Апрель 2014 - 13:49

Добрый день! Подскажите...

1. Верхнее меню перестало быть кликабельным, после передвижения его вправо и чуть поднял вверх...как это исправить, чтобы работало?
2. Где изменить цвет верхнего меню (фона) при наведении...оно сейчас белое...
3. Как поставить рамки (бордюры) своего цвета на фото товаров в категориях ,новинках, с этим товаром смотрят и пр.
4. Где изменить шрифт (размер и цвет): в левом каталоге
5. Где изменить шрифт : название товара (под фото) и в блоке "вы смотрели" - на свой шрифт (impact)...

#20 Alex777

Alex777

    Пользователь

  • Пользователи
  • PipPip
  • 27 сообщений

Отправлено 29 Апрель 2014 - 14:14

Просмотр сообщенияDars (24 Апрель 2014 - 19:46) писал:

Код на цвет в main.css, строка
a:hover{ text-decoration:underline; color:#ff0551; }
Меняете ff0551 на нужный вам цвет.
Код на перемещение:
#header .links {padding-right: 10px;float:left;margin-left:30px;clear: both;}
Если не справитесь сами, то пришлите скриншот, где будет указано желаемое вами расположение.

В main.css в строчке
#header #support .sup_phone{display:block;width:36px;height:36px;background-color:#333333;-webkit-border-radius: 50%;-moz-border-radius: 50%;-khtml-border-radius: 50%;border-radius: 50%;-ms-border-radius: 50%;transition: all 0.5s ease 0s;-webkit-transition: all 0.5s ease 0s;-ms-transition: all 0.5s ease 0s;-moz-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;background: url('http://o20829.storeland.net/phone_circle.png') center center no-repeat;background-color:#333333;position:absolute;top:0px;right:0;}/* телефон */
измените значение последнего параметра (
right:0;
на
right:40px;
Можете изменить "40" на приемлемое для вас значение.

В main.css:
.breadcrumb {color: #777777;margin-bottom: 5px;font-size:10px;}
отвечает за цвет каталога, на котором сейчас находится пользователь, а
.breadcrumb a {color: #999999;font-size:10px;}
- за вид каталогов, на которые можно кликнуть.
То есть например если вы находитесь в каталоге "Футболки", то надпись "Футболки" будет задана первым цветом, а надписи "Главная" и "Каталог" - вторым.

Из шаблона HTML замените строку:
{% ELSEIF MOD_LNAME=catalog %}
				 {% IF IS_FULL_CATALOG %}Каталог ({GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории){% ELSE %}{CATEGORY_NAME} ({GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории){% ENDIF %}
строкой:
{% ELSEIF MOD_LNAME=catalog %}
				 {% IF IS_FULL_CATALOG %}Каталог ({GOODS_PAGES_RESULTS} товар{GOODS_PAGES_RESULTS | gen_word_end("","а","ов")} в категории){% ELSE %}{CATEGORY_NAME}{% ENDIF %}


В main.css найдите строчку:
.product-list, .product-list2, .product-list3, .product-list4 {padding: 10px;margin-bottom:15px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;border-bottom:4px solid #e1e1e1;box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);*border: solid 1px #e1e1e1;border: solid 1px #e1e1e1\0/;float: left;width: 100%;box-sizing: border-box;
и замените её на:
.product-list, .product-list2, .product-list3, .product-list4 {padding: 10px;margin-bottom:15px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);*border: solid 1px #e1e1e1;border: solid 1px #e1e1e1\0/;float: left;width: 100%;box-sizing: border-box;}

Здравствуйте! по 2 вопросу не получилось...при изменении любых параметров - значок телефона уходит влево на связь..




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных