Перейти к содержанию

Готовые шаблоны на UIkit 3 и темы для Joomla 6

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

Два продукта, один фреймворк

Статический шаблон, если сайт меняется редко. Тема для Joomla 6, если тексты и страницы вы правите сами.

HTML и UIkit 3

Статические шаблоны на UIkit 3

HTML, CSS и UIkit 3 без сервера и базы данных. Для лендинга, визитки, промо-страницы.

  • Скорость. Страница отдаётся готовым файлом: тормозить нечему, взламывать нечего.
  • Поиск. Семантическая разметка, Schema.org и Open Graph уже на месте.
  • Доступность. Работа с клавиатуры, видимый фокус, контраст текста по WCAG 2.2, уровень AA.
Смотреть шаблоны
GNU GPL v2

Темы для Joomla 6

Тот же UIkit 3, но внутри CMS: страницы правятся из панели управления, вёрстка при этом не ломается.

  • Готовая интеграция. Макеты материалов, категорий, меток, контактов и меню переписаны под UIkit — Bootstrap в выводе нет.
  • Позиции модулей. От панели над шапкой до трёх колонок подвала; модули встают в сетку UIkit.
  • Адаптивность. Мобильное меню на off-canvas, изображения в WebP нужного размера для каждого экрана.
Смотреть темы

Темы для Joomla 6

Joomla 6 из коробки выводит разметку под Bootstrap 5. Подключить к ней UIkit — полдела: материалы, меню и модули по-прежнему выйдут с чужими классами. Поэтому в моей теме макеты вывода переписаны, и Joomla отдаёт страницу сразу в разметке UIkit 3.

Тема
wmarka 3.0.0
Совместимость
Joomla 5 и 6, PHP 8.3 и выше
Переписанные макеты
Материалы, главная, категории, архив, метки, контакты, меню; модули материалов, входа и подвала
Изображения
Обрезка и WebP через библиотеку JUImage
Для поисковиков
Open Graph и Schema.org формируются автоматически
Лицензия
GNU GPL v2 или новее

Тема включает файлы шаблона, документацию на русском и английском и примеры использования компонентов UIkit в модулях Joomla.

  • toolbar
  • navbar-left
  • navbar-center
  • navbar-right, iconnav
  • breadcrumb
  • block-a
  • block-b
  • материал: com_content
  • footer-left
  • footer-center
  • footer-right
offcanvas-menu
Каркас внутренней страницы в index.php темы wmarka. Наведите на позицию или перейдите к ней клавишей Tab — появится подсказка.

Код можно проверить до покупки

Мои шаблоны собраны на UIkit 3, и код лежит в открытом репозитории. Откройте его прямо сейчас: структура файлов, переписанные макеты, работа с изображениями и микроразметкой видны до первого платежа.

Открыть репозиторий на GitHub
bsakhanov / wmarka
открытый
Корень репозитория bsakhanov/wmarka
cssUIkit и пользовательский user.css
fontsшрифты, подмножества woff2
htmlпереписанные макеты вывода Joomla
imagesфавиконки сайта
jsUIkit и наборы иконок
languageru-RU и en-GB
partialшапка, панель инструментов, подвал
phpпомощник шаблона и SEO-разметка
index.phpкаркас страницы
joomla.asset.jsonподключение стилей и скриптов
templateDetails.xmlманифест и позиции модулей
readme.mdдокументация на русском и английском

Это работает на UIkit 3

Блоки ниже — не картинки, а живые компоненты. У каждого можно открыть разметку и документацию.

Шаблоны

Разметка: Slider

    Частые вопросы

    Разметка

    Мой стек

    Разметка

    HTML5

    Семантика: заголовки, списки, ориентиры для скринридера.

    CSS3

    Переменные в одном месте, свои классы с префиксом tm-.

    JavaScript

    Только там, где UIkit своего компонента не даёт.

    UIkit 3

    Сетка, компоненты, анимации — без самописных замен.

    Joomla 6

    Переписанные макеты, позиции модулей, ассеты через joomla.asset.json.

    PHP 8.3

    Помощники шаблона, микроразметка, сценарии установки.

    Разработка под ключ на UIkit 3

    Беру проект целиком: от задачи до работающего сайта и инструкции к нему. Сайты делаю больше 15 лет, в том числе для корпоративных заказчиков.

    Как я работаю

    1. 1

      Техническое задание

      Договариваемся о задаче, сроках и цене. Всё записываю в ТЗ.

    2. 2

      Прототип

      Собираю структуру страниц: блоки, тексты, переходы. Правка здесь стоит дешевле всего.

    3. 3

      Вёрстка на UIkit

      Верстаю на компонентах UIkit 3, не изобретая заново то, что во фреймворке уже есть.

    4. 4

      Тестирование

      Проверяю в браузерах и на телефонах, меряю скорость, контраст и работу с клавиатуры.

    5. 5

      Сдача

      Передаю сайт, исходники и инструкцию. Код остаётся у вас.

    Работы и заказчики

    Joomla 6, веб-мастер

    TAMGARD PARTNERS

    Сайт B2B-компании, которая ведёт промышленные закупки и проекты в Китае.

    tamgard.kz

    Статика, 3 языка

    ehp.kz

    Производственные экологи из Темиртау: сайт на казахском, русском и английском.

    ehp.kz

    С запуска, шаблон мой

    bestnews.kz

    Новостной портал с рубриками, фотолентой и матч-центром КХЛ.

    bestnews.kz

    Студия, 2015

    АО «Самрук-Энерго»

    Корпоративный портал энергетического холдинга.

    Кейс

    Среди заказчиков студии Webmarka — АО «Самрук-Энерго», АО «Ремлокомотив», ТОО «USM Astana», СЭЗ «Оңтүстік», Kazakhstan Geology Forum, Центр дерматологии Астаны, колледжи и детские сады столицы.

    Кейсы студии
    Заказчики студии
    Отзывы
    Обсудить проект

    Новости Joomla, ИИ и SEO

    Все новости

    Обо мне

    Бейбит Саханов в Астане

    Раньше у меня была студия, теперь работаю один. Вы говорите прямо с тем, кто пишет код: без менеджеров и пересказа задачи через третьи руки. Мой стандарт — UIkit 3, мой код — на GitHub.

    • Удалённо, Астана
    • Больше 15 лет в вёрстке
    • Без посредников
    Подробнее обо мне и моих работах

    Обсудим проект

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