YOOtheme Flow - Шаблон Joomla

Руководство по настройке YOOtheme Flow для Joomla-сайта

YOOtheme Flow лучше рассматривать не как обычную графическую оболочку, а как готовый стартовый пакет для сайта программного продукта, SaaS-сервиса, технологической компании или команды, которой нужно быстро собрать понятную страницу с функциями, тарифами, поддержкой, блогом и презентацией продукта. В этом руководстве разберём, как подойти к установке и настройке Flow так, чтобы не получить красивую копию демо, а собрать рабочий сайт на Joomla с понятной структурой, управляемыми модулями и проверяемым результатом.

Материал начинается там, где короткая карточка продукта обычно заканчивается: что проверить перед установкой, как не перепутать пакет шаблона и демо-пакет, какие панели YOOtheme Pro открывать после активации, как использовать готовые макеты Flow, где назначать стили на пункты меню, что делать с модулями, шапкой, адаптивностью, локализацией и типичными проблемами.

В тексте нет задачи пересказать рекламное описание. Цель другая - дать практическую инструкцию, по которой владелец сайта, администратор Joomla или вебмастер сможет безопасно развернуть YOOtheme Flow, заменить демо-контент, проверить публичную часть сайта и понять, когда этот шаблон действительно подходит проекту.

Что делает Flow полезным именно для технологического сайта

Flow рассчитан на сайт, где нужно не просто вывести логотип и несколько абзацев, а провести посетителя по логике продукта: проблема, преимущества, функции, социальное доказательство, тарифы, поддержка и новости. Официальная страница YOOtheme описывает Flow как Joomla template для software and technology websites и показывает набор готовых страниц: Home, Features, About, Portfolio, Services, Pricing, Index и Post. Это важная подсказка для структуры будущего сайта: Flow удобен там, где продукт нужно объяснять через несколько связанных экранов, а не через одну универсальную витрину.

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

Главная ценность Flow - не один красивый hero-блок, а связка готовых страниц и стилей внутри YOOtheme Pro. Пользователь получает не только внешний вид, но и рабочий подход к сборке: макеты загружаются в Page Builder, стили меняются через Style Library и Style Customizer, модули и позиции управляются из Joomla и панели YOOtheme Pro, а разные страницы можно привязать к разным template styles через меню.

Какие страницы стоит использовать как основу

Не обязательно переносить весь демо-сайт один к одному. Лучше выбрать страницы по задачам проекта:

• Главная страница подходит для первой презентации продукта, ключевых преимуществ, блока тарифов и переходов к поддержке.
• Features удобна для подробного объяснения функций, если продукт сложно понять по одному экрану.
• About или Company нужна, когда доверие к команде влияет на заявку, регистрацию или покупку.
• Pricing можно превратить в страницу тарифов, пакетов услуг или вариантов внедрения без указания цен, если цены обсуждаются индивидуально.
• Index и Post пригодятся для блога, новостей продукта, базы знаний или обучающих материалов.
• Support можно использовать как вход в документацию, контактную форму, справочный центр и список каналов помощи.

Такой подход помогает не ломать демо-макеты, а использовать их как карту сайта. Если у проекта всего одна услуга и нет функций, тарифов, документации или команды, Flow может оказаться слишком насыщенным. В этом случае часть страниц лучше удалить сразу, чтобы сайт не выглядел пустым.

Где Flow может не подойти

Шаблон менее удачен для строгих государственных порталов, тяжёлых новостных сайтов, каталогов с тысячами однотипных карточек или проектов, где дизайн должен быть максимально нейтральным. Flow построен вокруг яркого продуктового образа, иллюстраций, округлых элементов и секций с маркетинговой логикой. Если бренд требует сдержанной корпоративной подачи, придётся активно менять палитру и типографику через Style Customizer.

Ещё один нюанс - зависимость от YOOtheme Pro. Flow раскрывается именно в этой среде: готовые layout-пакеты, стили, живой preview, модули, builder module, dynamic content и settings-панели. Если команда принципиально не хочет использовать визуальный конструктор и предпочитает чистый кастомный шаблон Joomla с ручной версткой, Flow будет лишним слоем.

