Как показать часть содержимого сайта только для мобильных устройств

Создание сайта »

Для определения смартфонов в Вебасисте используется программный метод $wa->isMobile(), который можно использовать в HTML-коде страниц и шаблонов темы дизайна, чтобы показывать разное содержимое на разных устройствах.

Пример использования:

{if $wa->isMobile()}
    текст для смартфонов
{else}
    текст для компьютеров
{/if}

Если нужно показывать какой-то фрагмент только на смартфонах, а на остальных устройствах ничего не показывать:

{if $wa->isMobile()}
    текст для смартфонов
{/if}

Если нужно показывать фрагмент только на остальных устройствах и ничего не показывать на смартфонах:

{if !$wa->isMobile()}
    текст для компьютеров, не для смартфонов
{/if}

4 комментария

+1

chikurov-seo Эксперт Разработчик 2 февраля 2023 16:35 #
В статье неточность.
Для определения мобильных устройств (смартфонов, планшетов) в Вебасисте используется программный метод $wa->isMobile()
{$wa->isMobile()} для планшетов возвращает false. А значит: метод $wa->isMobile() позволяет определять только мобильные устройства (смартфоны, ~~планшеты~~).

Если нужно проверить смартфоны и планшеты можно попробовать так:
```
{$isMobileOrTabletDevice = ($wa->isMobile() || $wa->userAgent('device'))}
{if $isMobileOrTabletDevice}
   смартфон или планшет
{else}
   ПК
{/if}
```
ответить
- +1
  
  Михаил Ушенин 2 февраля 2023 17:25 #
  
  Исправили текст статьи. Спасибо!
  
  ответить
- +1
  
  chikurov-seo Эксперт Разработчик 2 февраля 2023 17:58 #
  
  {$isMobileOrTabletDevice = ($wa->isMobile() || $wa->userAgent('device'))}
  Не-а, так к сожалению не работает.
  {$wa->userAgent('device')} в эмуляторе iPad в Google Chrome возвращает 'ipad', а на реальном iPad-е возвращает null.
  
  ответить
+2

chikurov-seo Эксперт Разработчик 2 февраля 2023 18:26 #

Немного углубился.

В общем, для тех кто попал сюда с вопросом "Как проверить на Webasyst использует ли пользователь мобильное устройство или планшет" - используйте код который я дал в первом комментарии. Будет работать для всех мобильных устройств и для всех планшетов кроме iPad iOS 13+ и это не проблема фреймворка Webasyst - а проблема Apple: айпады на iOS 13+ с дефолтными настройками планшета (дефолтные настройки у +-99% пользователей iPad-а ) в User-Agent не указывают что устройство является iPad-ом. И похоже что Apple на это наплевать: https://developer.apple.com/fo... (теме 3 года).

ответить