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


Изменение Для Мобильной Версии При Нажатии На Раздел Каталога


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

#1 Nicolas

Nicolas

    Продвинутый пользователь

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

Отправлено 04 Апрель 2019 - 13:51

Добрый день! Сейчас при нажатии на раздел каталога в мобильной версии данные загружаются, но пользователь этого не видит, потому как остается на том же "экране" (см.первый скрин) и нужно догадаться, чтобы проскроллить вниз, где у же будут загруженные подкатегории, товары и т.д. Это очень неудобно и убивает конверсию.

Подскажите, пожалуйста, как в мобильной(!) версии сделать так, чтобы при нажатии на категорию пользователя автоматически скроллило вниз к "Фильтры", "Вы смотрели" и названию раздела. (см. второй скрин)

Надеюсь, объяснил понятно. Спасибо!

P.S. дополнительно, подскажите, можно ли в мобильной(!) версии убрать отображение подкатегорий в виде фото с надписью под ними. Т.е. чтобы текстовые подкатегории (например кожаные рюкзакаи - женские кожаные рюкзака) оставались в дереве каталога, а так сразу шел бы переход к товарам и фильтрам.

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

  • Купить кожаный рюкзак в интернет магазине King-store.ru - Google Chrome 2019-04-04 13.46.15.jpg
  • Купить кожаный рюкзак в интернет магазине King-store.ru - Google Chrome 2019-04-04 13.47.22.jpg


#2 Vaccina

Vaccina

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

  • Модераторы
  • 23 691 сообщений