Что проверить перед установкой на Joomla

Перед установкой стоит отделить три вещи: сам шаблон YOOtheme Pro, демо-пакет Joomla с готовым сайтом и отдельные макеты Flow, которые можно загрузить в существующий проект. В официальной документации YOOtheme прямо указано, что demo package - это полная установка Joomla с YOOtheme Pro и демо-контентом. Такой архив не ставят поверх уже работающего сайта как обычный шаблон. Если перепутать пакет, можно потратить время на установку, которая изначально не предназначена для текущего сайта.

Проверка окружения

Минимальный практический чек перед работой:

• Проверьте, что текущая Joomla и серверное окружение соответствуют требованиям YOOtheme Pro и самой Joomla.
• Сделайте резервную копию файлов и базы данных до установки или обновления шаблона.
• Убедитесь, что у администратора есть права на установку расширений, управление шаблонами, меню и модулями.
• Проверьте, не используется ли на сайте устаревший шаблон с важными overrides, которые могут влиять на вывод материалов.
• Подготовьте тестовую копию сайта, если проект уже опубликован и получает трафик.
• Соберите контент: логотип, меню, тексты hero-блока, список функций, тарифную логику, контакты, изображения и материалы для блога.

Самая частая ошибка на старте - ставить красивый демо-пакет на рабочий сайт без плана миграции контента. Для живого сайта безопаснее установить YOOtheme Pro как шаблон, затем загрузить нужные layout-блоки и вручную заменить демо-данные.

Что решить до импорта макетов

Flow содержит готовую продуктовую логику, но не знает вашу структуру. До импорта ответьте на несколько вопросов:

1. Какая страница станет главной и какой пункт меню будет открывать её по умолчанию.
2. Нужна ли отдельная страница тарифов или достаточно блока на главной.
3. Будет ли блог обычным разделом Joomla или базой знаний с категориями.
4. Какие модули должны выводиться в шапке, мобильном меню, футере, зоне поддержки и нижнем блоке.
5. Планируется ли мультиязычность, потому что страницы, модули и меню придётся дублировать и назначать по языкам.

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

Установка: шаблон, демо-пакет и первый запуск

Официальная документация YOOtheme предлагает два сценария: установить YOOtheme Pro theme в существующую Joomla или начать с Joomla demo package. Для большинства рабочих сайтов подходит первый вариант. Демо-пакет полезен для новой установки, тестового стенда или обучения, когда нужно посмотреть, как Flow собран изнутри.

Установка в существующий сайт

Общий порядок такой:

1. Скачайте архив шаблона YOOtheme Pro для Joomla из своего источника поставки.
2. В админ-панели Joomla откройте установщик расширений и загрузите архив как обычное расширение.
3. После успешной установки перейдите в список site template styles и назначьте стиль YOOtheme Pro по умолчанию или только на нужные пункты меню.
4. Откройте YOOtheme Pro Customizer из админ-панели Joomla.
5. Проверьте live preview, сохранение настроек, доступ к страницам, меню, модулям и панели Settings.
6. Если в вашей версии нужен доступ к облачной библиотеке макетов, настройте ключ в Settings → API Key согласно документации YOOtheme.

На этом этапе не стоит сразу менять цвета, шрифты и всю главную страницу. Сначала убедитесь, что шаблон активен, сайт открывается, админ-панель не показывает ошибок, а YOOtheme Pro Customizer сохраняет изменения.

Когда использовать demo package

Demo package уместен, если вы создаёте сайт с нуля и хотите получить готовую структуру Flow вместе с демо-контентом. Его разворачивают как отдельную установку Joomla, а не как шаблон поверх существующего проекта. Этот вариант удобен для обучения: можно открыть демо-страницу, посмотреть, какие sections, rows, columns и elements используются, затем повторить подход на рабочем сайте.

Правило безопасности: если у вас уже есть опубликованный сайт, сначала поднимите тестовую копию. Проверьте установку, template styles, меню, модули и мобильный вид там, а не на рабочей странице.

Первая проверка после установки

После установки откройте публичную часть сайта и пройдите три уровня проверки:

