Сообщений в теме: 3

[James Bond]

Доброго времени суток!
Буду очень признателен если поможете внести изменения в мобильной версии. Итак, по-порядку.
На первом фото:
1) Убрать стандартные кнопки вверху экрана с людьми и якорем. Вместо них на всю ширину сделать кнопку "Главное меню" с выпадающим главным меню.
2) Выровнять телефон как на фото и сделать его кликабельным на смартфонах.
3) Под телефоном разместить форму поиска.
4) Удалить иконку поиска с панели.
5) Сделать пункты выпадающего главного меню и каталога больше по высоте, а то очень узкие.

6) Возможно ли сделать как на втором фото, чтобы товары и категории показывались по 2 шт в ряду?

7) В личном кабинете в избранных товарах нужно сделать пошире столбец "Действие", чтобы кнопка "В корзину" не переносилась (фото 3).

8) Убрать совсем поле (фото 4), которое появляется при наведении курсора на плитку товара на главной как в мобильной так и в полной версии сайта.

И последний вопрос. Можно ли реализовать скачивание небольшого файла с сайта?

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

• 
• 
• 
• 

[Vaccina]

1. В шаблоне main.css найдите:

#header-top .topheader-left {width: 36px;height: 36px;position: relative;border-right: 1px solid #e9e9e9;border-left: 1px solid #e9e9e9;}
#header-top .topheader-left:before {font-family: FontAwesome;width: 100%;height: 100%;cursor: pointer;content: "\f0c0";position: absolute;font-size: 16px;left: 8px;top: 0px;}
#header-top .topheader-left ul.contact-us-now {position: absolute;top: 35px;left: -1px;width: 200px;border: 1px solid #e9e9e9;background: #FFF;opacity: 0;filter: alpha(opacity=0);-webkit-transform: scale(0);-moz-transform: scale(0);-o-transform: scale(0);transform: scale(0);}
#header-top .topheader-left:hover ul.contact-us-now {opacity: 1;filter: alpha(opacity=100);-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);transform: scale(1);}
#header-top .topheader-left ul.contact-us-now li {display: block;margin: 0 10px;border-top: 1px solid #e9e9e9;float: none;}
#header-top .topheader-left ul.contact-us-now li:first-child {border-top: none;margin-left: 10px;}
#header-top .topheader-right {width: 80%;float: right;}

замените на:

#header-top .topheader-left {display:none;}
#header-top .topheader-right {width: 100%;float: right;}
#header-top .topheader-right .inner {
  float: none;
}
#header-top .topheader-right .sns-quickaccess {
  height: auto;
  position: relative;
  text-align: center;
  width: 100%;
}
#header-top .topheader-right .sns-quickaccess:before {
  color: #414a4c;
  content: "Главное меню";
  cursor: pointer;
  font-family: FontAwesome;
  font-size: 16px;
  left: 0;
  padding: 0 10px;
  position: relative;
  top: 0;
  z-index: 1;
}
#header-top .topheader-right .sns-quickaccess ul.links {
  left: 0;
  width: 100%;
}

2. Ниже после изменений из первого пункта пропишите:

.topheader-phone.col-xs-9 {
  width: 100%;
}
.topheader-phone ul.contact-us-now {
  float: none;
  margin: 10px auto;
  padding-left: 0;
  text-align: center;
  width: 100%;
}

Кликабельность прописывается в структуре, поэтому будет работать на всех разрешениях, в шаблоне HTML найдите:

<ul class="contact-us-now">
				{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<img src="{ASSETS_IMAGES_PATH}ico_phone.png" style="padding-bottom:5px;"> {SETTINGS_STORE_PHONE_COUNTRY_CODE1}&nbsp;({SETTINGS_STORE_PHONE_CITY_CODE1})&nbsp;{SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
			  </ul>

замените на:

<ul class="contact-us-now">
				{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<a href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{SETTINGS_STORE_PHONE_CITY_CODE1}{SETTINGS_STORE_PHONE_NUMBER1}"><img src="{ASSETS_IMAGES_PATH}ico_phone.png" style="padding-bottom:5px;"> {SETTINGS_STORE_PHONE_COUNTRY_CODE1}&nbsp;({SETTINGS_STORE_PHONE_CITY_CODE1})&nbsp;{SETTINGS_STORE_PHONE_NUMBER1}</a></li>{% ENDIF %}
			  </ul>

3-4. В main.css также как и выше после добавленного кода вставьте:

.header-right.col-xs-9 {
  height: auto;
  margin: 0 auto;
  position: relative;
  width: 100%;
}
#header .header-right .header-right-inner {
  float: none;
  height: auto;
}
#header .header-right #search_mini_form {
  display: block;
  float: none;
  margin: 0 auto;
  text-align: center;
}
.form-search {
  margin: 0 auto;
  position: relative;
  width: 180px;
}
#menu .nav-right .block-search {
  display: none;
}

5. В main.css найдите:

#mommenu .mainnav .accr_header {
  border-bottom: 1px solid #393939;
  padding: 3px 0;
}

замените на:

#mommenu .mainnav .accr_header {
  border-bottom: 1px solid #393939;
  padding: 8px 0;
}

6. Для этого попробуйте в шаблоне Товары и HTML изменить класс у товаров, вместо:

item item-animate show-addtocart col-xs-3 col-lg-4 col-md-6 col-sm-12

используйте:

item item-animate show-addtocart col-xs-3 col-lg-4 col-md-6 col-sm-6

7.В main.css добавьте:

.col-xs-9.col-md-12.account .table-box tr td:last-child {
  min-width: 150px;
}

8.В main.css найдите и удалите:

.products-grid .item:hover .item-inner .item-img .item-box-hover {
  bottom: 0;
  left: 0;
  opacity: 1;
  visibility: visible;
}

9. Для этого в описании страницы\товара вставьте текст или кнопку с надписью и оберните его в ссылочный тег с указанием на файл, пример:

<p><a href="ссылка на файл" download>Скачать файл</a>

[James Bond]

Огромнейшее спасибо!!! Почти все получилось. Осталось правильно разместить поле поиска. Нужно чтобы оно находилось под номером телефона по центру.

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

• 

[Vaccina]

В main.css найдите:

#header .header-right #search_mini_form {
display: block;
float: none;
margin: 0 auto;
text-align: center;
}

замените на:

#header .header-right #search_mini_form {
display: block;
float: none !important;
margin: 0 auto !important;
text-align: center;
}
.header-right.col-xs-9 {
clear: both;
height: auto !important;
margin: 0 !important;
position: relative !important;
}