Как сделать сайт своими рукамиПредставляю новый проект MaxSite Plus. Это набор дополнительных блоков, модулей, примеров для Albireo CMS и шаблона MF с использованием Berry CSS.
Основная задача — это собрать воедино все многочисленные наработки, которые у меня накопились за несколько лет. На сайте вы найдёте готовые блоки и примеры верстки, потом отдельные примеры для AlpineJS, мой онлайн-генератор «HTML to image (PNG)», а также несколько полезных ссылок.
Идея создать нечто подобное у меня появилась много лет назад и, даже были не очень удачные попытки её реализации. Примерно 5 лет назад я уже серьёзно начал делать подобный сайт, но столкнулся с техническими и организационными проблемами. Поэтому я разделил задачи на блоки Berry CSS и блоки для Store шаблона MF (для MaxSite CMS).
Именно поэтому в MF так много блоков.
Сейчас, когда я сосредоточен на Albireo CMS, я уже не хочу делать специализированный инструмент: вместо этого мне нужен универсальный, который будет основываться на классах Berry CSS, а в качестве основной библиотеки будет выступать AlpineJS. То есть MaxSite Plus имеет самое широкое применение.
Теперь «блоки для Berry CSS» будут на MaxSite Plus. Постепенно я буду переносить и другие примеры с сайта Berry CSS на MaxSite Plus, чтобы избежать дублирования. Так будет проще поддерживать все примеры в актуальном состоянии.
Пока я сосредоточен на базовых блоках (grid, flex), но постепенно буду добавлять и другие блоки. Часть блоков будет добавлена из MF, чтобы пользователи Albireo CMS также могли ими воспользоваться.
Что касается пользователей MaxSite CMS, то шаблон Default также основан на Berry CSS и старой версии MF (12-й), поэтому могут быть нюансы по вёрстке. Во всех случаях нужно использовать последнюю версию Berry CSS (сейчас это 5.5).
MaxSite Plus работает на Albireo CMS в «стандартном варианте». Предпросмотр блоков написан на довольно сложном JavaScript, с чем мне помогал Gemini 3.5 Flash. В общем-то предпросмотр блоков одна из «фишек» проекта. Там есть выбор Light/Dark-режима, а также доступны все входящие в Albireo CMS цветовые профили. Можно менять ширину блока, чтобы смотреть поведение блока при разной ширине браузера.
«HTML to image (PNG)» — это достаточно специфичный инструмент, но его оценят те, кто умеет верстать. На выходе можно получить png-изображение создаваемого html-блока. После чего файл можно сохранить и использовать, например как изображение записи своего блога. Для тех, кто не силён в вёрстке, есть несколько готовых примеров (templates).
Конечно MaxSite Plus больше направлен на тех, кто ориентируется в Berry CSS, но я постарался сделать так, чтобы и неподготовленный пользователь также мог получить готовый код «в слепую». Все блоки рабочие, поэтому их можно просто скопировать и использовать на своём сайте. Нужно будет только добавить свои тексты.
MaxSite Plus — это «живой» проект, который будет часто меняться, поэтому пока я рассматриваю его как начальную версию. 😎