• Главная страница открывается без PHP-ошибок, пустого экрана и отсутствующих CSS-файлов.
• Админ-панель позволяет открыть YOOtheme Pro Customizer, а кнопки Save и Cancel появляются после изменения настройки.
• Пункт меню, назначенный на страницу Flow, использует нужный template style, а не старый шаблон сайта.

Если эти проверки пройдены, можно переходить к настройке страниц и стилей. Если нет, сначала решите проблему установки, прав или назначения шаблона. Дальнейшее редактирование макетов на нестабильной установке только усложнит диагностику.

Настройка после установки: от Customizer до готовой страницы

После установки YOOtheme Flow нужно настроить не одним большим действием, а несколькими слоями. Сначала базовый внешний вид, затем страницы и макеты, потом меню и модули, после этого адаптивность, SEO-метаданные, производительность и права доступа. Такой порядок уменьшает риск, что вы поменяете стиль, а потом не поймёте, почему отдельная страница всё равно выглядит иначе.

Откройте правильную рабочую панель

В YOOtheme Pro Customizer слева находится навигация по панелям, справа - live preview. Для Flow чаще всего нужны следующие разделы:

• Layout - сайт, логотип, шапка, навигация, mobile header, top, bottom, sidebar, footer.
• Style - выбор готового стиля и настройка цветов, шрифтов, расстояний, кнопок и компонентов UIkit.
• Pages - индивидуальные страницы, которые собираются через page builder.
• Templates - site-wide шаблоны для материалов, категорий, поиска и других типов страниц.
• Menus - работа с пунктами меню и их отображением в шапке.
• Modules - позиции модулей, опубликованные модули и их видимость в live preview.
• Settings - favicon, API key, custom code, advanced-настройки, системная проверка и сведения о шаблоне.

Не надо открывать все панели подряд. Для первого рабочего варианта достаточно пройти четыре: Style, Layout, Pages и Modules. Остальное подключайте по мере необходимости.

Выберите стартовый стиль и не спешите с тонкой кастомизацией

Официальная страница Flow указывает шесть style variations: Default, White Blue, White Darkblue, White Green, White Lightblue и White Pink. Выберите ближайший вариант к бренду, сохраните его и проверьте главную страницу. После этого меняйте отдельные цвета и шрифты через Style Customizer. Если сразу править десятки переменных, будет сложно понять, какая настройка сломала контраст, кнопку или отступ.

Для типового технологического сайта часто достаточно оставить фирменный фиолетово-синий характер Flow, заменить оттенки кнопок и проверить контраст текста на светлых блоках. Если бренд строгий, можно уйти в светлый стиль, но сохранить мягкую геометрию карточек и округлые CTA, чтобы шаблон не потерял свой характер.

Загрузите макет и замените демо-контент

В Page Builder макет состоит из sections, rows, columns и elements. Это не просто внутренние термины конструктора: они помогают понять, что именно вы редактируете. Section обычно отвечает за крупный смысловой блок страницы, row - за сетку внутри секции, column - за размещение контента, element - за конкретный текст, изображение, кнопку, список, галерею или видео.

1. Откройте страницу, которую хотите собрать на основе Flow.
2. Загрузите подходящий layout из библиотеки или начните с существующей демо-страницы.
3. Замените hero-текст, подзаголовок, кнопку, изображения и ссылки.
4. Откройте каждую секцию и удалите элементы, которые не нужны вашему продукту.
5. Сохраните страницу и проверьте live preview.
6. Откройте публичную часть сайта в новой вкладке и проверьте страницу как обычный посетитель.

Не оставляйте демо-пункты меню, вымышленные тарифы и пустые карточки функций на опубликованном сайте. Flow выглядит цельно только тогда, когда каждая секция поддерживает реальный сценарий продукта.

Настройте шапку и меню

Flow в референсе использует чистую верхнюю навигацию с логотипом, пунктами Home, Features, Company, Extensions, Support, Blog, ZOO и заметной кнопкой покупки. В вашем проекте это лучше превратить в меню по реальным задачам: Главная, Возможности, Кейсы, Цены или Тарифы, Документация, Блог, Контакты. Если продукт продаётся через заявку, кнопка может вести на форму консультации. Если продукт скачивается, кнопка может вести к странице загрузки или блоку с установочным файлом.

