Олег Захаров

На 7-8 году постоянной работы с MiniShop я узнал, что существует Baymard Institute — датская исследовательская компания, с 2009 года занимающаяся исключительно UX интернет-магазинов. 200,000+ часов реального тестирования с пользователями, 4,400+ модерируемых сессий, 771 гайдлайн. 71% компаний из Fortune 500 e-commerce используют их рекомендации. Фактически главный мировой источник данных о том, как должен быть устроен интернет-магазин.

Подписка у них платная ($500), но в блоге и открытых статьях достаточно материала, чтобы переосмыслить многие привычные решения. Я собрал самое интересное — то, что применимо к нашим проектам на MODX.

Коллеги, всех приветствую!
Вопрос возник.
У меня лично несколько сайтов на 2-й версии.
Несколько раз пробовал сделать сайт на 3-й версии, постоянно возникали проблемы и сложности с компонентами отсутствием замен на со 2-й версии на 3-ю.
У меня лично есть несколько сайтов на 2-м движке и очень большим объемом проделанной работы, что нет никакого желания тратить время на переезд на 3-ю версию.
И вот тут было бы классно если бы была рабочая инструкция по миграции с 2-й версии на 3-ю. Но кто ее будет делать большой вопрос. Был бы полезен опыт коллег по цеху, прошу поделиться кто как переносил и с какими проблемами столкнулся.

Компонент для управления вариантами товаров в MiniShop3. Позволяет создавать товары с различными комбинациями опций (цвет, размер и др.), каждая из которых имеет собственную цену, остатки и изображение.

Задача: Вывести в ресурсе SEO-карточки из других ресурсов.
Пример:

Приветствую! В этом видео я хочу поделиться с вами способом упрощения работы с Modx Revolution, а именно — о том, как подключить Laravel Facade.

Многие разработчики сталкиваются с определенными сложностями при работе с Modx в Ide, и я не исключение. В поисках способов оптимизации процесса я обратил внимание на Laravel Facade — мощный инструмент, который может значительно упростить и ускорить разработку.

Делюсь наработкой, на которую потратил несколько часов пока бился над решением проблемы. Может кому пригодится, да и для себя чтобы не забыть (пока память свежа изложить полученные знания в шпаргалку).
Понадобилось реализовать поведение карты чтобы при наведении на метку к метке справа добавлялся свой блок с содержимым (так называемый iconContentLayout). Пример:

Не нашел нигде как сделать так. В официальной документации было только примеры изменения иконки метки через замену iconImageHref

Всем привет!

Сейчас становится всё более актуально создавать сайты не только адаптивными под разные устройства, но также и с акцентом на использование в разное время суток — то есть с возможностью переключения светлой и тёмной темы.

Обратил внимание, что у многих на мобильных устройствах включена тёмная тема на постоянной основе и все приложения открываются в соответствии с системной темой. В данной статье я расскажу, как сделать сайт удобным при любом из сценариев использования тёмной темы на устройствах пользователя.

Понадобилось сделать меню для сайта с выбором языка. В стандартной документации везде подставляют иконки языка, без текста названия языка.
Я нигде не нашел как можно вытащить название языка (локализации) и указать его в меню выбора языков справа от иконки языка. А оказалось все просто.
В сниппете getLanguages можно было просто добавить еще один плейсхолдер 'languageName'=> $language->name (к имеющимся cultureKey, active и url).

foreach($languages as $language) {
  if(mb_substr($language->http_host, -1) == '/') {
    $placeholders = array(
      'cultureKey' => $language->key,
      'active' => $language->key == $modx->localizator_key ? 'active' : '',
      'url' => $protocol . $language->http_host . $uri,
      'languageName'=> $language->name,
    );
  } else {
    $placeholders = array(
      'cultureKey' => $language->key,
      'active' => $language->key == $modx->localizator_key ? 'active' : '',
      'url' => $protocol . $language->http_host . '/' . $uri,
      'languageName'=> $language->name,
    );
  }

И в чанках просто добавить {$languageName}
section-langs-1:

<a href="#" class="nav-link dropdown-toggle {if $_modx->config.cultureKey == $cultureKey} {$active} {else} collapse {/if}  localizator_lang" data-bs-toggle="dropdown"  role="button" aria-expanded="false" >
<span class="{$cultureKey}_24" style="display: inline-block;"></span>
 {$languageName}
 </a>

section-langs-2:

{if $_modx->config.cultureKey != $cultureKey}
<li >
  {if $active != 'active'}
    <a class="{$active} localizator_lang" href="{$url}" class="dropdown-item">
        <span class="{$cultureKey}_24" style="display: inline-block;"></span> 
        {$languageName}
    </a>
  {else}
    <div class="{$active} {$cultureKey}_24 localizator_lang" class="dropdown-item">
        <span class="{$cultureKey}_24" style="display: inline-block;"></span> 
        {$languageName}
    </div>
  {/if}
</li>
{/if}

Решил перейти на реактивные UI фреймворки и сделал заготовку для более удобной разработки с ними, с MODX и с gtsAPI — компонент API для MODX
У нас на MODX много функционала и сразу перейти на какой-то JS фреймворк нельзя. Как и задумывалось заготовка реализует какой-то смешанный режим разработки между стандартным для Vue путем и путем компонентов MODX.
В заготовке сделан GRUD таблицы базы данных MODX. На основе PrimeVue

Так как у нас нет дизайнера, и на каждый чих искать дизайнера-фрилансера нет желания, возникает проблема обернуть функционал нашего сайта в красивую обертку. Изучать глубоко верстку нет желания и времени. Гораздо проще воспользоваться каким-то UI фреймворком. Тем более многие нужные блоки в них уже хорошо реализованны.
Современные UI фреймворки, такие как Quasar и PrimeVue, общаются с сайтом посредством какого-либо API. Дефолтная реализация API в MODX меня не устроила и я сейчас пишу свою реализацию API для MODX — gtsAPI.
Основная фишка gtsAPI — это то что для большинства нужных операций с таблицами базы данных нужно только настроить правила. А все остальное берет на себя компонент. То есть, нам не нужно для 200 таблиц нашей базы данных писать отдельные контроллеры :-). Сделал c некоторой поддержкой RestAPI.