Отправлено 05 Апрель 2019 - 02:54

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
			<!-- Каталог -->
			<div class="header-catalog col-lg-2 col-md-3 col-xs-12">
			  <span class="header-catalogBtn unselectable"><span class="header-catalogIcon fal fa-bars"></span><span>Каталог товаров</span></span>
			  <ul class="header-catalogMenu unstyled">
					<li class="header-catalogMenuTitle">
					  <a href="/catalog">Каталог</a>
					  <button class="header-closeBtn"><i class="fal fa-times"></i></button>
					</li>
					{% IFNOT catalog_full_empty %}
					  {% FOR catalog_full %}
						{% IF catalog_full.FIRST %}
						  {% IFNOT catalog_full.LEVEL = 0 %}
						  <ul class="sub{% IF catalog_full.LEVEL = 1 %} header-subcatalog{% ENDIF %}{% IF catalog_full.LEVEL = 2 %} header-subcatalog-third{% ENDIF %}{% IF catalog_full.LEVEL > 3 %} hide{% ENDIF %}">
						  {% ENDIF %}
						{% ENDIF %}
						<li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.LEVEL = 0 %}header-catalogItem {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogCol {% ENDIF %}{% IF catalog_full.LEVEL = 2 %}header-subcatalogItem {% ENDIF %}{% IF catalog_full.ISSET_VISIBLE_SUB %} parent{% ENDIF %}{% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %} active{% ENDIF %}">
							  <a href="{catalog_full.URL}" class="{% IF catalog_full.LEVEL = 0 %}header-catalogLink {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogTitle {% ENDIF %}{% IF catalog_full.LEVEL >= 2 %}header-subcatalogLink {% ENDIF %}{% IF catalog_full.CURRENT %} active{% ENDIF %}" title="{catalog_full.NAME}" itemprop="url">
								{catalog_full.NAME}
								{% IF catalog_full.ISSET_VISIBLE_SUB &&  catalog_full.LEVEL = 0 %}<span class="header-arrow header-catalogArrow fal fa-angle-down {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
								{% IF catalog_full.ISSET_VISIBLE_SUB &&  catalog_full.LEVEL != 0 %}<span class="header-arrow header-secondArrow  fal fa-caret-right {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
							  </a>
  
замените на:
			<!-- Каталог -->
			<div class="header-catalog col-lg-2 col-md-3 col-xs-12">
			  <span class="header-catalogBtn unselectable"><span class="header-catalogIcon fal fa-bars"></span><span>Каталог товаров</span></span>
			  <ul class="header-catalogMenu unstyled">
					<li class="header-catalogMenuTitle">
					  <a href="/catalog">Каталог</a>
					  <button class="header-closeBtn"><i class="fal fa-times"></i></button>
					</li>
					{% IFNOT catalog_full_empty %}
					  {% FOR catalog_full %}
						{% IF catalog_full.FIRST %}
						  {% IFNOT catalog_full.LEVEL = 0 %}
						  <ul class="sub{% IF catalog_full.LEVEL = 1 %} header-subcatalog{% ENDIF %}{% IF catalog_full.LEVEL = 2 %} header-subcatalog-third{% ENDIF %}{% IF catalog_full.LEVEL > 3 %} hide{% ENDIF %}">
						  {% ENDIF %}
						{% ENDIF %}
						<li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.LEVEL = 0 %}header-catalogItem {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogCol {% ENDIF %}{% IF catalog_full.LEVEL = 2 %}header-subcatalogItem {% ENDIF %}{% IF catalog_full.ISSET_VISIBLE_SUB %} parent{% ENDIF %}{% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %} active{% ENDIF %}">
							  <a href="{catalog_full.URL}#page-title" class="{% IF catalog_full.LEVEL = 0 %}header-catalogLink {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogTitle {% ENDIF %}{% IF catalog_full.LEVEL >= 2 %}header-subcatalogLink {% ENDIF %}{% IF catalog_full.CURRENT %} active{% ENDIF %}" title="{catalog_full.NAME}" itemprop="url">
								{catalog_full.NAME}
								{% IF catalog_full.ISSET_VISIBLE_SUB &&  catalog_full.LEVEL = 0 %}<span class="header-arrow header-catalogArrow fal fa-angle-down {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
								{% IF catalog_full.ISSET_VISIBLE_SUB &&  catalog_full.LEVEL != 0 %}<span class="header-arrow header-secondArrow  fal fa-caret-right {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
							  </a>
  
Далее зайдите в шаблон main.css - найдите:
@media all and (max-width: 991px) {

замените на:
@media all and (max-width: 991px) {
.categories {display:none;}


#3 Nicolas

Nicolas

    Продвинутый пользователь

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

Отправлено 05 Апрель 2019 - 11:59

Просмотр сообщенияVaccina (05 Апрель 2019 - 02:54) писал:

Здравствуйте.

Зайдите в раздел Сайт - Редактор шаблонов - HTML - найдите:
		 <!-- Каталог -->
		 <div class="header-catalog col-lg-2 col-md-3 col-xs-12">
			 <span class="header-catalogBtn unselectable"><span class="header-catalogIcon fal fa-bars"></span><span>Каталог товаров</span></span>
			 <ul class="header-catalogMenu unstyled">
				 <li class="header-catalogMenuTitle">
					 <a href="/catalog">Каталог</a>
					 <button class="header-closeBtn"><i class="fal fa-times"></i></button>
				 </li>
				 {% IFNOT catalog_full_empty %}
					 {% FOR catalog_full %}
					 {% IF catalog_full.FIRST %}
						 {% IFNOT catalog_full.LEVEL = 0 %}
						 <ul class="sub{% IF catalog_full.LEVEL = 1 %} header-subcatalog{% ENDIF %}{% IF catalog_full.LEVEL = 2 %} header-subcatalog-third{% ENDIF %}{% IF catalog_full.LEVEL > 3 %} hide{% ENDIF %}">
						 {% ENDIF %}
					 {% ENDIF %}
					 <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.LEVEL = 0 %}header-catalogItem {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogCol {% ENDIF %}{% IF catalog_full.LEVEL = 2 %}header-subcatalogItem {% ENDIF %}{% IF catalog_full.ISSET_VISIBLE_SUB %} parent{% ENDIF %}{% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %} active{% ENDIF %}">
							 <a href="{catalog_full.URL}" class="{% IF catalog_full.LEVEL = 0 %}header-catalogLink {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogTitle {% ENDIF %}{% IF catalog_full.LEVEL >= 2 %}header-subcatalogLink {% ENDIF %}{% IF catalog_full.CURRENT %} active{% ENDIF %}" title="{catalog_full.NAME}" itemprop="url">
							 {catalog_full.NAME}
							 {% IF catalog_full.ISSET_VISIBLE_SUB && catalog_full.LEVEL = 0 %}<span class="header-arrow header-catalogArrow fal fa-angle-down {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
							 {% IF catalog_full.ISSET_VISIBLE_SUB && catalog_full.LEVEL != 0 %}<span class="header-arrow header-secondArrow fal fa-caret-right {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
							 </a>
  
замените на:
		 <!-- Каталог -->
		 <div class="header-catalog col-lg-2 col-md-3 col-xs-12">
			 <span class="header-catalogBtn unselectable"><span class="header-catalogIcon fal fa-bars"></span><span>Каталог товаров</span></span>
			 <ul class="header-catalogMenu unstyled">
				 <li class="header-catalogMenuTitle">
					 <a href="/catalog">Каталог</a>
					 <button class="header-closeBtn"><i class="fal fa-times"></i></button>
				 </li>
				 {% IFNOT catalog_full_empty %}
					 {% FOR catalog_full %}
					 {% IF catalog_full.FIRST %}
						 {% IFNOT catalog_full.LEVEL = 0 %}
						 <ul class="sub{% IF catalog_full.LEVEL = 1 %} header-subcatalog{% ENDIF %}{% IF catalog_full.LEVEL = 2 %} header-subcatalog-third{% ENDIF %}{% IF catalog_full.LEVEL > 3 %} hide{% ENDIF %}">
						 {% ENDIF %}
					 {% ENDIF %}
					 <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.LEVEL = 0 %}header-catalogItem {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogCol {% ENDIF %}{% IF catalog_full.LEVEL = 2 %}header-subcatalogItem {% ENDIF %}{% IF catalog_full.ISSET_VISIBLE_SUB %} parent{% ENDIF %}{% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %} active{% ENDIF %}">
							 <a href="{catalog_full.URL}#page-title" class="{% IF catalog_full.LEVEL = 0 %}header-catalogLink {% ENDIF %}{% IF catalog_full.LEVEL = 1 %}header-subcatalogTitle {% ENDIF %}{% IF catalog_full.LEVEL >= 2 %}header-subcatalogLink {% ENDIF %}{% IF catalog_full.CURRENT %} active{% ENDIF %}" title="{catalog_full.NAME}" itemprop="url">
							 {catalog_full.NAME}
							 {% IF catalog_full.ISSET_VISIBLE_SUB && catalog_full.LEVEL = 0 %}<span class="header-arrow header-catalogArrow fal fa-angle-down {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
							 {% IF catalog_full.ISSET_VISIBLE_SUB && catalog_full.LEVEL != 0 %}<span class="header-arrow header-secondArrow fal fa-caret-right {% IF catalog_full.CURRENT_PARENT || catalog_full.CURRENT %}active{% ENDIF %}"></span>{% ENDIF %}
							 </a>
  
Далее зайдите в шаблон main.css - найдите:
@media all and (max-width: 991px) {

замените на:
@media all and (max-width: 991px) {
.categories {display:none;}

Внес изменения. Ничего не изменилось. Так же остается "на месте" при клике на категорию и так же показываются подкатегории с картинками

#4 Ирина345

Ирина345

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

  • Модераторы
  • 5 673 сообщений

Отправлено 05 Апрель 2019 - 13:16

Просмотр сообщенияNicolas (05 Апрель 2019 - 11:59) писал:

Внес изменения. Ничего не изменилось. Так же остается "на месте" при клике на категорию и так же показываются подкатегории с картинками
Здравствуйте, найдите в шаблоне hTML код
  {% IFNOT catalog_full_empty %}
			  <div class="block catalog">
				<h3 class="title"><a href="{CATALOG_URL}"><span class="text">Каталог</span></a></h3>
				<div class="content">
				  <ul>
					{% FOR catalog_full %}
					  {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %}
					  <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_VISIBLE_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}" title="{catalog_full.NAME}">
						<a href="{catalog_full.URL}" {% IF catalog_full.CURRENT %}class="active"{% ENDIF %}>
			

замените на
  {% IFNOT catalog_full_empty %}
			  <div class="block catalog">
				<h3 class="title"><a href="{CATALOG_URL}"><span class="text">Каталог</span></a></h3>
				<div class="content">
				  <ul>
					{% FOR catalog_full %}
					  {% IF catalog_full.FIRST %}{% IFNOT catalog_full.LEVEL = 0 %}<ul class="sub">{% ENDIF %}{% ENDIF %}
					  <li {% IF catalog_full.HIDE %}style="display:none;"{% ENDIF %} class="{% IF catalog_full.ISSET_VISIBLE_SUB %}parent{% ENDIF %} {% IF catalog_full.LEVEL = 0 %}subhead{% ENDIF %} {% IF catalog_full.CURRENT || catalog_full.CURRENT_PARENT %}active{% ENDIF %}" title="{catalog_full.NAME}">
						<a href="{catalog_full.URL}#page-title" {% IF catalog_full.CURRENT %}class="active"{% ENDIF %}>
			





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

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