В YOOtheme Pro настройки шапки и navbar связаны с меню и module positions. Если в десктопной шапке всё хорошо, всё равно проверьте mobile header: пунктов может быть слишком много, кнопка может уйти во вторую строку, а dropdown или offcanvas может требовать более коротких названий.

Проверьте footer и системные страницы

Footer часто оставляют на потом, но в Flow он важен: через него можно связать поддержку, блог, документацию, социальные ссылки, политику конфиденциальности и контактные данные. Если сайт мультиязычный, footer builder не всегда удобен как единый блок на все языки. Документация YOOtheme рекомендует для мультиязычных footer-сценариев использовать builder modules в позиции bottom, чтобы управлять языковыми версиями через Joomla-модули.

Мини-итог: после этой настройки у вас должна быть не «похожая на демо» страница, а рабочий каркас сайта: выбран стиль, назначена главная страница, настроено меню, удалён лишний демо-контент, проверена шапка, мобильная навигация и footer.

Template Styles, меню и модульные позиции Flow

Для Joomla-шаблона важна не только красота страницы, но и то, как шаблон назначается на пункты меню, как ведут себя модули и где появляется системный вывод Joomla. В YOOtheme Pro это особенно заметно, потому что часть страниц может быть собрана в Page Builder, часть - через templates, часть - через стандартные материалы и категории.

Когда дублировать template style

Если все страницы должны выглядеть одинаково, достаточно одного template style. Но для Flow часто полезно создать несколько вариантов:

• Основной стиль для главной, страниц продукта и поддержки.
• Более спокойный стиль для блога или базы знаний, где важна читаемость текста.
• Отдельный стиль для посадочной страницы продукта, если нужен иной hero, шапка или footer.

Документация YOOtheme описывает безопасный путь: в Joomla Template Manager нужно продублировать стиль yootheme - Default, открыть копию, нажать Open Website Builder и настроить её отдельно. Затем стиль назначается на нужные menu items через вкладку Menu Assignment или через поле template style в самом пункте меню.

Модульные позиции, которые стоит понять

YOOtheme Pro интегрирует Joomla Module Manager в Customizer. В панели Modules можно видеть module positions, назначенные модули и их присутствие в live preview. Для Flow особенно полезны позиции:

Ключевой нюанс: position element и builder module позволяют собрать сложные участки, но не надо использовать их для каждой мелочи. Если элемент статичен и нужен только на одной странице, проще оставить его в Page Builder. Если блок должен повторяться, иметь языковую версию или управляться через Joomla Module Manager, лучше вывести его как модуль.

Почему sidebar может «пропасть»

В документации YOOtheme указано, что позиция sidebar не отображается на страницах, построенных через YOOtheme Pro Page Builder. Это не обязательно ошибка. Builder создаёт полноширинные секции, и боковую колонку нужно располагать внутри самого макета через Position element или отдельную структуру колонок. Поэтому если вы публикуете модуль в sidebar, а он не виден на page builder странице Flow, сначала проверьте тип страницы и наличие position element.

Практический пример: собираем главную страницу продукта

Разберём реалистичный сценарий: нужно собрать главную страницу для облачного сервиса или программного продукта на основе YOOtheme Flow. Цель - получить страницу, где посетитель сразу понимает предложение, видит возможности, сравнивает варианты использования, получает переход к поддержке и может перейти к скачиванию или тестированию.

Цель

Получить рабочую главную страницу с hero-блоком, разделом функций, блоком результата, тарифной или пакетной логикой, ссылкой на поддержку, блогом или новостями и понятным CTA. При этом страница должна использовать стиль Flow, но не содержать чужие демо-тексты и случайные изображения.

Подготовка

• YOOtheme Pro установлен и открыт в Customizer.
• Создана Joomla article page или подходящий пункт меню для главной страницы.
• Выбран один из style variations Flow как стартовый.
• Подготовлены тексты: короткое обещание, три-пять функций, описание результата, FAQ или блок поддержки.
• Решено, нужна ли отдельная страница Pricing или достаточно блока на главной.

