Сайтостроение
Кейс: как мы настраивали маркировку чеков по системе «Честный ЗНАК». Интеграция онлайн-касс с сайтами на Drupal
По закону №54-ФЗ «О применении контрольно-кассовой техники», владелец интернет-магазина обязан интегрировать свой сайт с онлайн-кассой. Это нужно для соблюдения требований законодательства: отправлять в налоговую инспекцию электронные версии чеков, передавать фискальные данные и т.д.
Помимо обязательных данных, прописанных в законе, с 2018 года некоторых предпринимателей коснулось нововведение: «Честный ЗНАК» — система маркировка товаров, которая пока охватывает только несколько категорий, но в ближайшем будущем будет обязательной для всех российских производств. Эта маркировка должна быть нанесена на товар, а информация о ней содержаться в чеке полного расчёта.
В этой статье мы расскажем о нашем Drupal-модуле для онлайн-касс и о том, как мы модифицировали его для маркировки чеков по системе «Честный знак» для нашего клиента.
Drupal-модуль от Initlab для генерации чековНаш разработчик Геворг Мкртчян создал контрибный модуль для выполнения требований ФЗ-54. Контрибный означает, что его можно скачать с drupal.org, он поддерживается сообществом Drupal-разработчиков. Если вы программист, можете скачать его бета-версию по ссылке.
Важное уточнение: эта версия модуля не включает передачу маркировки «Честного ЗНАКА», о которой мы пишем ниже. Решение написано под бизнес-процессы конкретного клиента, делиться им в публичном доступе мы пока не планируем. Однако базовая версия прекрасно подойдёт для работы с Бизнес.Ру.
Этот модуль позволяет интегрировать сайт на Drupal с сервисом «Онлайн-чеки» от Бизнес.Ру — это облачный сервис для автоматизации бизнеса, который поддерживает интеграцию со многими популярными платформами интернет-магазинов и осуществляет полную поддержку онлайн-касс (54-ФЗ) и ЕГАИС.
Наш модуль генерирует чек, сохраняет его копию в базе данных сайта и направляет его со всеми необходимыми данными в онлайн-кассу Бизнес.Ру. Этот модуль и был подключен на сайте нашего клиента RASTL — интернет-магазина постельного белья и ивановского текстиля.
Здесь может возникнуть резонный вопрос: почему бы не воспользоваться готовым сервисом генерации чеков, например, в составе процессинга платежей Сбербанка? У решения использовать отдельный сервис для оплаты чеков три причины:
1) для удобства клиентов, на сайте задействовано несколько методов платежей, а не только процессинг Сбербанка, поэтому пришлось бы писать отдельные решения под каждую платёжную систему, что крайне затратно;
2) на момент внедрения онлайн-кассы возможности работы с чеками у процессинга Сбербанка были ограничены, а Бизнес.Ру был одним из лидеров в этой сфере, с хорошей клиентской поддержкой и условиями;
3) у клиента на сайте своя логика продаж, скидок и промокодов, поэтому оптимально было использовать именно отдельный сервис.
Наш модуль — это универсальный способ учесть все требования законодательства и не сломать сложную систему внутренней логики продаж. Например, в процессе формирования чека учитывается алгоритм применения скидок. При этом в модуле можно прописать применение промокодов, стоимость доставки и любые другие опции по заказам.
Мы кратко опишем этапы покупки без сложных технических подробностей. Это нужно для понимания роли нашего модуля в процессе продаж и как в дальнейшем он был доработан:
1) человек оплачивает покупку на сайте любым удобным способом;
2) наш модуль формирует чек о предоплате, сохраняет его на сервере сайта и отправляет на Бизнес.ру;
3) Бизнес.Ру направляет сформированный электронный чек в ОФД (оператор фискальных данных) и в онлайн-кассу интернет-магазина;
4) ОФД направляет чек покупателю и передаёт данные о продаже в ФНС.
Покупка совершена, требования законодательства выполнены. С модулем у нашего клиента не было никаких проблем до появления системы «Честный ЗНАК». Его было необходимо доработать, потому что на предпоследнем шаге чек стало нужно наполнять новой информацией и отправлять в новое место, но обо всём по порядку.
«Честный ЗНАК»В 2018 году в нашей стране появился «Честный ЗНАК» — национальная система маркировки кодами Data Matrix. Она помогает отследить путь товара от производителя к покупателю и призвана бороться с незаконным оборотом продукции, некачественными товарами и недобросовестными производителями.
Уже с января 2021 коды Data Matrix наносят на табачные, меховые изделия, обувь, лекарственные препараты и др. Если вы предприниматель и вашей продукции пока что не коснулся ЧЗ, вам всё равно нужно морально к этому приготовиться: к 2024 году планируется сделать маркировку обязательной для всех без исключения товаров на российском рынке.
Каждому подлежащему маркировке товару присваивается уникальный код Data Matrix. Он должен быть нанесён на продукцию физически в виде наклейки, а информация о нём должна быть передана в систему «Честный ЗНАК» (дальше мы будем сокращать её как ЧЗ). Каждый код можно проверить в системе ЧЗ, где будет отражена подробная информация о товаре.
Кейс клиентаИтак, товары интернет-магазина RASTL стали подлежать маркировке ЧЗ. То сеть теперь нашему клиенту нужно отправлять в Бизнес.Ру не только чек о предоплате, но и чек с информацией о маркировке. Давайте разбираться в этапах формирования, нанесения и передачи маркировки Data Matrix.
Как проходит маркировка товаровКод маркировки формируется сразу после его изготовления и ввода в оборот. Производитель продукции «заказывает» коды для товаров у системы ЧЗ и наносит их на товар:
1) в системе ЧЗ создаётся карточка товара, задаётся количество изготовленных единиц и после формируются уникальные коды маркировок для всей партии;
2) отсюда коды выводятся в печать на нужный носитель;
3) маркировка наносится на товары.
Затем производитель отправляет товар продавцу, в нашем случае интернет-магазину. В его CRM заносится количество единиц полученного товара и коды соответствующих им маркировок.
При подготовке оплаченного заказа к отправке, маркировка отобранных товаров должна сканироваться и передаваться вместе с сопроводительной документацией в Бизнес.ру в виде второго чека — чека полного расчёта. И поскольку первый чек генерирует наш модуль, то и генерацию второго нам нужно было доверить ему.
Что не так с маркировкой чеков?По нашей первой цепочке чек с предоплатой, сформированный на сайте, попадает в ОФД, а затем в налоговую и клиенту. Но теперь мы должны отчитаться не о том, сколько денег получили от клиента, а о том, что продали то самое маркированное фабричное полотенце, а не сшили его в подвале. Налоговой и ЧЗ нужна разная информация, поэтому мы не можем упихнуть всё в один чек и прислать разом: оплачено, не контрафакт.
То есть получается, что теперь нам нужен второй чек:
1) первый чек — информация о предоплате (оплате заказа) для налоговой и покупателя, отправляется после формирования заказа;
2) второй чек — информация о маркировке для ЧЗ и покупателя, отправляется после сбора посылки.
Мы уже разобрались, как Data Matrix оказывается на товаре и как проходит оплата на сайте, теперь рассмотрим процессы, которые происходят после.
У интернет-магазина RASTL CRM собственной разработки, где содержится информация о товарных остатках и соответствующих им кодах маркировок. Именно отсюда передаются данные на сайт для дальнейшего взаимодействия с Бизнес.ру
После оплаты заказа происходит следующее:
1) чек предоплаты сформирован, отправлен в Бизнес.Ру и клиенту;
2) заказ с сайта импортируется в CRM для обработки;
3) заказ собирается и подготавливается к отправке. Как мы писали выше, на этом этапе в CRM регистрируются фактические коды маркировок для товаров, которые будут отправлены. Если сильно упростить, до момента отправки товара клиенту код «спит». Он сгенерирован, наклеен на товар и содержит информацию о нём, но нигде не отображается;
4) формируется сопроводительная документация, из CRM на сайт передаются коды маркировок;
5) модуль на сайте генерирует чек полного расчёта с информацией о маркировке товара и передаёт его в Бизнес.ру;
6) Бизнес.Ру передаёт этот чек в ОФД, ОФД отправляет его в ЧЗ и маркировка проданных товаров выводится из системы;
7) покупатель получает оба чека на электронную почту или по смс.
С этими знаниями мы приступили к апгрейду модуля, чтобы «научить» его передавать информацию о маркировке товара в Бизнес.Ру.
Суть задачи и первые трудностиКод маркировки в физическом виде — это скопление квадратиков в квадратике. Но при передаче на сайт и дальше, когда заказ собран, ЧЗ через CRM шлёт на наш модуль строку с информацией о маркировке, которую мы должны передать в Бизнес.Ру.
Конечно, хотелось бы рассказать, как мы слёту всё переделали и запустили. Но мы столкнулись с тем, что строка с информацией о маркировке ни при каких условиях не отправлялись на Бизнес.Ру. Постараемся не перегружать вас программистскими подробностями наших мытарств и сократим рассказ о поиске решения.
Перекодировка маркировки: как мы добивались правды у ЧЗ и Бизнес.РуСама маркировка состоит из кода товара и серийного номера товара. Именно в таком формате она поступает из CRM клиента в наш модуль. Мы пытались передать её в таком формате в Бизнес.Ру, но ничего не получалось — маркировка не попадала в ОФД. За эту доработку взялся наш разработчик Константин Прозоров.
Мы стали искать ответы на сайте ЧЗ, так как вся заваруха ради них. Оказалось, что две группы данных из CRM (код и номер товара) нужно было перекодировать в шестнадцатиричный формат. К такому нас жизнь готовила, поэтому мы встроили перекодировку в наш модуль. Он стал передавать данные в нужном формате, чтобы и ЧЗ, и Бизнес.Ру были нами довольны.
Первая маленькая победа: маркировка стала поступать в ОФД. Но нам сказали, что она всё равно некорректная. И поскольку мы сделали всё возможное по документации ЧЗ, дальше решили искать ответы у Бизнес.Ру. Спустя заявку на горячей линии, письмо на поддержку и ещё один звонок, нашего Константина соединили с программистом, который понимал всю тираду про байты, кодировки и прочее умное.
Выяснилось, что мы прописали слишком полную перекодировку по примеру ЧЗ. Но нигде не было сказано, что первые четыре байта дописывает Бизнес.Ру к уже преобразованной в шестнадцатиричный формат маркировке.
К слову сказать, если бы не живое общение, мы бы долго искали ответ. Например, в той же пояснительной документации Бизнес.Ру есть вот такая информация:
Но нет алгоритма формирования и никакой информации об этом «кусочке», который они подставляют сами.
В итоге всё сложилось благополучно. Модуль модифицирован, маркировка уходит куда нужно — хэппи энд.
Вместо вывода«Честный ЗНАК» — неизбежное будущее всего российского рынка. В прошлом году это были шины, в этом питьевая вода и БАДы, а в следующем — ваши товары или товары ваших клиентов. Крайне рекомендуем всем, кто так или иначе связан с онлайн-торговлей, заранее к этому подготовиться. Пока что достаточно морально и информационно, но и с апгрейдом нужного инструментария не затягивайте — если что-то можно заранее организовать или улучшить, то так и поступите.
Наша команда накопила приличный опыт в сфере автоматизации работы с чеками и маркировкой товаров для интернет-магазинов. Если у вас есть задачи по внедрению или настройке подобных технологий — обращайтесь к нам.
Проверяем PHP код на совместимость с конкретной версией PHP
Появилась задача проверить PHP код на совместимость с конкретной версией PHP.
Для этого нам понадобятся пакеты drupal/coder и phpcompatibility/php-compatibility, установим их
composer require --dev drupal/coder phpcompatibility/php-compatibility
Запустим проверку контрибных модулей проекта на совместимость с PHP 8.0
./vendor/bin/phpcs -p ./web/modules/contrib/ --standard=PHPCompatibility --extensions=module/php,inc/php,install/php,php/php --runtime-set testVersion 8.0Несколько лет назад у меня было несколько сайтов на поддержке, где был модуль submenutree. После перехода на PHP 7.2 он перестал корректно работать из-за того, что функцию each() признали устаревшей. Я сымитировал эту ситуацию сейчас и PHPCompatibility успешно отработал эту проблему.
Мы планируем повышать версии PHP для работы drupal.ru и этот инструмент нам будет помогать
Конкурс цитат про Drupal для нового сайта
Друзья!
Мы активно работаем над обновлением сайта и решили разместить хвалебные высказывания о друпале на новой главной странице.
Напишите в комментариях ваши варианты. Мы выберем пять самых крутых высказываний и разместим в блоке с высказываниями как показано на скриншоте.
Текущий прогресс работы над новой версией можно увидеть на скринкасте https://jumpshare.com/v/jZl3aQTwso8DjpB6BoAe
Ускоряем время в docker на примере docksal
Возникла задача с тестированием модуля подписок для drupal commerce. Модуль подписок должен отменять подписку при невозможности списания денег с карты подписчика. Но проблема в том, что после неудачного списания должно пройти 24 часа, прежде чем подписка будет отменена. После недели обычного тестирования я понял, что пора брать управление временем в свои руки.
Существует библиотека libfaketime, которая позволяет обманывать приложения, подсовывая им указанное вами время.
Чтобы использовать её в проекте docksal нужно:
1) Создать в папке проекта .docksal/services/cli/ файл Dockerfile
FROM docksal/cli:php7.4-3.1RUN git clone https://github.com/wolfcw/libfaketime && cd libfaketime && make && make install
после FROM нужно указать образ от которого вы будете наследоваться
2) В файл docksal.yml нужно дописать
cli:
image: ${COMPOSE_PROJECT_NAME_SAFE}_cli
build: services/cli
environment:
- LD_PRELOAD=/usr/local/lib/faketime/libfaketime.so.1
- FAKETIME=@2022-08-20 10:00:01
где в FAKETIME можно писать нужное время. Если убрать символ @ то время не будет идти, а замрет на указанном значении
3) Запускаем/перезапускаем проект fin p start и проверяем время, например вызовом
<?phpecho date("Y-m-d H:i:s");
?>
PAReview.sh - проверяем наш код на стандарты кодирования PHP и Drupal
Для проверки кода на стандарты кодирования PHP мы привыкли использовать PHPCS. Но если вы выкладываете в публичный доступ контрибные модули, то они часто состоят не только из PHP-кода, но и из JavaScript кода и CSS.
PAReview.sh - это BASH скрипт, который запускает по очереди PHPCS, eslint, prettier и выводит на экран найденные проблемы. PAReview.sh помимо обычных стандартов кодирования проверит README файл на соответствие правилам drupal.org, на наличие hook_help и тд.
С 2018 года этот проект был в стагнации, но недавно я стал его мейнтейнером, исправил проблемы в установке, обновил документацию и инструкции по установке и использованию.
У проекта так же была веб-версия, но с 2020 года она не работает. Я планирую в скором времени запустить новую веб-версию.
Отладка twig в PHPStorm и VSCode
Для отладки twig шаблонов я рассмотрю 3 способа.
У популярного модуля twig_tweak есть функция dd, которая позволяет выводить на экран значения переменных и массивов.
Пример использования: {{ dd(content) }}
Также есть функция drupal_breakpoint, которая позволяет передать в xdebug значения переменных из twig. Просто ставим точку останова в нужном шаблоне и сбрасываем кэш (если кэширование включено)
Пример использования: {{ drupal_breakpoint() }}
Модуль devel еще с 2016 года имеет функцию devel_breakpoint, которая работает как drupal_breakpoint из модуля twig_tweak.
Пример использования: {{ devel_breakpoint() }}
Модуль twig_xdebug появился в 2016 году за полгода до того, как функционал отладки twig добавили в модуль devel. Принцип работы тот же, что и у devel.
Пример использования: {{ breakpoint() }}
А какие способы отладки twig используете вы?
Работы участников Russian Drupal Awards 2022: «Трамплин», «Шрифты Онлайн», «Мой Урал»
Участники Russian Drupal Awards 2022 повышают свои шансы на победу, если сопровождают заявку кейсом — рассказом о целях проекта, способах их достижения и роли Drupal в этом. Некоторые из них мы решили публиковать для наших читателей на vc.ru — если ещё не читали, то почитайте, например, о сервисе для нумерологических расчётов, платформе для создания 3D-моделей и сайте салонов оптики. Это вторая публикация из серии.
Fonts OnlineРасскажите о бизнесе, которому помогает сайт
Сайт Шрифты Онлайн вырос из хобби-проект в полноценный сайт fonts-online.ru, который каждый день помогает не только дизайнерам, но и множеству людей, которым нужно выбрать шрифт для текста на футболке, на праздничном торте или в медиаконтенте. Например, некоторые типографии отправляют своих клиентов на fonts-online.ru, чтобы те показали, каким они хотят увидеть свой текст.
Какие цели и задачи ставились перед сайтом?
Цель проекта — быть удобным сервисом для людей, которым нужен шрифт, но они ещё не определились какой.
Как достигались цели, поставленные перед сайтом?
В начале разработки я уже использовал Drupal в нескольких простых проектах и точно знал, что буду делать сайт только на нём, так как хотелось сделать максимально быстрый старт, отсюда и выбор многих решений. Тогда актуальной была 6 версия. Первая версия сайта была простым каталогом, созданным через термины таксономии. Шрифты отображались как картинки, генерируемые-php скриптом, а тема и оформление были создана на основе какой-то базовой темы без привлечения дизайнера.
Со временем сайт развивался и преобразовывался. В свободное время я вносил изменения и добавлял функциональность, которую сам считал нужной и полезной, но много хороших идей предлагали и сами пользователи. Возможности сайта расширялись: появилась страничка, на которой можно добавлять шрифт самостоятельно, поиск, фильтры в каталоге, авторизация с возможность добавить шрифт в “Понравившиеся” или создать свою коллекцию и многое другое. Сами шрифты стали подключаться к странице через css-правила. Это позволило расширить возможности по настройке внешнего вида представления шрифта, а также снизить расход пользовательского трафика.
Укажите, пожалуйста, показатели, подтверждающие достижение поставленных перед сайтом целей
Сайт fonts-online.ru находится в топ-3 в выдаче Яндекса по ключевым словам, связанным со шрифтами: «Шрифты», «Бесплатные шрифты», «Кириллические шрифты» и т. д.
По данным similarweb, fonts-online.ru находится на 40400 месте среди всех сайтов мира и на 2200 среди сайтов России.
Расскажите про самую сложную задачу на проекте и как она была решена. Поспособствовал ли решению непосредственно Drupal?
Самая объемная и, казалось бы, сложная задача — это одновременно и сердце проекта: парсинг файла шрифта при его загрузке во время создания нового материала и последующие формирование тела страницы при отображении уже созданного материала. Каждый шрифт (файл TrueType или OpenType, имеют расширения *.ttf и *.otf) хранят в себе много полезной информации: название шрифта, семейство, имя создавшего его дизайнера, лицензию, техническую информацию вроде начертания или наклона и многое другое. Нет смысла заполнять эти поля вручную, поэтому при создании материала файл парсится и из него извлекается нужная информация, которой заполняются соответствующие поля материала.
Нечто похожее происходит и при отображении материала. Информация из шрифта может быть полезна пользователям, но смысла хранить её в базе данных нет. Поэтому при выводе материала, файл шрифта также парсится, и полезные сведения добавляются на страницу.
Все эти задачи легко решаются в рамках хуков и экстра-полей (computed field) Drupal.
Почему вы построили сайт на базе Drupal? Какое качество этой CMS максимально проявляет себя на проекте?
На заре своей карьеры web-разработчика я выбирал, какую CMS взять для освоения, так как понимал, что все изучить не смогу, и нужно остановиться на какой-то одной. Пробовал WordPress, Joomla, ещё какие-то, но выбрал Drupal, на тот момент шестую версию. Drupal был не очень популярен, но меня подкупили возможности этой CMS, на нем можно было создать все! Универсальность и функциональность — лучшие качества Drupal.
Если можете, расскажите о технологическом стеке вашего сайта
На данный момент в сервисе используются следующие технологии:
- Backend: Ubuntu 20.04, PHP 8, NGINX, Percona Server, Drupal 9, Composer
- Frontend: Webpack, Glimmer, Tailwind CSS
Так как проект начинался на шестой версии Drupal, а на подходе уже 10, отдельно хотелось бы упомянуть процесс миграции между мажорными версиями Drupal. Переход с 6 версии на 7, а в последствии и на 8 версию, был довольно топорным — тогда богатой функциональности особо не было, а свой код было проще написать с нуля чем, рефакторить старый. Я просто создавал новый проект на новой версии Drupal, дописывал недостающие функции и импортировал материалы из предыдущей версии. Но все изменилось с приходом Drupal 8. Во-первых, объем своего кода существенно вырос в связи увеличением функциональности сайта, во-вторых, изменился и подход к миграции между мажорными версиями в самом Drupal, теперь переход стал значительно проще и как бы парадоксально это ни звучало, но переход на девятую версию отнял меньше всего времени и сил, чем предыдущие миграции, несмотря на значительно большие объемы кода. Уверен, что переход на 10 версию будет таким же простым.
Весь фронтенд построен на веб-компонентах, Drupal пока в этом слаб, поэтому использовался Glimmer.
Drupal-модули довольно стандартные для любого Drupal проекта: devel, email_registration, flag, fz152, google_analytics, imagemagick, metatag, openid_connect, paragraphs, pathauto, raven, recaptcha, redirect, schema_metatag, simple_sitemap, smtp, twig_tweak.
Тема своя, CSS-фреймворк - Tailwind.
Как сайт продвигает себя и привлекает правильную аудиторию?
Продвижением сайта никто никогда не занимался, рост популярности и посещаемости был естественным.
Почему вы решили участвовать в конкурсе?
Мне понравилось само начинание, конкурс способствует популяризации Drupal. Также любопытно, как оценит проект профессиональное жюри, какие выделит плюсы и минусы. Ну, и участвовать в конкурсе всегда интересно.
Огромное спасибо организаторам и спонсорам Russian Drupal Awards за этот конкурс и возможность принять в нем участие.
Медиа «Трамплин»Расскажите о бизнесе, которому помогает сайт
Инвестор и группа неравнодушных омичей захотели создать СМИ, которое бы положительно рассказывало про наш город, о том, где и чем можно в нём заняться, куда сходить, какие замечательные люди в нём живут и какой бизнес в нём развивается.
Какие цели и задачи ставились?
Реализовать современный, стильный и близкий к людям сайт с удобной админ-панелью для работы журналистов и удобным и ярким интерфейсом для пользователей, чтобы СМИ хотелось читать.
Как достигались цели, поставленные перед сайтом?
Мы разрабатывали проект три месяца, каждую неделю проводя встречи с его главным идеологом и автором. После выпуска проекта мы дорабатывали функциональность для редакции в админке сайта, улучшая возможности и скорость внесения публикаций на сайт.
В админ-панели предусмотрено четыре пользовательские роли: администратор, главный редактор, редактор, SEO. Мы уделили административной части сайта очень много внимания, так как над каждым разделом работают свои редакторы и наполнение сайта должно быть максимально удобным. Также мы реализовали возможность отправки пожертвований на проект.
Укажите, пожалуйста, показатели, подтверждающие достижение поставленных перед сайтом целей
Мы не можем публиковать детали об этом, но «Трамплин» стал популярен в Омске и транслируется другими СМИ.
Расскажите про самую сложную задачу на проекте и как она была решена. Поспособствовал ли решению непосредственно Drupal?
На сайте с нуля реализован модуль пожертвований, с помощью которого можно поддержать проект. Через Drupal-модуль от Альфа-Банка мы подключили возможность разовых онлайн-платежей. Но, чтобы у пользователей была возможность настроить автоплатёж для регулярных пожертвований, мы разработали модуль с нуля.
Механизм работы пожертвований такой. Когда редактор добавляет новость на сайт, в настройках он может указать, выводить ли форму с пожертвованиями для этой новости или нет. Пользователи могут отправлять через эту форму пожертвования, указывая один из типов — разовые или ежемесячные — и сумму пожертвования. В личном кабинете пользователя есть возможность отключить автоплатёж.
На основе пожеланий клиента мы доработали библиотеку модуля CKEditor. Например, при добавлении изображения у стандартного CKEditor нет возможности по отдельности указать отступы сверху, снизу, справа и слева и нет возможности центрировать изображения. Эту функциональность мы реализовали самостоятельно. Также мы подключили библиотеки для вставки видео и добавляли возможность указывать больше настроек для шрифтов (например, межстрочный интервал).
Внешний вид самого CKEditor с точки зрения редактора мы сделали похожим на новости на сайте, чтобы редакторы могли сразу видеть, как материал будет отображаться на сайте.
Почему вы построили сайт на базе Drupal?
Перед разработкой сайта мы выбирали между WordPress, Drupal и «Битрикс». Так как сайт был разработан для регионального СМИ, его доступность и работоспособность были крайне важны. Поэтому мы выбрали Drupal как CMS, более устойчивую к кибератакам по сравнению с конкурентами.
Все функции Drupal понятно описаны в документации. Это позволяет с легкостью их использовать для выполнения нужных задач.
Какое качество этой CMS максимально проявляет себя на проекте?
Скорость работы сайта и быстрые Ajax-запросы.
Если можете, расскажите о технологическом стеке вашего сайта
- Подключение автоматических платежей и оплаты от Альфа-Банка;
- Модуль для поиска Search Autocomplete;
- CKEditor и дополнительные библиотеки к нему;
- дополнительные модули для работы с контентом и мета-тегами.
Как сайт продвигает себя и привлекает правильную аудиторию?
Сайт продвигается с помощью SEO, а также таргетированной рекламы и лидеров мнений города, которые транслируют публикации на своих личных страницах в соцсетях.
Почему вы решили участвовать в конкурсе?
Считаем, что сделали важное дело: создали новое СМИ, которое создает положительный образ и бренд города, а также является популярным в Омске!
Мой УралРасскажите о бизнесе, которому помогает сайт
Один из крупнейших всесезонных курортов Южного Урала Солнечная долина, при грантовой поддержке Ростуризма, интенсивно развивает туристическую инфраструктуру. Так, для гостей региона здесь создали туристическую тропу, интерактивный визит-центр, а также мобильное приложение с интересными местами и маршрутами по Горно-Заводской зоне Челябинской области.
Курорт претендует на роль регионального туристического хаба, поэтому проект под названием Мой Урал призван создать базу знаний (места, маршруты и статьи), чтобы помочь «Солнечной долине» усилить свои позиции центра развития туризма, а также стать удобным инструментом для оформления туристической инфраструктуры, создания новых маршрутов и привлечения туристов.
Сайт позволяет прочитать статьи о Южном Урале, посмотреть маршруты и прослушать аудиогиды. Также на курорте были расставлены таблички с QR-кодами, по которым можно перейти к чтению материалов сайта о локации. Теперь многочисленные гости курорта, приезжающие на важные культурные события (Ильменский фестиваль) или международные соревнования (этап кубка мира по ски-кроссу), смогут больше узнать об Урале, прослушать лекции в визит-центре и запланировать своё новое путешествие.
Какие цели и задачи ставились?
- Создать адаптивный сайт с интерфейсом приложения, который можно будет удобно использовать не только в браузере, но и на тач-панелях визит-центра и мобильных устройствах.
- Создать PWA мобильные приложения и выложить их на Android и Appstore. После 24 февраля было принято решение дополнительно выложить приложения в NashStore.
Примечание: Мы верим, что подход PWA (т.е. браузер как точка входа и как платформа для разработки) со временем отвоюет у нативных приложений немалую долю рынка. Сейчас PWA работают везде, по сути не зависят от магазинов приложений и обеспечивают близкий к нативному user experience.
- Создать удобный административный интерфейс для построения маршрутов, достопримечательностей и генерации QR-кодов. Внедрить визуальный конструктор контента из готовых блоков для удобного создания визуально привлекательных познавательных статей.
- Интегрировать Яндекс-карты для автоматического построения маршрутов между точками в зависимости от способа передвижения.
- Создать эмоции (разработать логотип, иллюстрации, визуально привлекательные карты, внедрить специально подобранные шрифты, создать инфографику в стилистике сайта).
Как достигались цели, поставленные перед сайтом?
Был разработан логотип и стилистика проекта (промо-материалы: https://disk.yandex.ru/d/9AEHnA34JTa1GA). Изначально разработали три концепции (https://disk.yandex.ru/i/DB-EkyWn8xSBlQ), из которых заказчик выбрал наиболее подходящую и выдержанную.
Принятый заказчиком логотип — в центре
После внесения правок у нас появилась визуальная основа. Вооружившись выбранной стилистикой, мы создали иллюстрацию, в которой спрятали различные пасхалки, т.е. места из маршрутов сайта. Визуально получился Южный Урал со всеми его узнаваемыми пейзажами. Иллюстрация стала основой дизайна и встречает пользователя на первом экране. В качестве слогана проекта мы использовали слова писателя Джона Стейнбека: «Это не люди создают поездки – поездки создают людей. Выбирайте маршруты, узнавайте новое, созидайте себя».
Важно отметить, что к такой стилистике мы пришли не сразу, прорабатывались и другие варианты, например:
И пару слов о названии. Мы опирались на культурный контекст и свободные домены, в итоге оптимальным оказался вариант Мой Урал и точка. Для приложения зарегистрировали домен myural.online, для рекламы используем два варианта: МойУрал.рф и Мой-Урал.рф.
- Разработан дизайн сайта. Далее проект был свёрстан под Drupal 8. При разработке мы опирались на готовую стилистику курорта, в основе которой лежит дизайн-экосистема, состоящая из готовых визуальных блоков. Тут для нас не было ничего сложного — нам просто нужно было следовать документации и уделить больше внимания наполнению.
- В сотрудничестве с компанией Initlab был разработан наиболее сложный функционал – интеграция «Яндекс Карт» для автоматической генерации маршрутов (подробнее об этом ниже).
- После наполнения и тестирования сделали PWA-версию сайта, на основе которой создали PWA- приложения для всех платформ. Пришлось помучиться с AppStore, т. к. приложения для этого магазина нужно было подписывать цифровым сертификатом (этот процесс показался нам непростым и запутанным), а также соблюсти множество других нюансов. На текущий момент очень недовольны скоростью приложения под Android и готовим новую версию, которая решает эту проблему.
- Для больших тач-панелей визит-центра мы нарисовали карту Горно-Заводской зоны Челябинской области, чтобы наглядно показать где это и что там посмотреть. Получилось наглядно и эффектно, если смотреть на тач-панелях: myural.online/map.
Для оформления визит-центра создали плакаты А2 о местной фауне. Прочитайте, чем интересен, например, степной орёл.
Укажите, пожалуйста, показатели, подтверждающие достижение поставленных перед сайтом целей
На сайте не работают счётчики из-за политики конфиденциальности, которую требуют магазины приложений, в особенности AppStore, поэтому оценить посещаемость на текущем этапе сложно. Вместе с тем мы постоянно находимся в контакте с представителями курорта и знаем, что сайт используется на практике в визит-центре. Обратная связь по проекту хорошая. Сейчас мы работаем над улучшением мобильной версии, с внедрением обновлений запустим и сбор статистики.
Расскажите про самую сложную задачу на проекте и как она была решена. Поспособствовал ли решению непосредственно Drupal?
Для нас наиболее сложной задачей стала генерация маршрутов на лету при помощи API «Яндекс Карт». Решить её мы смогли при помощи разработчиков из компании Initlab, которые уже имели опыт в реализации подобных задач. К сожалению, для Drupal 8 нет готовых удобных модулей по интеграции «Яндекс Карт», поэтому для нашего проекта пришлось писать свой отдельный модуль, который:
- позволяет администратору добавлять точки маршрута на карту в нужном порядке,
- позволяет добавлять интересные места на карту;
- при просмотре карты убирает все лишнее, позволяет выбрать способ передвижения по маршруту и в зависимости от этого выстраивает маршрут между точками в нужном порядке (интегрируется с API «Яндекс Карт»);
- выводит список достопримечательностей с кратким описанием и фото слева от карты для удобной навигации.
В решении вышеописанной задачи Drupal не сильно помог, т. к. она достаточно специфична, но зато множество других возможностей сайта мы реализовали именно при помощи движка.
Есть проблемы, над решением которых мы работаем сейчас, в частности, использование Ajax при переключении страниц, здесь Drupal далеко не идеален. На текущий момент эту задачу пока не решили, т. к. есть более приоритетные задачи.
Почему вы построили сайт на базе Drupal? Какое качество этой CMS максимально проявляет себя на проекте?
Наша студия работает только с этой CMS, в ней мы уверены и сделали на ней множество проектов. Данный проект — ещё одно доказательство, что Drupal — это система с большими возможностями. Главное — знать как готовить (что относится и к любому другому решению).
Если можете, расскажите о технологическом стеке вашего сайта
На бэкенде используем Drupal 8. Из модулей отметим: Geolocation + Geolocation - Yandex Maps, Mobile Detect, Paragraphs + Paragraphs Browser, Pathauto, Progressive Web App, Routes, Taxonomy Views Integrator, Simplify Menu, Twig Field Value, Twig Tweak, Chosen, Responsive Favicons, Field Group, Views Autosubmit, Views Show More Pager, Ace Editor, Site Settings and Labels.
Если говорить о фронтенде, то хочется отметить плагин для зумирования карты Smooth Zoom Pan - jQuery Image Viewer. С его помощью нам удалось быстро всё настроить. Плагин хоть и очень старый, но работает хорошо, имеет много возможностей и поддерживает тач-панели.
Как сайт продвигает себя и привлекает правильную аудиторию?
Реклама на туристических маршрутах региона, таблички с QR-кодом в знаковых местах, партнёрство с тематическими сообществами путешественников, наличие в магазине приложений, участие в конкурсах, партнёрские баннеры и информация на сайте курорта «Солнечная долина», информация на тач-панелях курорта Солнечная долина.
Почему вы решили участвовать в конкурсе?
Это продвижение проекта, его оценка профессиональным сообществом, обратная связь, а значит, и неминуемое улучшение и работа над ошибками.
Победители конкурса Russian Drupal Awards будут определены осенью. В этом году мы определим победителей в пяти номинациях: «Лучший промо-сайт, лендинг или сайт-визитка», «Лучший интернет-магазин», «Лучший онлайн-сервис», «Лучший сайт СМИ, медиа или блог» и «Лучший корпоративный сайт».
--
Оригинал статьи опубликован на сайте vc.ru
Дайджест новых модулей за июль 2022
Ежедневно на Drupal.org публикуются модули, разрабатываемые сообществом (контрибные модули). Мы просмотрели все новые модули для Drupal 9, опубликованные в июле, и собрали для вас подборку самых интересных и полезных.
Countries import — импорт данных о странах и создание терминов или материалов с информацией о странах. Импортируемые данные можно увидеть по ссылке https://raw.githubusercontent.com/cristiroma/countries/master/data/countries.json
PDF Metadata — модуль позволяет автоматически устанавливать метаданные в загруженных pdf-файлах, используя шаблоны замены на основе токенов для улучшения SEO.
Drupal Commerce Gallery — модуль предоставляет блок, в котором отображаются галерея продуктов Drupal Commerce. Настройки блока позволяют задать заголовок, количество выводимых продуктов, количество колонок в галерее. При наведении на карточку продукта будут отображаться название продукта, его SKU и цена.
File Rename — модуль добавляет возможность переименовывать файлы, загруженные на сайт. После переименования картинки автоматически перестраивается imagecache для этого изображения.
File Replace (D8+) — модуль предоставляет возможность заменять файлы, сохраняя их uri. Модуль будет полезен в тех случаях, когда на сайте есть прямая ссылка на файл или файл используется напрямую каким-либо способом, и его необходимо время от времени обновлять.
User annex — альтернатива модулю «User history». Модуль позволяет отслеживать (логировать) изменения в заданных базовых и кастомных полях в сущности (профиле) пользователя.
QR Block — модуль предоставляет блок, в котором динамически выводится QR-код из заданного токена.
SOLR Search Synonym — модуль является расширенной версией модуля Search API Synonym(search_api_synonym) и обеспечивает интеграцию с Apache Solr, экспорт синонимов непосредственно в конфигурации Solr без необходимости вручную обновлять файл synonyms_und.txt.
Cache review — модуль предоставляет инструменты, помогающие просматривать и анализировать работу внутреннего (IPC) и динамического (DPC) кэша страниц. Модуль также предоставляет несколько демонстрационных страниц с кэшированными и некэшированными элементами. Основная цель модуля Cache Review — помочь разработчикам узнать, как работает кэш для анонимных и авторизованных пользователей. Также модуль может помочь при поиске и анализе возможных проблем с кэшированием в проектах.
Views alias filter — модуль предоставляет открытый (exposed) фильтр для фильтрации материалов по их псевдонимам адресов (URL alias).
Weerly — модуль позволяет реализовать систему сокращения ссылок на собственном сайте.
JSON-LD Schema UI — модуль для продвинутой поисковой оптимизации, реализует пользовательский интерфейс (UI) для управления JSON-LD Schema в форме создания/редактирования материалов.
Menu migration (Import & Export) — импорт/экспорт пунктов меню между сайтами на Drupal. Пункты меню экспортируются в виде json-файла в папку на сервере, заданную в форме конфигурации модуля. Есть возможность работать с модулем как через админ-панель, так и через drush.
Bootstrap flag icons — вывод переключателя языков в виде кнопки Bootstrap 5 с флагами стран.
Views Taxonomy radios/checkboxes filter — вывод в представлениях (Views) фильтров по полям с терминами таксономии в виде радиокнопок или чекбоксов (в ядре имеется вывод только в виде выпадающего списка («Dropdown») или поля с автодополнением («Autocomplete»)).
Layout Builder Accordion — модуль предоставляет новый вид макета (секции) «Аккордеон» для Layout Builder, в котором добавленные блоки будут отображаться как панели аккордеона.
Style Selector — модуль предоставляет пользовательские типы полей — CSS Style и CSS Color для выбора CSS-классов и цвета из списка задаваемых значений для материалов/сущностей. Форматтер «CSS Style» добавляет выбранный пользователем класс к врапперу материала/сущности, а форматтер «CSS Color» устанавливает выбранный цвет в виде инлайн-css враппера материала/сущности.
Grid Widget — расширение возможностей модуля Options из ядра Drupal для вывода радиокнопок и чекбоксов вариантами стилизации в виде колонок, Flexbox и CSS Grid.
Active Directory Integration — модуль обеспечивает настраиваемую интеграцию с Active Directory при помощи расширения PHP LDAP.
Komponent — модуль предоставляет пользовательское поле для добавления макетов Layout Builder в материалы. Модуль позволяет задать запрет на изменение макета секций заданных в поле по умолчанию. По умолчанию можно только включить Layout Builder для материалов, а при помощи модуля Komponent можно добавить к материалу несколько полей, в которых будет работать Layout Builder. К примеру, можно добавить два поля Komponent, при это одно поле оставить свободным, а во втором настроить макет и секции по умолчанию, установить запрет на изменение секций и макетов и сделать поле обязательным. В этом случае контент-менеджер «не забудет» заполнить нужные поля и при этом не поломает макет страницы.
Обычно мы включаем в подборку модули, опубликованные на Drupal.org и не требующие интеграции с внешними платными сервисами. Если вы хотите рассказать о своем платном модуле или о модуле, реализующем интеграцию с платным сервисом, то отправьте запрос в телеграм-бот поддержки @drupalrusupportbot.
Экспорт новостей с сайта в "Яндекс Новости"
Если вы являетесь СМИ (или ваш клиент является СМИ), то наверняка будет задача экспорта новостей с сайта в "Яндекс Новости". Задача только на первый взгляд кажется сложной.
Итак, что такое "экспорт в Яндекс Новости". Нужно создать RSS ленту определенного формата. 80% нужных нам xml элементов нам может предоставить модуль views_rss. Но для Яндекса этого мало. По документации нужно еще добавить
xmlns:yandex="http://news.yandex.ru"xmlns:media="http://search.yahoo.com/mrss/"
в заголовок RSS. С этим нам поможет модуль созданный Андреем Березовским (duozersk) - views_rss_yandex и с недавнего времени поддерживаемый мной.
Так же модуль предоставляет элементы:
- yandex:full-text
- yandex:genre
- yandex:enclosure (но он пока не работает должным образом)
Естественно я сразу подготовил версию для Drupal 9+
Однако, включить модули недостаточно. Нужно еще создать представление (views) типа "поток"
На что нужно обратить внимание:
- Яндекс принимает новости только за последние 7 дней, поэтому делаем соответствующий критерий фильтрации
- Заголовок не должен иметь в себе ссылку (снимаем галочку "ссылается на содержимое")
- Добавляем поле "ссылка на содержимое" и переключаем её в режим "только URL". Эту ссылку нужно использовать для элемента link
- Для элемента pubDate нужно добавить поле "создан в" и переключить формат даты на RFC 822 (предоставляется модулем views_rss_yandex)
Техподдержка Яндекса проверяет каждую новость и обязательно скажет вам, что "вот это вот новостью не является". Я рекомендую добавить к типу материала поле-галочку "Не выгружать в Яндекс Новости" и ставить её нодам отбракованным техподдержкой Яндекса. Таким образом они смогут остаться на вашем сайте, но будут исключены из ленты RSS для Яндекса.
Планы на будущее:
- Нужно разобраться с работой yandex:enclosure, чтобы появилась возможность выгружать изображения и видео в новости
Если вы хотите помочь с разработкой, тестированием, написанием документации, то добро пожаловать. Пишите в любые каналы связи.
Дайджест новых модулей за июнь 2022
Ежедневно на drupal.org публикуются модули, разрабатываемые сообществом (контрибные модули). Мы просмотрели все новые модули для Drupal 9, опубликованные в июне, и собрали для вас подборку самых интересных и полезных.
Twig "real_content" empty region / content check helper — если в twig-шалоне вам нужно проверить, пуст ли регион, чтобы, к примеру, вообще не выводить теги-обёртки, то этот модуль — то, что вам нужно. Можно использовать и как фильтр field|real_content, и как twig тест field is real_content.
Page Cache Boost — модуль кэширует страницы для анонимных пользователей наилучшим возможным способом, обновляя кэш после обработки устаревших страниц с низким TTL. Не требует настройки, просто включите модуль.
Telegram integration — автоматический постинг материалов или других контентных сущностей в телеграм-канал и отображение комментариев к посту из телеграм-канала под материалами.
Reauthenticate — принудительная повторная авторизация для выбранных страниц. Например, можно настроить принудительную авторизацию на странице редактирования учетной записи пользователя (/user/*/edit*) или управления веб-формами (/admin/structure/webform*).
Shy One-Time — защита одноразовых ссылок от нежелательной инвалидации, таких как запрос нового пароля, что может происходить в некоторых почтовых программах или при отправке ссылки в мессенджерах. Модуль использует PHP-класс «CrawlerDetect» для обнаружения ботов/краулеров/пауков по агенту пользователя и заголовку http_from и в настоящее время способен обнаружить порядка 1000 ботов/краулеров/пауков.
Single SignIn — модуль позволяет ограничить количество активных сессий пользователя. При авторизации происходит автоматический выход на других устройствах и браузерах.
Estimated Read Time — новый тип поля, в котором рассчитывается и отображается время, необходимое для прочтения содержимого материала. Модуль совместим с Layout Builder.
Inputmask Widget Formatter — виджет однострочных текстовых полей для добавление маски ввода, таких как «(999) 999-99-99» для номера телефона или «99.99.9999» для даты.
Image File Preview — предварительный просмотр графических файлов на административной странице управления файлами.
Commerce Shipping Tracking — блок для отображения статуса заказа пользователя. На странице настроек модуля можно выбрать, какие сообщения будут отображаться в блоке, а также сопоставить состояния доставки с текстовыми метками, которые будут показаны пользователю.
Min password — модуль позволяет настроить минимальную длину пароля для всех пользователей на сайте. На действующие пароли этот модуль не влияет. В качестве альтернативы можно использовать модуль Password Policy, который имеет множество настроек для паролей, но при этом может быть сложным в использовании, если вам нужно только ограничить минимальную длину паролей.
Editor Mailto Link — модуль расширяет возможности встроенного редактора при добавление ссылок, позволяя выбирать «mailto:» и «tel:».
ONLYOFFICE — модуль позволяет прямо на сайте просматривать и редактировать документы, загруженные как сущности Media. Для работы модуля требуется установленный на сервере ONLYOFFICE Document Server. поддерживаются следующие форматы: DOCX, XLSX, PPTX, для просмотра: DJVU, DOC, DOCM, DOT, DOTM, DOTX, EPUB, FB2, FODT, HTML, MHT, ODT, OTT, OXPS, PDF, RTF, TXT, XPS, XML, CSV, FODS, ODS, OTS, XLS, XLSM, XLT, XLTM, XLTX, FODP, ODP, OTP, POT, POTM, POTX, PPS, PPSM, PPSX, PPT, PPTM.
Entity Repeat — автоматическое создание копий сущностей на основе задаваемых критериев цикличности. Поддерживаются сущности, которые содержат поля даты.
Taxonomy Terms Limit — модуль позволяет администраторам ограничить количество терминов таксономии, которые могут быть созданы в определенном словаре.
Warmer View Mode — развитие концепции «прогрева сущностей», представленной в модуле Warmer. Модуль позволяет предварительно отрендерить сущности для разных режимов просмотра.
Target Attributes Filter — фильтр для автоматического добавление атрибута «target» к гиперссылкам. В настройках фильтра можно указать какое значение атрибута «target» будет применено к внутренним или внешним ссылкам.
Checkbox/Radio button Multi Columns — виджет поля, с помощью которого можно выводить чекбоксы и радиокнопки в несколько столбцов. Количество колонок настраивается.
Uninstall unexisting — автоматическое деинсталляция отсутствующих модулей. Это может быть очень полезно при работе над проектом, в котором используется системы версионирования (например, git) и разработка ведется на основе веток (бранчей). Использование модуля позволит избежать проблем, которые могут возникнуть при переключении в ветку, в которой какие-то модули отсутствуют.
Maintenance IP Whitelist — модуль позволяет задать белый список IP-адресов, с которых разрешено обходить режим обслуживания сайта.
Entity Confirmation — если вам кажется, что сообщения после действий с сущностями выглядят скучными, то этот модуль для вас. С его помощью вы сможете настроить собственные сообщения, которые отображаются после создания, редактирования и удаления материалов.
Generated Content — программная генерация заданного контента. Модуль может быть полезен разработчикам, если в проекте необходимо контролировать какой именно контент или какое его количество должно быть сгенерировано. Можно создавать случайный или статический контент. По сравнению с модулем Devel Generate, который генерирует контент «как попало», здесь вы точно будете знать что получите после генерации.
noUiSliderWidget — виджет для числовых полей для отображения слайдера (ползунка) без зависимости от jQuery. Используется js-библиотека noUiSlider.
Если вы разработали интересный и полезный модуль и хотите рассказать о нём, то напишите об этом в комментариях.
Тигры полосатые