Шаги настройки

1. В панели Pages откройте страницу, которая будет главной, и загрузите layout Flow Home или близкий layout из библиотеки.
2. В hero-блоке замените заголовок, подзаголовок и кнопку. Кнопка должна вести к реальному действию: демо, заявке, документации или блоку скачивания.
3. Во второй секции замените абстрактный обзор проекта на конкретный результат: что пользователь сможет увидеть, создать или автоматизировать.
4. Секцию с идеями, друзьями или командным взаимодействием адаптируйте под сценарий продукта: совместная работа, отчёты, интеграции, обучение или клиентская поддержка.
5. Блок Pricing превратите в тарифы, пакеты внедрения или варианты использования. Не указывайте цены, если они быстро меняются или обсуждаются индивидуально.
6. Вставьте ссылки на Support, Documentation, Blog или FAQ, если эти страницы реально существуют.
7. Откройте Modules и проверьте, что шапка, мобильное меню и footer выводят нужные пункты.
8. Сохраните layout и theme settings, затем откройте публичную страницу в новой вкладке.

Проверка результата

Проверяйте страницу не по ощущению «красиво», а по конкретным признакам:

• Первый экран объясняет продукт без необходимости читать весь сайт.
• Каждая кнопка ведёт на существующую страницу или блок.
• В разделе функций нет демо-фраз, которые не относятся к продукту.
• Мобильное меню открывается, закрывается и не скрывает CTA.
• Секции не конфликтуют по цвету: текст читается и на фиолетовых, и на светлых блоках.
• В блоке поддержки нет пустых ссылок на несуществующую документацию.

Нюанс, который часто мешает

На демо Flow много красивых декоративных секций и иллюстраций. Если просто заменить логотип и пару фраз, сайт останется витриной чужого продукта. Лучше удалить 20 процентов лишних блоков, чем публиковать страницу с несвязанными карточками. Сильная главная на Flow получается тогда, когда каждая секция отвечает на один вопрос посетителя.

Практичные идеи применения Flow в разных проектах

Flow особенно хорош там, где нужно объяснить цифровой продукт через последовательные блоки. Ниже не абстрактные «варианты использования», а рабочие сценарии, которые можно собрать из подтверждённых частей Flow: готовых страниц, page builder layouts, style variations, модульных позиций, меню, поддержки и блога.

Сайт SaaS-сервиса

Главная страница объясняет сервис, Features раскрывает функции, Pricing показывает планы или пакеты, Support ведёт к документации и контактам, Blog публикует новости и обучающие материалы. Из Flow здесь лучше всего взять hero, секции с интерфейсными иллюстрациями, тарифный блок и CTA. Проверка проста: пользователь должен за минуту понять, кому нужен сервис и куда нажать для следующего шага.

Лендинг программного продукта

Если продукт один, не нужно строить большой портал. Используйте Home как длинную страницу: hero, проблема, возможности, пример результата, блок доверия, FAQ и CTA. Страницу Pricing можно не создавать, если цена обсуждается через заявку. Важно не перегружать меню: оставьте якоря или короткие пункты, которые помогают двигаться по странице.

Документационный раздел для расширения Joomla

Flow можно использовать как вход в базу знаний: главная объясняет продукт, Support становится справочным центром, Blog или Index - разделом с инструкциями. Для повторяемых подсказок используйте modules в bottom или builder positions. Если сайт мультиязычный, заранее решите, будут ли статьи дублироваться по языкам или часть документации останется на одном языке.

Витрина агентства или команды разработки

Company и Portfolio помогают показать команду, подход, проекты и сильные стороны. В таком сценарии Flow не должен притворяться SaaS-сервисом: поменяйте продуктовые блоки на процесс работы, услуги, кейсы, контактную форму и раздел поддержки клиентов. Проверка результата - посетитель понимает, какую задачу можно поручить команде и как связаться.

Адаптивность, скорость и SEO-проверки после настройки

Flow визуально насыщен: крупные секции, фоны, изображения, карточки, кнопки, возможные слайдеры и видео. Это не проблема сама по себе, но такой шаблон нужно проверять после замены контента. У YOOtheme Pro есть device preview buttons в Customizer, а сама публичная страница должна дополнительно проверяться в браузере, потому что реальное поведение зависит от ваших текстов, изображений, модулей и кеша.

Адаптивность

Проверьте не только главную страницу, но и Features, Pricing, Support, Blog index и отдельную статью. Длинные русские заголовки могут занимать больше места, чем английские демо-фразы. CTA-кнопка может стать слишком широкой. Карточки тарифов могут получить разную высоту. В мобильной версии особенно важны:

• Hero-заголовок не должен перекрывать кнопку или изображение.
• Меню должно открываться в удобном режиме: dropdown, offcanvas или modal, если такой режим выбран в настройках.
• Секции с несколькими колонками должны складываться в понятном порядке.
• Изображения и иллюстрации не должны вытеснять текст за пределы экрана.
• Footer не должен превращаться в длинный набор пустых ссылок.

Скорость и изображения

Официальные материалы Flow подчёркивают наличие curated images, но на реальном сайте их нужно заменить, сжать и назвать по смыслу. Если оставить тяжёлые изображения без оптимизации, первый экран может выглядеть эффектно, но загружаться медленно. Для проверки используйте браузерные инструменты, серверный кеш, Joomla cache и тестовую загрузку с мобильного соединения. Не обещайте себе «SEO-оптимизацию» только потому, что шаблон красивый: скорость, структура заголовков, метаданные и содержимое страниц всё равно зависят от вас.

SEO и структура страниц

Flow помогает визуально подать продукт, но не заменяет контентную стратегию. Для каждой важной страницы проверьте:

• Один понятный основной заголовок страницы.
• Уникальные title и description в Joomla или в вашем SEO-инструменте.
• Логичную структуру H2/H3 внутри Page Builder.
• Alt-тексты у изображений, которые описывают смысл, а не дублируют название файла.
• Внутренние ссылки между функциями, тарифами, поддержкой и блогом.
• Отсутствие демо-текстов и пустых карточек.

Проверка результата: если отключить декоративные изображения, структура страницы всё равно должна объяснять продукт. Если без картинок смысл пропадает, нужно доработать текст и заголовки.

Конфиденциальность и внешние сервисы

YOOtheme Pro сам по себе не должен превращаться в источник лишних трекеров, но элементы сайта могут подключать YouTube, карты, шрифты, рассылки и другие внешние сервисы. В документации YOOtheme есть отдельный раздел про privacy and GDPR. Для практики это означает: проверьте, какие элементы Flow вы реально используете, включены ли видео, карты, формы подписки и сторонние скрипты, а также есть ли у сайта политика конфиденциальности.

Безопасные улучшения без правки ядра шаблона

Flow допускает аккуратные доработки, но их нужно делать так, чтобы обновление YOOtheme Pro не уничтожило ваши изменения. Не правьте файлы ядра шаблона ради цвета кнопки, отступа или подписи. Используйте настройки Customizer, custom code, child theme, language overrides или template overrides только там, где это действительно нужно.

Маленькая CSS-правка для CTA-кнопки

Если после перевода на русский основная кнопка в hero стала слишком широкой или выглядит тяжёлой, можно добавить небольшой CSS в безопасное место для пользовательского кода YOOtheme Pro или в child theme. Правка опирается на обычную структуру UIkit/YOOtheme: кнопки используют классы UIkit, а мы не трогаем PHP, шаблонные файлы и бизнес-логику.

.uk-button-primary {
  border-radius: 999px;
  padding-inline: 2rem;
  line-height: 1.25;
}

.uk-button-primary:focus-visible {
  outline: 3px solid rgba(255, 214, 77, 0.85);
  outline-offset: 3px;
}

Проверка: откройте главную страницу Flow, страницу Pricing и мобильную версию. Кнопки должны оставаться читаемыми, не обрезаться и получать заметный фокус при навигации с клавиатуры. Откат: удалите этот фрагмент из custom code или child theme и сохраните настройки заново.

Языковые переопределения для коротких системных строк

Если на сайте остаётся системная строка YOOtheme Pro или Joomla, которую нужно заменить, используйте Joomla Language Overrides. Документация YOOtheme указывает, что строки шаблона можно искать по константам TPL_YOOTHEME, а Joomla хранит overrides отдельно от исходных языковых файлов. Это безопаснее, чем редактировать языковой файл шаблона.

1. Откройте System → Language Overrides.
2. Выберите нужный язык сайта.
3. Создайте override для найденной строки.
4. Сохраните и очистите кеш, если изменение не видно сразу.
5. Проверьте страницу в публичной части и в нужной языковой версии.

Не используйте overrides как замену нормальному переводу контента. Они подходят для системных фраз, кнопок, служебных сообщений и коротких строк шаблона.

Когда нужен child theme или template override

Child theme и template overrides полезны, когда настройками и CSS уже нельзя решить задачу: нужно изменить вывод модуля, компонента или отдельного шаблонного файла. В документации YOOtheme для child themes указано, что template files можно переопределять в дочерней теме, а Joomla-документация предупреждает не менять файлы, поставляемые с шаблоном, потому что обновление может перезаписать изменения.

Практический критерий простой: если вы меняете только вид кнопки, используйте CSS. Если меняете текст, используйте language override. Если меняете HTML-структуру вывода, сначала проверьте, можно ли сделать это через настройки элемента или модуля. Только потом переходите к override и фиксируйте, что именно изменено, чтобы после обновления проверить совместимость.

Почему Flow может отображаться неправильно и как это диагностировать

Диагностика шаблона Joomla почти всегда начинается с вопроса: проблема в установке, назначении template style, page builder макете, модуле, кеше, правах или внешнем контенте? Если сразу править дизайн наугад, можно скрыть симптом, но не убрать причину.

После установки виден старый шаблон

Симптом

YOOtheme Pro установлен, но публичная страница продолжает открываться в старом оформлении.

Причина и проверка

Чаще всего template style Flow не назначен по умолчанию или конкретный пункт меню использует другой template style. Откройте Joomla Site Template Styles и проверьте default-звезду. Затем откройте пункт меню и проверьте поле template style.

Исправление

Назначьте нужный template style глобально или только на нужные пункты меню. После сохранения очистите кеш Joomla и кеш браузера. Если меняете только отдельную страницу, не трогайте глобальный default без необходимости.

Модуль опубликован, но его не видно

Симптом

Модуль включён в Joomla Module Manager, но не отображается на странице Flow.

Причина и проверка

Проверьте position, menu assignment, язык, access level и состояние публикации. Если модуль находится в sidebar, убедитесь, что страница не собрана полностью через Page Builder. Для builder-страниц может понадобиться Position element внутри макета.

Исправление

Опубликуйте модуль в подходящую позицию, назначьте его на нужные пункты меню и добавьте Position element, если вывод должен быть внутри builder-макета. Если модуль должен повторяться на разных языках, создайте языковые версии.

Изменения в Customizer не сохраняются

Симптом

Вы меняете стиль или макет, но после обновления страницы результат пропадает.

Причина и проверка

Проверьте, нажали ли вы Save, а не закрыли панель. Затем проверьте права пользователя, файловые разрешения, системные сообщения Joomla и наличие ошибок при компиляции стиля. Если несколько администраторов одновременно редактируют layout, YOOtheme Pro может предупредить о конфликте изменений.

Исправление

Сохраните изменения, повторите действие под пользователем с достаточными правами, проверьте файловые разрешения и не редактируйте один layout одновременно с другим автором. Если сбой связан с кастомным Less или CSS, временно отключите последний фрагмент.

Страница выглядит хорошо на desktop, но ломается на мобильном

Симптом

Hero-блок слишком высокий, кнопки переносятся некрасиво, карточки функций становятся разной высоты или меню закрывает контент.

Причина и проверка

Русские тексты длиннее демо-фраз, изображения имеют другой фокус, а mobile header может использовать неподходящий режим. Проверьте device preview в Customizer и затем реальный браузер.

Исправление

Сократите заголовки, задайте более аккуратные размеры изображений, проверьте порядок колонок, выберите подходящий offcanvas или modal для мобильного меню. Если правка касается кнопок, сначала используйте CSS, а не override.

После обновления исчезли доработки

Симптом

Сайт обновился, но часть кастомного вывода, стилей или шаблонных изменений пропала.

Причина и проверка

Вероятно, изменения были внесены в исходные файлы шаблона или расширения. Проверьте, где лежал изменённый файл: в ядре шаблона, child theme, папке overrides или custom code.

Исправление

Восстановите изменение из резервной копии и перенесите его в child theme, language override, template override или пользовательский CSS. После этого задокументируйте правку, чтобы проверять её после следующих обновлений.

Сайт стал медленнее после замены контента

Симптом

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

Причина и проверка

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

Исправление

Сожмите изображения, удалите неиспользуемые секции, включите релевантные кеш-настройки, проверьте видео и карты. Если используете сторонний оптимизатор, тестируйте его после каждого изменения, потому что минификация может конфликтовать с интерактивными элементами.

Ограничения и решения по совместимости

Flow не должен быть единственным источником истины для проекта. Он задаёт внешний вид и помогает собрать страницы, но совместимость сайта зависит от Joomla, YOOtheme Pro, установленных расширений, версии PHP, серверных настроек, кеша, модулей, overrides и контента. Поэтому любые важные изменения нужно проверять на тестовой копии.

Права редакторов

YOOtheme документация обращает внимание на permission Edit Templates: доступ к Customizer должен быть ограничен. Если редактору нужно только менять статьи, не давайте ему полный доступ к шаблонам. Иначе он сможет случайно изменить layout, цветовую схему или общие настройки сайта. Для контентной команды лучше настроить роли так, чтобы редакторы работали с материалами и модулями, а шаблон меняли администраторы.

Мультиязычный сайт

Flow можно использовать на мультиязычном Joomla-сайте, но важно понимать модель: дублируются статьи, пункты меню и модули, а для некоторых builder-настроек перевод может требовать отдельной работы в каждой языковой версии. YOOtheme указывает, что для multilingual footer лучше использовать builder modules в bottom, потому что footer builder как единый глобальный блок не всегда удобен для языковых вариантов.

Сторонние компоненты

Если сайт использует каталог, магазин, CRM-интеграцию или компонент заявок, не рассчитывайте, что Flow автоматически сделает каждую страницу идеальной. Для некоторых компонентов может понадобиться template override, отдельный template style или builder template с dynamic content. Если компонент критичен для бизнеса, проверьте его страницы до публикации: список, карточка, форма, поиск, пагинация, личный кабинет и сообщения об ошибках.

Обновления

YOOtheme Pro обновляется через Joomla update system при корректной настройке доступа к обновлениям. На production-сайте лучше держаться стабильной ветки, сначала тестировать обновление на копии, затем проверять Customizer, главную, блог, модули, мобильное меню, forms, карты, видео и кастомный CSS. Если есть child theme или overrides, список таких правок должен храниться рядом с документацией проекта.

Когда YOOtheme Flow будет удачным выбором

YOOtheme Flow стоит использовать, если вам нужен Joomla-шаблон для сайта программного продукта, технологической компании, SaaS-сервиса, документационного входа или команды разработки. Он особенно полезен, когда нужна не одна страница, а связанный набор: главная, функции, компания, тарифы, поддержка, блог и внутренние материалы.

Перед публикацией проверьте главное: шаблон установлен как нужный template style, макеты очищены от демо-контента, меню и модули назначены правильно, мобильная версия читаема, изображения оптимизированы, а доступ к Customizer ограничен. Если эти пункты закрыты, можно переходить к блоку загрузки и скачать установочный файл для дальнейшего тестирования на своём сайте.

Не оценивайте Flow только по первому экрану. Хороший результат появляется тогда, когда вы используете его как систему страниц и настроек: выбираете подходящий style variation, связываете template styles с пунктами меню, аккуратно выводите модули, проверяете результат на разных устройствах и документируете каждую нестандартную правку.