Coma Web Development разрабатывает сайты на WordPress c 2010 года. В блоге мы делимся некоторыми наблюдениями из жизни, советами и рекомендациями для тех, кто решит сделать сайт на WordPress самостоятельно.

ИИ в действии: опыт наших проектов с Cursor, Stitch и Claude

Мир веб-разработки развивается очень быстро, и ИИ начинает играть всё более важную роль в том, как мы проектируем, разрабатываем и поддерживаем сайты. В этой статье мы хотим поделиться нашим практическим опытом использования таких AI-инструментов, как Cursor, Stitch и Claude, и показать, как они помогли нам создавать современные, полностью функциональные сайты быстрее, чем когда-либо раньше.

Вместо того чтобы использовать AI по одному универсальному шаблону для всех проектов, мы подходили к каждому проекту по-разному — подбирая подходящую комбинацию инструментов в зависимости от сложности, целей и технических требований. От простой landing page до полноценной e-commerce платформы — эти примеры показывают, как AI может поддерживать разные этапы разработки в рамках наших услуг веб-разработки.

AI-инструменты для веб-разработки: Cursor, Stitch, Claude

Cursor — это AI-ассистент для программирования, созданный для того, чтобы помогать разработчикам эффективно писать, отлаживать и обновлять код. Он работает непосредственно внутри редактора и может генерировать frontend- и backend-код на разных языках программирования. Благодаря режиму Auto Mode Cursor способен создавать целые страницы и функции на основе высокоуровневых инструкций, значительно сокращая объём повторяющейся реализации и ускоряя цикл разработки.

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

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

При совместном использовании эти инструменты формируют гибкий рабочий процесс, охватывающий дизайн, разработку и системное проектирование. Вместо того чтобы двигаться шаг за шагом в рамках традиционного линейного процесса, мы можем быстрее развивать и дорабатывать идеи по ходу работы — гораздо плавнее переходя от концепции к реализации и используя AI там, где он приносит наибольшую пользу, будь то генерация UI, backend-логика или API-функциональность.

Помимо таких инструментов разработки, как Cursor, Stitch и Claude, мы также интегрируем AI непосредственно в создаваемые нами сайты и платформы, используя API вроде OpenAI в зависимости от требований проекта.

Примеры проектов: от простого сайта до крупных веб-платформ

Чтобы лучше понять, как AI вписывается в реальные процессы разработки, мы рассмотрели четыре проекта разного уровня сложности. В каждом из них использовалась своя комбинация инструментов — Cursor, Stitch, Claude и AI-интеграций — в зависимости от целей и технических требований.

ComaCloud: простой, быстрый и полностью AI-driven проект

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

Технологический стек был максимально простым: HTML, CSS и JavaScript. Дизайн создавался в Stitch, а кодирование выполнялось с помощью Auto Mode в Cursor.

ComaCloud

Результат: https://comacloud.lv/

Сроки: 2–3 дня от дизайна до запуска сайта

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

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

ProMusic: полноценная e-commerce платформа для аудиооборудования

Следующим стал более сложный проект для клиента, специализирующегося на продаже и аренде аудиооборудования. Изначальное решение представляло собой сайт на WordPress, однако оно не обеспечивало современный UX/UI и необходимую гибкость. Мы решили полностью перестроить платформу с нуля с помощью AI, придав ей современный внешний вид и полноценную функциональность.

ProMusic

Результат: https://promusic.lv/

Платформа была построена на backend с использованием Node.js и frontend на Next.js + TypeScript, образуя полноценную e-commerce систему.

Функции:

  • Платформа включает полнофункциональную административную панель, где товары, аренда и складские остатки могут удобно и интуитивно управляться.
  • Поддерживаются гибкие акции и скидки, позволяющие создавать промокоды и специальные предложения в любой момент.
  • Клиенты и сотрудники получают автоматические уведомления по email и Telegram о новых заказах и обновлениях.
  • Данные о товарах автоматически обновляются через ежедневный XML-импорт и синхронизацию с фидами поставщиков.
  • Сайт поддерживает несколько языков — латышский уже доступен, а в ближайшем будущем планируется добавление других языков.
  • Каждая страница товара обогащается с помощью OpenAI, автоматически генерируя подробные описания, характеристики и спецификации.
  • Для каждого товара автоматически подбираются релевантные YouTube-видео, помогая клиентам лучше понять, как продукты выглядят и работают в реальном использовании.
  • Во время оформления заказа система автоматически проверяет информацию о VAT и соответствующим образом изменяет обязательные поля.
  • Общий пользовательский опыт упрощён благодаря авторизации через Google, удобному оформлению заказа и понятному отслеживанию заказов.
  • Telegram-бот позволяет команде мгновенно получать новые заказы и обновлять их статус прямо из чата.
  • Ошибки отслеживаются через Sentry, а при их возникновении их можно быстро проанализировать и исправить с помощью Cursor с автоматическим деплоем через GitHub Actions.

ProMusic

Сроки: около двух недель интенсивной работы.

AI-интеграция позволила нам динамически обогащать страницы товаров, хотя некоторые детали пришлось дополнительно настраивать — AI иногда генерирует больше информации, чем необходимо, поэтому мы вручную адаптировали контент для улучшения пользовательского опыта.

Mājaslapu Serviss: переработка сервисного сайта с Claude

Мы также протестировали немного другой AI-подход при переработке сервисного сайта, который сами используем как часть экосистемы нашего агентства. Он ориентирован на техническое обслуживание WordPress-сайтов для компаний и агентств в Латвии, включая обновления, безопасность, резервное копирование и мониторинг по фиксированной ежемесячной стоимости.

Majaslapu Serviss

Результат: https://majaslapuserviss.lv/

В этом проекте вместо Cursor и Stitch мы использовали Claude Code вместе с Claude Design как для разработки, так и для принятия дизайнерских решений. Целью было полностью переосмыслить структуру, производительность и общий пользовательский опыт сайта.

В результате получилась современная и лёгкая платформа, созданная с упором на производительность и SEO:

  • Frontend построен на React как одностраничное приложение, основанное на компонентной архитектуре, с полноценной двуязычной маршрутизацией для пользователей на латышском и английском языках.
  • В проекте используется Vite в качестве инструмента сборки, компилирующего несколько страниц в оптимизированные production bundle с hashed assets для более эффективного кеширования и производительности.
  • Хостинг осуществляется через Cloudflare Workers и Assets, обеспечивая глобальную доставку контента с очень быстрым временем отклика и без cold start.
  • Дизайн-система полностью создана вручную на CSS с использованием переменных для единообразия, поддержкой тёмного и светлого режимов, а также различными настройками плотности интерфейса в зависимости от предпочтений пользователя.
  • Тщательно подобранные Google Fonts помогают формировать чистую и современную визуальную идентичность сайта.
  • Структурированные данные (JSON-LD) реализованы по всему сайту, улучшая отображение контента в поисковых системах с rich results.
  • На сайте реализован полноценный SEO-слой, включая настройку sitemap с языковыми альтернативами, корректные meta tags для публикации в социальных сетях и строгую конфигурацию безопасности.

Majaslapu Serviss

Этот проект показывает другой аспект применения AI в веб-разработке — не только ускорение написания кода, но и помощь в переосмыслении архитектуры, производительности и долгосрочной масштабируемости с самого основания проекта.

Lensfit: высокопроизводительная e-commerce платформа с AI и оптимизацией поиска

Ещё одним проектом, в котором мы ещё шире использовали возможности AI и инженерные решения, стала переработка e-commerce платформы для контактных линз.

Lensfit

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

Платформа была построена на стеке Next.js + TypeScript с сильным акцентом на производительность, поиск и надёжность.

  • Frontend реализован на новейшей архитектуре Next.js (App Router) и React, обеспечивая быстрый и отзывчивый пользовательский опыт по всему сайту.
  • Данные о товарах, заказы и аккаунты клиентов управляются через Prisma и базу данных PostgreSQL, обеспечивая стабильный и масштабируемый backend.
  • Контент — включая страницы и медиафайлы — управляется через Strapi, что позволяет гибко обновлять содержимое без необходимости вмешательства в основное приложение.
  • Поиск товаров работает на базе Meilisearch, обеспечивая быстрые результаты и устойчивость к опечаткам, а резервная система позволяет сохранять работоспособность поиска даже при недоступности сервиса.
  • OpenAI интегрирован непосредственно в платформу для реализации потоковой функции сравнения, позволяющей пользователям удобно и структурированно сравнивать различные контактные линзы.
  • Система оформления заказов включает автоматическую обработку email и генерацию корректных PDF-счётов с полной поддержкой латышского языка, включая диакритические символы.
  • Платформа имеет надёжную техническую основу, включая security headers, мониторинг ошибок через Sentry и санитизацию динамического контента для обеспечения стабильности и безопасности.
  • Структурированные данные и SEO-ориентированная архитектура реализованы по всему сайту, улучшая видимость в поисковых системах и поддерживая rich results.
  • Сайт поддерживает как латышский, так и английский язык, делая платформу доступной для более широкой аудитории.The website supports both Latvian and English, making it accessible to a broader audience.

Lensfit

Помимо разработки, мы также провели SEO-аудит, сравнив предыдущую WordPress-версию с новым решением на Node.js. Результаты подтвердили значительное улучшение производительности, структуры и общей готовности сайта к поисковому продвижению.

Этот проект показывает, как AI может сочетаться с современной архитектурой — не только ускоряя разработку, но и помогая создавать более интеллектуальные функции и более продвинутый пользовательский опыт.

Наш опыт: как AI изменил наш рабочий процесс

AI-инструменты способны кардинально изменить то, как мы подходим к веб-разработке. Они помогают:

  • Ускорять рабочие процессы: небольшие сайты вроде ComaCloud теперь можно запускать за несколько дней вместо недель.
  • Сокращать объём повторяющегося программирования: автоматизация позволяет разработчикам больше сосредоточиться на UX, дизайне и функциональности.
  • Повышать масштабируемость: даже сложные проекты могут выигрывать от AI-поддерживаемого контента, обработки данных и автоматических обновлений.
  • Открывать новые возможности: разработчики могут экспериментировать с AI для повышения качества и эффективности как в небольших, так и в крупных проектах.

Наш опыт показывает, что AI не заменяет разработчиков — это мощный инструмент-помощник, который способен ускорять разработку и повышать качество. Для небольших и средних проектов AI уже становится важной частью нашего рабочего процесса. Что касается более крупных проектов, мы уверены, что AI продолжит делать разработку быстрее, умнее и эффективнее.

Заключение

AI в веб-разработке — это уже не футуристическая концепция, а реальность, которая действительно работает. Такие инструменты, как Cursor, Stitch и Claude, помогают разработчикам работать быстрее, свободнее экспериментировать и сокращать время, затрачиваемое на повторяющиеся задачи, при этом сохраняя высокий уровень качества и производительности.

Наша работа над ComaCloud, ProMusic, Lensfit и Mājaslapu Serviss показывает, как AI может применяться в проектах самых разных типов — от простых сайтов до сложных платформ и высокопроизводительных решений. Хотя AI не заменяет экспертизу разработчиков, он открывает новые подходы к разработке и повышению эффективности. Если вы ищете команду, которая работает именно так, ознакомьтесь с нашими услугами по WordPress-разработке.


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


ИИ в WordPress: как сайты создаются, проектируются и расширяются с помощью искусственного интеллекта

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

То, что раньше требовало сложной настройки и координации нескольких инструментов и систем, теперь часто запускается гораздо быстрее, особенно на этапе начального планирования и прототипирования. Например, такие инструменты, как 10Web AI Website Builder, построенный на WordPress, могут генерировать первоначальную структуру сайта на основе описания, автоматически создавая страницы, макеты и базовый контент. Вместо того чтобы начинать с пустой установки WordPress, разработчики могут сразу работать со структурированной основой, которую затем дорабатывают, расширяют и адаптируют под конкретные задачи проекта.

10Web AI Website Builder

ИИ для написания кода в WordPress

В основе WordPress лежат PHP-файлы, структуры тем и система плагинов. Традиционно любое изменение или расширение требовало ручного написания или редактирования кода — иногда даже небольшие изменения требовали работы с несколькими файлами.

Теперь в эту область активно входят инструменты ИИ.

Claude

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

Инструменты вроде Telex особенно эффективны именно в экосистеме WordPress, поскольку они понимают блоки, темы и структуру платформы, а не генерируют общий код.

Помимо генерации кода, ИИ помогает анализировать уже существующий код. Темы и плагины WordPress часто содержат большие и сложные кодовые базы. Инструменты вроде Claude, Cursor или GitHub Copilot могут читать PHP-файлы, объяснять, как связаны разные части, и предлагать более безопасные способы изменения функциональности без поломки сайта. В разработке WordPress это обычно означает работу с файлами темы, кодом плагинов и структурами вроде хуков, фильтров и шаблонов. Разработчики могут вставить функцию, хук или файл шаблона и спросить, что он делает, как он взаимодействует с WordPress или как его можно расширить.

При работе с существующими кодовыми базами часто используются Cursor и GitHub Copilot, так как они интегрированы в среду разработки, тогда как Claude особенно полезен для более глубоких объяснений и понимания сложной логики.

Это делает работу с незнакомыми темами или сторонними плагинами гораздо проще, особенно если документация ограничена или неполная.

Плагины на базе ИИ: добавление функциональности без сложной настройки

Плагины — одно из главных преимуществ WordPress, позволяющее расширять функциональность без переписывания системы.

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

Например, плагины вроде Tidio или WPBot могут добавлять ИИ-чат-интерфейсы, которые отвечают на вопросы пользователей, помогают с навигацией или обеспечивают поддержку в реальном времени. Такие инструменты особенно полезны для клиентских сайтов, где важна быстрая коммуникация и автоматические ответы без дополнительной нагрузки на поддержку.

Tidio

Другие инструменты улучшают поиск и навигацию по контенту. Плагины вроде SearchWP и Algolia улучшают стандартный поиск WordPress, ориентируясь на намерение пользователя, а не только на совпадение ключевых слов. В результате они выдают более релевантные результаты, особенно на крупных или контентно насыщенных сайтах.

В то же время ИИ меняет и сам процесс разработки плагинов. Разработчики могут генерировать структуру плагина и базовую логику с помощью инструментов вроде Telex, которые понимают концепции WordPress, такие как блоки, хуки и архитектура тем. Запрос вроде «создать плагин, который сохраняет подписки на рассылку и отображает их в админ-панели» может создать структурированную основу — включая пользовательские типы записей, работу с базой данных или административный интерфейс — которую затем дорабатывают и интегрируют в проект.

Это упрощает разработку плагинов, ускоряет процесс и даёт больше пространства для экспериментов, облегчая разработку собственной функциональности в WordPress.

ИИ для дизайна и создания страниц

Дизайн сайтов WordPress традиционно означал работу с темами, конструкторами страниц и шаблонами. Инструменты вроде Elementor или Gutenberg сделали этот процесс проще, но всё ещё требовали много ручной работы.

ИИ начинает менять этот процесс. С помощью инструментов вроде Elementor AI или Divi AI можно описать страницу вместо того, чтобы собирать её блок за блоком. Например, запрос «создать главную страницу для digital-маркетингового агентства с hero-блоком, описанием услуг и отзывами» может сгенерировать структуру макета, текстовые предложения и варианты дизайна прямо внутри конструктора.

Elementor AI

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

Создание контента с помощью ИИ в WordPress

Одним из самых распространённых применений ИИ в WordPress является создание контента.

Вместо того чтобы писать каждый пост, описание продукта или страницу вручную, ИИ может генерировать черновики прямо в редакторе. Например, Jetpack AI Assistant позволяет ввести запрос «создать руководство для начинающих по SEO» и сразу получить структурированный текст внутри WordPress.

Jetpack AI

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

Генерация изображений также становится частью этого процесса. Инструменты вроде DALL·E, Gemini или Nano Banana могут создавать визуальные материалы — изображения для блогов, иллюстрации или featured images — на основе текстового описания. В некоторых случаях эти инструменты интегрированы прямо в процесс создания контента, что позволяет поддерживать единый визуальный стиль без внешних дизайнерских процессов.

Инструменты вроде Jetpack AI Assistant работают прямо внутри WordPress, а модели вроде Gemini или Nano Banana используются вне его для создания контента и визуальных материалов.

ИИ для оптимизации сайта и SEO

SEO в WordPress традиционно представляло собой комбинацию ручных действий и плагинов — написание метаописаний, структурирование заголовков, подбор ключевых слов и создание внутренних ссылок.

ИИ упрощает этот процесс, интегрируясь непосредственно в SEO-инструменты и процессы работы с контентом.

Плагины вроде Rank Math и Yoast SEO теперь используют ИИ для генерации рекомендаций. Вместо ручного написания метаданных их можно автоматически создавать на основе содержимого страницы с последующей корректировкой. Эти инструменты работают прямо в панели WordPress, делая SEO частью процесса создания контента, а не отдельной задачей.

Rank Math

Rank Math чаще выбирают за более автоматизированный подход, тогда как Yoast SEO остаётся популярным благодаря структурированному и пошаговому процессу оптимизации.

На практике эти инструменты часто используются вместе — сочетая автоматизацию с ручным контролем, чтобы сбалансировать скорость и точность.

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

Ещё один практический сценарий использования — генерация тем для статей. ИИ может анализировать поисковые тренды и существующий контент, предлагая новые статьи или страницы, которые соответствуют тому, что пользователи активно ищут. Это превращает SEO из статического чек-листа в более непрерывный, основанный на данных процесс.

Вместо того чтобы заменять SEO-инструменты, ИИ их дополняет — помогая командам работать быстрее, при этом сохраняя финальные решения за человеком в вопросах контента и структуры.

ИИ для обслуживания и мониторинга сайта

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

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

Инструменты безопасности, такие как Wordfence, анализируют трафик и попытки входа в систему, чтобы выявлять подозрительную активность, например многократные неудачные попытки авторизации или необычные паттерны доступа. Это делает их особенно важными для проектов, где безопасность играет ключевую роль. Будучи плагином безопасности WordPress, он работает непосредственно внутри CMS, отслеживая активность сайта в реальном времени как часть более широкой экосистемы WordPress. Хотя подобные функции существовали и раньше, системы с поддержкой ИИ улучшают обнаружение, распознавая более сложные закономерности, а не полагаясь только на заранее заданные правила.

Wordfence

Платформы для обслуживания, такие как ManageWP, помогают автоматизировать рутинные задачи — обновления, резервные копии и мониторинг доступности сайта. Хотя ManageWP само по себе не является ИИ-инструментом, его часто используют вместе с ИИ-ассистентами для анализа возникающих проблем — например, чтобы разобрать ошибки после обновления или определить причину падения производительности. Таким образом, ИИ дополняет существующие процессы управления, а не заменяет их.

Это не отменяет необходимость обслуживания, но делает его более проактивным — помогает командам быстрее обнаруживать и устранять проблемы, а не реагировать уже после того, как они стали критическими.

Практический набор ИИ-инструментов для WordPress-проектов

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

Один из распространённых подходов начинается с дизайна. Инструмент вроде Stitch можно использовать для генерации идей интерфейса и структуры страниц на основе простых описаний. Эти макеты ещё не связаны с WordPress, но дают чёткое визуальное и структурное направление. Затем проект переходит к разработке, где инструменты вроде Cursor используются для реализации этих макетов внутри WordPress-темы или кастомного решения, работая напрямую с файлами темы и кодом проекта, а не через интерфейс WordPress. В этом процессе ИИ сначала помогает определить, как должен выглядеть сайт, а затем помогает реализовать его с полным контролем над кодом.

Другой подход начинается прямо внутри WordPress. Инструменты вроде 10Web AI Website Builder, построенные на WordPress, могут сгенерировать базовую структуру сайта — страницы, макеты и начальный контент — на основе запроса. Это создаёт рабочую отправную точку, которую затем можно настраивать. После этого разработчики могут использовать Telex для расширения функциональности, создавая кастомные блоки или логику плагинов, которая напрямую интегрируется в архитектуру WordPress. В этом случае ИИ ускоряет начальную настройку и затем помогает в более глубокой кастомизации.

Ещё один, более ориентированный на разработку подход полностью сосредоточен на коде. Используя инструменты вроде Cursor вместе с моделями вроде Claude, разработчики могут создавать и дорабатывать темы и плагины WordPress на уровне кода, работая напрямую с PHP-файлами, шаблонами и логикой, а не через интерфейс WordPress. Этот подход делает акцент на контроле, где ИИ выступает скорее как помощник, а не как генератор готовых структур.

Во всех этих рабочих процессах инструменты вроде Jetpack AI Assistant, Rank Math и Wordfence используются в рамках дальнейшего обслуживания сайта — для работы с контентом, SEO-оптимизации и обеспечения безопасности.

Вместо единого «стека» в традиционном смысле эти инструменты представляют собой спектр подходов. Одни делают упор на скорость и автоматизацию, другие — на контроль и гибкость, а многие находятся между этими крайностями. На практике команды комбинируют их в зависимости от проекта, используя ИИ не как замену процесса разработки, а как набор инструментов, меняющих сам способ работы.

Если вам интересно увидеть это на практике, посмотрите наш разбор использования ИИ, где мы показываем несколько реальных проектов и то, как эти инструменты работают вместе.

Изменения внутри WordPress

То, что происходит в WordPress сегодня, — это не просто появление новых инструментов, а изменение самого подхода к созданию и управлению сайтами.

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

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

Если вы рассматриваете новый WordPress-проект, ознакомьтесь с нашими услугами веб-разработки.


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


Как мигрировать с Medium на WordPress

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

Шаг 1. Установка и настройка WordPress

В отличие от Medium, WordPress это самостоятельная платформа, где вы полностью управляете сайтом и контентом. Для начала вам понадобится домен и хостинг, после чего необходимо установить WordPress. Большинство современных хостинг-провайдеров предлагают автоматическую установку WordPress, что значительно упрощает процесс. После завершения установки и базовой настройки сайт будет готов к миграции контента.

Шаг 2. Экспорт контента с Medium

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

Прежде чем приступать, следует учитывать, что экспорт включает только сами публикации и изображения — подписчики, лайки (claps) и комментарии не могут быть перенесены на WordPress, так как эти данные являются частью внутренней системы Medium. Это значит, что после миграции на WordPress вы сохраните только контент статей, а аудиторию и вовлечённость придётся выстраивать заново.

Medium предоставляет встроенный инструмент для экспорта вашего контента. Чтобы воспользоваться им, зайдите в свой аккаунт Medium, нажмите на аватар в правом верхнем углу и перейдите в Settings → Security and apps.

WordPress

WordPress

Нажмите Download your information, после чего появится всплывающее окно. В этом окне нажмите кнопку Export, чтобы подтвердить запрос.

WordPress

Medium подготовит архив с HTML-версией всех ваших статей и медиафайлами, а когда архив будет готов, пришлёт ссылку на скачивание на ваш email. В зависимости от объёма контента это может занять некоторое время.

WordPress

Скачайте архив.

Экспорт Medium нельзя напрямую загрузить в самостоятельный WordPress-сайт, поэтому для переноса публикаций сначала необходимо привести данные в формат, который WordPress понимает.

Шаг 3. Подготовка данных Medium к импорту в WordPress

Сейчас, когда у вас есть экспорт Medium (HTML и медиафайлы), его нужно конвертировать в архив, совместимый с WordPress. Существует несколько подходов, каждый из которых имеет свои особенности и ограничения.

Вариант 1. Через Medium to WordPress Importer

Инструмент Medium to WordPress Importer позволяет конвертировать ваши статьи в файл, готовый для импорта в WordPress. Для этого достаточно ввести URL вашего профиля и, если у вас нет собственного доменного имени, загрузить архив экспорта. После этого сервис формирует файл, подготовленный для последующего импорта в WordPress.

WordPress

*Важно учитывать ограничения: Medium to WordPress Importer иногда не видит публикации, если они не привязаны к вашему собственному домену и находятся только на стандартном medium.com/@username. В таких случаях инструмент не сможет автоматически создать импортируемый файл, даже если статьи опубликованы.

Вариант 2. Через WordPress.com

Если автоматический инструмент не срабатывает, можно использовать WordPress.com как промежуточный шаг. Этот метод гарантированно работает даже для публикаций на стандартном профиле Medium.

Сначала создайте бесплатный сайт на WordPress.com и используйте опцию импорта из Medium на нём: Tools → Import → Medium.

WordPress

Нажмите на Run Importer и загрузите ZIP-файл, который вы скачали с Medium.

WordPress

Подтвердите импорт нажав кнопку Import.

WordPress

После завершения процесса вы увидите все свои публикации в вашем аккаунте WordPress.com — заголовки, текст и даже изображения.

Теперь вам надо получить файл экспорта, который можно загрузить на самостоятельный сайт WordPress. Для этого оставайтесь в панели управления WordPress.com и перейдите в раздел Tools → Export. На этой странице WordPress предложит выбрать, какие данные вы хотите выгрузить. Если вам нужны только статьи, перенесённые с Medium, достаточно выбрать вариант экспорта записей (Posts), не включая страницы и другие типы контента.

WordPress

После выбора типа данных нажмите кнопку загрузки файла экспорта. WordPress.com подготовит XML-файл и автоматически начнёт его скачивание. Этот файл обычно имеет имя вида WordPress-YYYY-MM-DD.xml. Внутри него содержится вся структура ваших публикаций: заголовки, текст, встроенные изображения, даты, а также служебная информация, необходимая WordPress для корректного импорта.

Полученный XML-файл полностью совместим с самостоятельной установкой WordPress и может быть использован для переноса всех ваших историй на основной сайт без необходимости ручного копирования контента.

Шаг 4. Импорт ваших статей на WordPress

После того как у вас есть готовый XML-файл (полученный либо через Medium to WordPress Importer, либо через WordPress.com), можно приступать к финальному импорту на самостоятельный сайт WordPress.

Зайдите в административную панель вашего сайта и перейдите в Tools → Import. В списке доступных импортёров выберите WordPress. Если импортёр ещё не установлен, WordPress предложит установить его автоматически. Для этого достаточно нажать кнопку Install Now, а затем Run Importer.

WordPress

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

WordPress

После запуска импорта WordPress начнёт создание записей на основе данных из XML-файла. В зависимости от количества публикаций процесс может занять некоторое время. По его завершении вы увидите подтверждение успешного импорта.

Импортированные статьи, как правило, появляются со статусом «Черновик». Это позволяет проверить корректность форматирования, ссылок и изображений перед публикацией. После проверки вы можете опубликовать записи или отредактировать их по своему усмотрению.

WordPress

Шаг 5. Импорт ваших изображений

При импорте из Medium в WordPress текст и изображения отображаются в постах, но файлы не загружаются в медиабиблиотеку вашего сайта. Это значит, что изображения будут видны внутри контента, но они всё ещё подгружаются с внешних серверов и не могут использоваться как featured image или управляться через медиабиблиотеку.

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

Два популярных варианта для такой задачи: Import External Images или Auto Upload Images. Установив один из этих плагинов, вы можете запустить массовый импорт всех изображений, и после этого они будут полностью «родными» для вашего сайта.

Миниатюры записей придётся установить отдельно. Для этого можно либо вручную открыть каждый пост и выбрать изображение из медиабиблиотеки как featured image, либо воспользоваться плагином, например Quick Featured Images, который позволяет массово назначать первую картинку из поста в качестве миниатюры.

Шаг 6. Настройка редиректов на свой домен

Если ваши публикации находились на стандартном профиле medium.com/@username, редиректы настроить нельзя — Medium не предоставляет такой возможности. Однако ваши публикации на Medium использовали собственный домен (например, blog.mydomain.com), вы можете настроить редиректы, чтобы старые ссылки автоматически перенаправлялись на новые страницы вашего WordPress-сайта. Для этого сначала соберите все адреса своих статей на Medium и сохраните их в текстовый файл. Затем настройте перенаправления на вашем новом сайте, чтобы каждая старая ссылка вела на соответствующую статью.

Заключение

После переноса статей и изображений ваш контент полностью готов к работе на WordPress. Вы сможете управлять всеми публикациями, назначать featured images, настраивать дизайн и расширять функциональность сайта, не ограничиваясь возможностями Medium. Этот процесс даёт полный контроль над вашим контентом и заложит основу для дальнейшего роста вашего блога или проекта.


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


Open Source выходит вперёд: знаковый момент для WordPress и открытого веба

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

Недавно этот рост достиг важного рубежа. Мэтт Малленвег, сооснователь WordPress и CEO Automattic, отметил, что, возможно, впервые решения с открытым исходным кодом (Open Source) стали преобладать среди 5 000 крупнейших сайтов мира. При этом сам WordPress используется примерно на 47 % этих сайтов — результат долгого и постепенного развития, а не внезапного всплеска популярности.

WordPress в масштабе

История WordPressво многом уникальна. Проект начинался как простой инструмент для блогов и со временем, шаг за шагом, иногда не без трудностей, превратился в самую распространённую платформу для публикации контента в мире.

Важно не только количество сайтов, но и где именно WordPress завоевал успех. В топ-5 000 крупнейших сайтов мира входят самые требовательные проекты: глобальные бренды, крупные медиа и высоконагруженные платформы со сложной архитектурой и процессами.

Эти организации выбирают WordPress не случайно. Его выбирают потому, что он работает в масштабе, потому что он гибок и потому что он не навязывает единственное «правильное» видение будущего от одного вендора.

Почему WordPress продолжает побеждать

Рост WordPress в верхнем сегменте веба объясняется несколькими принципами, которые остаются неизменными уже многие годы:

  • Право на владение. Люди хотят контролировать свой контент, свои данные и своё присутствие в интернете.
  • Гибкость важнее жёстких рамок. WordPress можно адаптировать под практически любой сценарий, а не подстраиваться под ограничения платформы.
  • Открытые экосистемы масштабируются лучше закрытых. Десятки тысяч разработчиков, агентств, хостинг-провайдеров и контрибьюторов вместе движутся быстрее любой отдельной компании.

Платформа продолжает эволюционировать — блоки, API, headless-подходы, улучшения производительности — но её базовая философия остаётся прежней. Именно эта последовательность позволяет WordPress расти, не теряя доверия.

Open Source как конкурентное преимущество

Открытый исходный код побеждает не вопреки рынку, а благодаря ему.

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

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

Рубеж, а не финал

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

Сегодня роль WordPress — не просто расти, а расти правильно: улучшать производительность, доступность и удобство использования, оставаясь верным идее, что публикация в интернете должна быть доступна каждому, у кого есть что сказать.

Этот момент принадлежит всем, кто вносил вклад: писал код, создавал сайты, переводил интерфейсы, обучал других или просто выбирал WordPress для своего проекта.

От идеи к реализации

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

Разница между сайтом на WordPress «просто существующим» и сайтом, который действительно работает, заключается в архитектуре, производительности, безопасности, редакционных процессах и долгосрочной масштабируемости — особенно по мере роста проекта.

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

В Coma мы помогаем компаниям превращать WordPress в надёжную основу — не только для запуска сегодня, но и для роста на годы вперёд.

Интернет движется именно в этом направлении.
Вопрос лишь в том, насколько хорошо вы к этому готовы.

Как добавить кнопки «Поделиться» в WordPress

Социальные кнопки — это простой и эффективный способ стимулировать ваших читателей делиться полезными материалами с друзьями и коллегами. Это увеличивает охват, помогает привлекать новую аудиторию и делает ваш контент более «живым». Добавить такие кнопки в WordPress совсем несложно. Ниже рассмотрим три самых популярных и приятных в настройке бесплатных плагина, которые позволяют легко добавить кнопки для всех основных социальных сетей и настроить их внешний вид, расположение и действия.

Sassy Social Share

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

После установки и активации плагина зайдите в Social Sassy Share в админ-панели WordPress. Настройки плагина удобно распределены по вкладкам, каждая из которых отвечает за отдельный аспект работы кнопок. Давайте пройдёмся по ним шаг за шагом.

WordPress

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

Во вкладке Standard Interface настраиваются кнопки, которые появляются внутри статьи. Здесь вы включаете отображение кнопок и выбираете, для какой страницы будет работать шаринг: текущей статьи, главной страницы или произвольного URL. Также можно указать заголовок, который будет использоваться при шаринге. Далее вы выбираете, какие социальные сети показывать, и можете изменить порядок иконок. Кнопки можно разместить в начале или в конце статьи, а при помощи подобных шорткодов [Sassy_Social_Share_Premium id="1"] вставлять их в нужные места на странице. Плагин также позволяет настроить выравнивание, всплывающие окна, отображение счётчиков и кнопку «Ещё», если необходимо.

WordPress

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

Во вкладке Miscellaneous собраны дополнительные функции, такие как кэширование счётчиков, использование коротких ссылок и Bit.ly, пользовательский текст для шаринга с плейсхолдерами ({post_title}, {site_url}, {post_url}), e-mail шаринг, поддержка AMP, возможность загружать JavaScript только при необходимости и добавлять собственный CSS. Здесь также можно настроить отображение кнопки Pinterest при наведении на изображения.

Во вкладке Shortcode & Widget находятся ссылки на официальную документацию, где показано, как использовать шорткоды для кнопок шаринга, Follow-иконок и Click-to-Tweet с примерами кода и оформления.

Во вкладке Troubleshooter находятся ссылки на инструменты для проверки работы шаринга в Facebook и LinkedIn, которые помогают выявлять и устранять проблемы с отображением заголовков, изображений и описаний.

WordPress

AddToAny Share Buttons

AddToAny Share Buttons — лёгкий и простой плагин. После активации на сайте сразу появляются стандартные кнопки шаринга, которые можно редактировать, изменять, добавлять новые социальные сети или удалять ненужные, чтобы полностью настроить кнопки под свои нужды. Все эти настройки доступны через админ-панель по пути Settings → AddToAny. Здесь есть вкладки Standard и Floating, где можно выбрать внешний вид кнопок и их поведение.

WordPress

В разделе Icon Style задаются размер и стиль иконок, можно выбрать оригинальные цвета фона и логотипа. В списке Share Buttons отмечаются социальные сети, которые вы хотите показать, а кнопки можно добавлять или удалять через опцию Add/Remove Services. Также есть универсальная кнопка Universal Button, которая отображается как один элемент и при клике раскрывает список всех выбранных социальных сетей для шаринга.

В настройках Sharing Header и Placement можно указать, где отображать кнопки: внизу статей, на главной странице, в архивах, в лентах, на страницах, медиа и других списках. Для более гибкого размещения можно использовать виджеты или плавающую панель, а продвинутые варианты описаны в FAQ плагина.

Дополнительно есть поля для добавления Additional JavaScript и Additional CSS, чтобы немного кастомизировать поведение или стиль кнопок. Минимальный набор настроек и удобный интерфейс делают плагин подходящим для сайтов, где важны простота и скорость, при этом кнопки автоматически отображаются над и под содержимым статьи.

WordPress

Social Share Icons & Social Share Buttons

Social Share Icons & Social Share Buttons позволяет легко добавить красивые кнопки «Поделиться» на ваш сайт, делая их заметными и стильными. После установки и активации плагина в админ-панели открывается приветственный экран, где предлагается ответить на несколько простых вопросов, чтобы быстро настроить отображение и поведение кнопок, при этом все настройки плагина доступны в разделе Ultimate Social Media админ‑панели.

WordPress

Основные настройки делятся на несколько блоков:

Which icons do you want to show on your site? — вы выбираете социальные сети, которые будут отображаться: Facebook, X (Twitter), LinkedIn, Pinterest, WhatsApp, Telegram, Email, RSS и другие.

What do you want the icons to do? — для каждой иконки можно задать действие: делиться постом, открывать профиль, подписываться на обновления или отправлять письмо. Email-иконка может работать через сервис подписки, а Facebook и X позволяют лайкать, делиться и подписываться прямо с сайта.

Where shall they be displayed? — кнопки можно показывать внутри статьи (вверху, внизу или оба варианта), на главной странице, в архивах, использовать плавающую панель, виджеты, шорткоды или вставку в шаблон. Можно настроить адаптивное поведение и выравнивание иконок, чтобы они органично смотрелись на сайте.

What design and animation do you want to give your icons? — здесь настраивается внешний вид иконок: цвет, форма, размер, анимация при наведении, эффекты появления и увеличения, чтобы кнопки привлекали внимание, не отвлекая пользователей.

Do you want to display “counts” next to your main icons? — можно показывать количество лайков и репостов рядом с иконками, что повышает доверие и стимулирует пользователей к действию.

Any other wishes for your main icons? — настройка порядка, размера и интервала между иконками, а также выравнивание в зависимости от темы или шорткода. Премиум-версия позволяет управлять вертикальным расстоянием и отдельными настройками для мобильных устройств.

Do you want to display a pop-up, asking people to subscribe? — можно настроить всплывающие окна с призывом поделиться или подписаться, задать текст, шрифт, цвет, размер и место отображения.

Do you want to show a subscription form (increases sign ups)? — встроенная форма подписки на email позволяет максимально увеличить количество подписчиков. Форма может быть размещена через виджет, шорткод или прямой HTML-код, а дизайн и текст полностью настраиваются.

Get advice for more shares & traffic (FREE!) — при желании можно обратиться в форум поддержки, чтобы получить рекомендации по оптимальному размещению кнопок для максимального числа шарингов и подписок.

В целом, Social Share Icons & Social Share Buttons предлагает простую базовую настройку для быстрого добавления кнопок и гибкие возможности: анимации, стильные иконки, мобильная оптимизация, расширенные действия для соцсетей и продвинутый контроль над размещением.

WordPress

Итог

Использование плагинов позволяет быстро и безопасно добавить социальные кнопки на сайт без ручного кода. С помощью Sassy Social Share, AddToAny Share Buttons и Ultimate Social Media PLUS вы можете настроить кнопки под стиль сайта, выбрать соцсети, порядок иконок и способ отображения, а также воспользоваться дополнительными функциями вроде плавающих панелей и счетчиков шарингов. Все три решения бесплатные и подходят как для начинающих, так и для опытных пользователей WordPress.


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


Как создать многошаговую форму в WordPress

Заполнение длинной формы может казаться утомительным. Когда посетители видят слишком много полей на одном экране, они чаще всего покидают форму, не заполнив её полностью. Разделяя форму на секции, вы позволяете пользователям концентрироваться по шагам. Это повышает вовлечённость и снижает утомляемость при заполнении формы. Если вы думаете, как настроить это в WordPress — не волнуйтесь, это не так сложно, как кажется. Мы покажем, как это можно сделать с помощью WPForms.

Шаг 1: Установите плагин для многошаговых форм

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

WPForms предлагает множество способов создания многошаговых форм. Можно использовать поле Page Break, чтобы разделить форму на страницы, или Lead Forms Addon для пошагового отображения по одному вопросу за раз. Также можно воспользоваться AI Form Builder для автоматического создания формы. Обратите внимание, что все эти способы доступны только в Pro-версии WPForms.

Если WPForms ещё не установлен, необходимо сначала установить и активировать Pro-версию через админ-панель WordPress. После установки можно приступать к созданию многошаговой формы.

Шаг 2: Создание новой формы и добавление полей

В админ-панели WordPress перейдите в WPForms → Add New для создания новой формы.

WordPress

Задайте имя формы, например «WordPress Multi Step Form».

Можно начать с пустой формы (Blank Form) или выбрать шаблон, например Simple Contact Form, чтобы быстрее начать работу.

WordPress

Слева отображается список доступных полей, которые можно добавлять в форму. Справа — редактируемый предварительный просмотр, где можно перетаскивать поля.

WordPress

Пример полей для сбора информации о пользователе:

  • Название компании — поле Single Line Text
  • Веб-сайт — поле Website/URL из раздела Fancy Fields
  • Отрасль — поле Checkbox с вариантами: IT, Производство, Розничная торговля, Здравоохранение
  • Страна/Регион — поле Dropdown с выбором стран
  • Как узнали о нас? — поле Dropdown с источниками (Google, Facebook, LinkedIn)

Любое поле можно редактировать или добавить новое. Основная цель — собрать именно ту информацию, которая необходима.

После добавления всех полей форма готова к разделению на шаги. Вот тут-то и начинается самое интересное.

Шаг 3: Разделение формы на несколько частей

Теперь, когда форма готова, пришло время разделить её на более мелкие части, и WPForms делает этот процесс достаточно простым. Существует несколько способов сделать это, в зависимости от того, чего вы хотите достичь.

Если необходимо разбить форму на разделы с индикатором прогресса и кнопками «Назад/Вперед», следует использовать поле Page Break. Этот способ чаще всего подходит для длинных форм, где пользователям важно видеть, насколько они продвинулись.

Если же цель — создавать формы, где задаётся по одному вопросу за раз, стоит обратить внимание на дополнение Lead Forms Addon. Оно особенно удобно для мобильных устройств и позволяет создать более сфокусированное оформление.

Наконец, всю многошаговую форму можно создать с помощью AI form builder. Не нужно сразу выбирать один метод — доступны все варианты, и можно выбрать тот, который лучше всего подходит для вашей формы.

Метод 1: Добавление поля Page Break

После того как все поля формы добавлены и настроены, нужно добавить поле Page Break в форму. Каждый раз, когда добавляется Page Break, форма разделяется, и создаётся новая страница.

Чтобы начать разделение формы, перетащите поле «Page Break», которое находится в разделе Fancy Fields, с левой панели на правую панель. Убедитесь, что оно расположено именно там, где должно произойти первое разделение. Обычно полезно продумать последовательность вопросов перед добавлением разрыва, чтобы избежать путаницы впоследствии.

Совет: используйте логические разделы для «Page Break» для интуитивного и удобного пользовательского опыта. Например, группируйте личную информацию на одной странице, предпочтения на другой, а детальные вопросы на последней странице, чтобы не перегружать пользователей.

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

WordPress

После того как шаги установлены, можно настроить визуальное отображение индикатора прогресса.

Настройка индикатора прогресса многостраничной формы

Когда кто-то начинает заполнять длинную форму, полезно показать пользователю, насколько далеко он продвинулся. Используя индикатор прогресса, можно сообщить пользователю о различных разделах формы. Так пользователь всегда знает, на каком этапе он находится и сколько осталось заполнить до нажатия кнопки «Submit».

WPForms предоставляет три различных стиля индикатора прогресса для многошаговых форм:

  • Connectors: показывает соединительную полосу и названия страниц каждого раздела формы.
  • Circles: показывает по одному кругу и название страницы для каждой страницы формы.
  • Progress Bar: показывает прогресс заполнения формы по мере прохождения пользователем шагов.

Для настройки индикатора прогресса и заголовка первой страницы многошаговой формы нажмите на секцию разрыва страницы First Page. В панели предварительного просмотра появится новая панель, где можно:

  • Выбрать тип индикатора прогресса.
  • Изменить цвет индикатора страницы через инструмент выбора цвета.
  • Изменить заголовок страницы, чтобы пользователи знали, на какой части формы они находятся, если выбран вариант Circles или Connectors.

WordPress

Совет: индикатор прогресса с чёткими метками существенно снижает вероятность того, что пользователь бросит заполнение формы, и задаёт правильные ожидания с самого начала. Используйте его разумно!

Настройка заголовка и текста кнопки следующей страницы

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

WordPress

Также можно включить функцию отображения кнопки Previous Page, чтобы пользователи могли вернуться на предыдущую страницу формы при необходимости.

WordPress

После выполнения всех настроек разрывов страниц необходимо сохранить изменения, нажав Save.

Метод 2: Использование Lead Forms Addon

Хотя поле «Page Break» подходит для большинства многошаговых форм, иногда необходимо более сфокусированное решение, особенно если цель — собирать лиды по одному вопросу за раз. В этом случае полезен Lead Forms Addon. Он позволяет пошагово вести пользователя через короткие, сфокусированные шаги, как викторину или быструю регистрацию.

Для начала перейдите в панель управления WordPress, затем WPForms » Addons. В строке поиска введите «Lead Forms». Когда аддон появится, нажмите Install Addon, затем Activate.

WordPress

Включение режима Lead Form

После установки и активации Lead Forms Addon откройте форму, с которой работаете. Перейдите на вкладку Settings в конструкторе форм, затем выберите Lead Forms в меню. Появится опция Enable Lead Form Mode. Включите её.

WordPress

После этого появится сообщение о том, что макет формы изменится. Это нормально. Просто подтвердите, чтобы продолжить.

WordPress

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

WordPress

После настройки формы можно изменить её внешний вид на сайте. Это одно из преимуществ использования Lead Forms Addon.

Настройка внешнего вида Lead Form

В настройках Lead Forms доступно несколько параметров для изменения дизайна. Все изменения сразу отображаются на фронтенде, поэтому форма выглядит более аккуратно и профессионально, без необходимости писать код. Вы можете управлять следующими элементами:

  • Form Title — можно добавить собственный заголовок в верхней части формы, чтобы пользователям было сразу понятно, для чего она предназначена.
  • Accent Colour — этот параметр изменяет внешний вид кнопок, линии прогресса и иконок. Встроенный выбор цвета позволяет легко подобрать оттенок под стиль сайта.
  • Scroll Animation — при включении этой опции после нажатия кнопки «Next» пользователь автоматически прокручивается к верхней части формы. Это особенно полезно на длинных страницах, где форма может находиться ниже первого экрана.

WordPress

Форма Lead Form может быть дополнительно настроена с помощью расширенных параметров оформления. Для доступа к ним необходимо активировать Advanced Style Settings.

Чтобы визуально отделить Lead Form от остальных элементов страницы, вы также можете включить опцию Form Container, которая оборачивает форму в отдельный контейнер.

WordPress

Метод 3: Создание формы с помощью ИИ

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

Для начала перейдите в админ-панели WordPress в раздел WPForms » Add New и наведите курсор на фиолетовую кнопку Generate With AI. Затем нажмите Generate Form, чтобы открыть AI-конструктор форм.

WordPress

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

WordPress

После ввода запроса, например: “Create a multistep lead generation form with fields for name, email, company, country, product interest”, инструмент в течение нескольких секунд автоматически создаст форму. Важно отметить, что поля не добавляются в виде одного длинного списка. Если в запросе указано несколько тематических блоков, AI автоматически использует Page Break, чтобы разделить форму на логические шаги.

Готовую форму можно сразу просмотреть в интерфейсе. Если результат вас устраивает, нажмите Use This Form, после чего форма загрузится в конструктор. Здесь вы сможете вносить изменения, переставлять поля, менять порядок шагов и редактировать заголовки разделов.

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

После внесения всех правок обязательно нажмите Save, чтобы сохранить изменения.

Шаг 4: Настройка уведомлений и подтверждений

Следующий важный шаг — настройка уведомлений и сообщений подтверждения для многошаговой формы. Для начала перейдите к пункту Notifications на вкладке Settings в левой части конструктора форм.

WordPress

Здесь вы можете отредактировать стандартные параметры уведомлений, например изменить тему письма или адреса получателей, если это необходимо.

WordPress

Если вы используете Smart Tags, вы также можете настроить отправку уведомления на email пользователя после отправки формы. Таким образом пользователь будет проинформирован, что форма успешно отправлена и с ним свяжутся в ближайшее время.

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

WordPress

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

WordPress

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

Шаг 5: Добавление многошаговой формы на сайт WordPress

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

Наиболее распространённый вариант — вставка формы на страницу или запись. Чтобы начать, нажмите кнопку Embed в верхней части конструктора форм.

WordPress

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

WordPress

Затем выберите название страницы, на которой будет встроена форма, и нажмите кнопку Let’s Go. Сразу откроется редактор блоков WordPress, а многошаговая форма будет уже встроена.

WordPress

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

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

Для быстрого изменения стиля формы можно выбрать готовую тему в разделе Form Theme. В этом примере используется тема Frost.

WordPress

Можно попробовать и другие темы — вариантов много. Если хочется экспериментировать напрямую, можно также вручную настраивать отдельные элементы формы более точно.

Когда все настройки готовы, нажмите Publish, и многошаговая форма WordPress будет опубликована!

Ниже показано, как форма выглядит на сайте после публикации.

WordPress

Источник: https://wpforms.com/how-to-create-a-multi-part-form-in-wordpress/


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


Как отключить автоматические уведомления об обновлениях по e-mail

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

Об автоматических обновлениях в WordPress

WordPress это программное обеспечение типа open source, которое постоянно развивается благодаря большому сообществу разработчиков. Система регулярно обновляется, чтобы исправить уязвимости в безопасности, устранить баги и добавить новые функции.

WordPress

Вот почему вам всегда нужно пользоваться последней версией WordPress – чтобы убедиться, что ваш сайт безопасен для использования и идет в ногу со временем.

По умолчанию WordPress автоматически устанавливает минорные (небольшие) обновления безопасности, а с недавних версий можно включить автообновления тем и плагинов прямо в админке. После обновления сайт отправляет администратору уведомление по e-mail — о том, что обновление прошло успешно или произошла ошибка.

Если вы не хотите получать эти уведомления, их можно отключить несколькими способами.

Способ 1. Отключаем уведомления с помощью плагина

Самый простой путь — использовать плагин, который управляет уведомлениями. Отлично с этим справляется Manage Notification E-mails. После этого в админке появится раздел Settings → Notification e-mails, где можно выбрать, какие письма WordPress будет отправлять, а какие отключить. Например, вы можете отключить уведомления об успешных автоматических обновлениях ядра, плагинов и тем. При этом письма об ошибках обновлений всегда будут отправляться администраторам, чтобы вы не пропустили возможные проблемы.

WordPress

Для централизованного управления обновлениями и уведомлениями удобно использовать Easy Updates Manager. После установки в меню появится раздел Dashboard → Update Options, где можно:

  • включать или отключать автообновления для ядра, тем и плагинов;
  • выбрать, какие уведомления будут приходить на e-mail;
  • полностью отключить отправку писем после автоматических обновлений.

WordPress

Способ 2. Отключаем уведомления с помощью кода

Если вы предпочитаете не устанавливать лишние плагины, можно воспользоваться простым фрагментом кода. Добавьте его в файл functions.php вашей темы или в сниппет через плагин вроде Code Snippets:

add_filter( 'auto_core_update_send_email', 'wpb_stop_auto_update_emails', 10, 4 );
function wpb_stop_auto_update_emails( $send, $type, $core_update, $result ) {
    if ( ! empty( $type ) && $type == 'success' ) {
        return false;
    }
    return true;
}

Этот код отключит письма об успешных обновлениях ядра WordPress, но оставит уведомления об ошибках, чтобы вы не пропустили важные проблемы.

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


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


Как настроить email-подписку на сайте WordPress с помощью MailPoet

Email-подписка — отличный способ удержать внимание читателей и возвращать их на сайт каждый раз, когда появляются новые публикации. Существует много решений для email-подписок: Jetpack, Newsletter, FluentCRM и другие. В этой статье мы используем MailPoet. Он позволяет создавать формы подписки, управлять списками читателей и автоматически рассылать обновления.

Настройка MailPoet

После установки и активации плагина MailPoet, WordPress предложит пройти короткую настройку — нажмите Begin Setup и выполните три шага мастера.

WordPress

Укажите отправителя писем — имя и адрес электронной почты, от которого будут приходить письма подписчикам. Подтвердите настройки конфиденциальности и данных. Подключите ваш MailPoet-аккаунт — нажмите Connect MailPoet — это создаст или свяжет ваш сайт с сервисом MailPoet, обеспечивая надежную доставку писем во входящие, а не в спам. На бесплатном тарифе можно отправлять письма ограниченному числу подписчиков, при необходимости тариф можно расширить позже.

WordPress

Регистрация занимает всего пару минут и включает несколько шагов: указание адреса электронной почты, имени сайта и подтверждение учетной записи. На последнем шаге вам нужно активировать выбранный тариф, вставив предоставленный API-ключ в форму мастера настройки в WordPress. После этого следуйте инструкциям по настройке службы отправки MailPoet, чтобы письма доставлялись во входящие, а не в спам.

WordPress

WordPress

После успешного подключения аккаунта вы увидите сообщение MailPoet account connected. Нажмите Start using MailPoet, чтобы сразу перейти к панели управления плагином.

Создание формы подписки

Создайте форму подписки через MailPoet → Forms → Add New Form. При создании формы можно выбрать готовый шаблон из библиотеки MailPoet или создать форму с нуля. Готовый шаблон уже содержит поле для email и кнопку «Подписаться», его можно редактировать с помощью drag-and-drop редактора, изменяя текст, цвета, кнопки и другие элементы. Если вы создаёте форму с нуля, добавляйте блоки вручную — поле для email, кнопку отправки, текстовые блоки и изображения, оформляя форму в соответствии с дизайном сайта.

WordPress

После настройки формы в редакторе MailPoet выберите список рассылки и другие параметры в сайдбаре настроек, например: имя формы, список получателей, сообщение после отправки, стили и размещение формы.

WordPress

В разделе Form Placement можно выбрать разные варианты отображения формы, например, поп-ап, slide-in или под страницей. В этом случае форма будет автоматически показываться в выбранной позиции на сайте.

WordPress

Если вы хотите использовать форму через шорткод, например, вставить её в виджет сайдбара или Gutenberg-блок, необходимо выбрать вариант Others (widget). Только тогда при редактировании формы появится шорткод, например [mailpoet_form id=”1″], который можно скопировать и вставить в нужное место на сайте.

WordPress

Для виджетов сайдбара используйте блок Shortcode или Custom HTML, вставив скопированный шорткод формы. Для Gutenberg-страниц просто добавьте блок MailPoet Form или вставьте шорткод напрямую.

Настройка автоматических писем о новых публикациях

В MailPoet можно создавать несколько типов писем: одиночные рассылки, автоматические уведомления о новых публикациях, приветственные письма для новых подписчиков и т.д. В этой статье мы будем использовать автоматическое письмо с уведомлением о последних публикациях (Latest Post Notifications). Для уведомления подписчиков о новых статьях сайта выберите этот тип письма (MailPoet → Emails → New Email → Latest Post Notifications).

WordPress

После того как вы выбрали создание нового автоматического письма, первым делом появится окно с вопросом “When to send this post notification email?” — здесь нужно указать, как часто MailPoet будет проверять новые публикации и отправлять письма. Например, можно выбрать Once a day at 12:00 am или Immediately after a new post is published. После выбора частоты нажмите Next.

Затем откроется экран выбора шаблона.

WordPress

Выберите подходящий вариант и отредактируйте его в удобном drag-and-drop-редакторе: добавьте логотип, изображения, кнопки, измените цвета и текст, чтобы письмо выглядело в стиле вашего сайта. После завершения редактирования нажмите Next.

На последнем шаге настройте параметры рассылки: укажите список получателей (Send to), частоту отправки (Select a frequency), имя и адрес отправителя (Sender). Если адрес не авторизован, нажмите Authorize it now. Здесь же можно задать параметры аналитики (Google Analytics Campaign) и адрес для ответов (Reply-to).

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

Заключение

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


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520


23 полезных трюкa как ускорить свой сайт на WordPress

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

1. Выбирайте хороший хостинг

Выбор хостинга является, пожалуй, главным критерием успешности вашего сайта. Если у вас паршивый хостинг, то что бы вы не делали, это не поможет вам ускорить ваш сайт. Рекомендуем выбирать хостинги с поддержкой PHP 8+, HTTPS, SSD и встроенного кэширования. Мы советуем вам для начала попробовать SiteGround – этот хостинг находится в списке официально рекомендуемых WordPress’ом и известен высоким качеством предоставляемых услуг. Если финансы позволяют, то можете попробовать WPEngine, который может помочь с настройкой WordPress.

2. Пользуйтесь плагинами кэширования

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

Этот процесс может замедлить работу вашего сайта, когда несколько пользователей смотрят одну и ту же страницу. Решение проблемы это плагин кэширования. Вместо генерирования каждой страницы налету, плагин кэширования будет демонстрировать вашему пользователю кэшированную версию страницы. Мы рекомендуем WP Super Cache, WP Rocket или LiteSpeed Cache в качестве такого плагина.

3. Пользуйтесь CDN

Многие файлы на вашем сайте являются статичными: изображения, CSS и JavaScript. Эти файлы обычно не меняются. Однако когда браузер загружает вашу страницу, эти файлы могут помешать его отображению другим пользователям. CDN или content delivery networks решают эту проблему, предоставляя ваши файлы со своих серверов. Это освобождает место на сервере, делает сайт быстрее и улучшает опыт использования.

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

4. Оптимизируйте изображения

Изображения являются самым притягательным видом контента в Сети. Вам надо убедиться, что все изображения, которые у вас есть в WordPress грамотно оптимизированы для Сети. Большинство графических редакторов позволяют вам сохранять такого рода изображения без особой потери в качестве.

Советуем использовать современные форматы изображений, такие как WebP и AVIF. Они позволяют значительно уменьшить размер файла при сохранении высокого качества. Плагины вроде ShortPixel и Imagify могут автоматически оптимизировать все изображения на сайте, экономя ваш трафик и ускоряя загрузку страниц.

5. Пользуйтесь оптимизированными шаблонами

Подбирая шаблон для своего сайта, обратите особое внимание на его оптимизацию. Магазины премиум-шаблонов вроде StudioPress и Themify  предлагают шаблоны, которые не только отлично выполнены, но еще и оптимизированы для их быстрой работы. Лёгкие и хорошо оптимизированные темы обеспечивают быстрый рендер страниц. Рекомендуемые варианты: GeneratePress, Kadence, Astra.

6. Выбирайте быстрые слайдеры

Слайдеры могут замедлять сайт, особенно если они тяжёлые и используют много JavaScript. Для минимальной нагрузки лучше использовать блоки Gutenberg для слайдеров или лёгкие плагины, такие как Smart Slider 3, которые оптимизированы по скорости.

7. Используйте выдержки на главной странице и в архивах

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

Использование выдержек не только ускоряет сайт, но и стимулирует пользователей переходить на полные статьи, повышая вовлечённость и время нахождения на сайте.

WordPress

8. Делите длиннопосты на страницы

Если вы выкладываете большие статьи с огромным количеством изображений, лучше разбивайте их на несколько страниц. Причем у WordPress имеется для этого встроенная возможность. Просто добавьте тег <!--nextpage--> в том месте, где хотели бы перенести текст на следующую страницу.

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

WordPress

9. Разбейте комментарии на страницы

Некоторые ваши посты соберут больше комментариев, чем другие. Если вы показываете все комментарии на одной странице, это увеличивает время загрузки. В WordPress есть встроенное решение и для этой проблемы. Просто зайдите в Settings → Discussion и отметьте ячейку Break comments into pages.

WordPress

Разбиение комментариев также делает страницы более удобными для пользователей, позволяя быстрее находить интересующие ответы.

10. Избавляйтесь от неиспользуемых плагинов

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

11. Обновляйте свой сайт

WordPress это регулярно обновляемый проект, обновления которого исправляют проблемы безопасности, убирают баги и добавляют новые возможности. Все плагины и шаблоны также регулярно обновляются. Будучи владельцем сайта, ваша обязанность держать сайт в форме. Игнорирование этого пункта сделает ресурс медленным и ненадежным. Также это повышает его уязвимость и увеличивает риск угроз безопасности. Регулярные обновления позволяют использовать новые функции и улучшения производительности, которые делают сайт быстрее и удобнее для пользователей.

12. Не загружайте видео на WordPress

WordPress

Вы можете напрямую загружать видео на свой сайт WordPress и это автоматически отобразит их в плеере HTML5, но вам НИКОГДА не стоит этого делать. Размещение роликов будет стоить вам трафик и может раздуть размер ваших бэкапов, что усложнит восстановление сайта в случае непредвиденных обстоятельств. Лучше пользуйтесь специальными сервисами для хранения видео вроде Youtube, Vimeo, или облачными платформами вроде Cloudflare Stream, которые обеспечивают высокую скорость воспроизведения и не нагружают сервер.

13. Понизьте внешние запросы HTTP

WordPress

Многие плагины и шаблоны WordPress загружают скрипты и изображения из внешних ресурсов, таких как библиотеки Google, Facebook SDK, сервисы аналитики и другие. Использование таких внешних ресурсов часто ускоряет отображение контента, потому что они загружаются с быстрых серверов, оптимизированных для доставки. Однако если ваш сайт делает слишком много таких запросов, это может замедлить работу, особенно для посетителей с медленным интернетом. В таких случаях полезно хранить на своём сайте те файлы, которые нужны для того, чтобы страницы быстро отображались: например, шрифты сайта, важные скрипты для меню, слайдеров, галерей или других видимых элементов. Для остальных файлов можно продолжать использовать внешние ресурсы, особенно если это библиотеки и сервисы, которые редко меняются.

14. Уменьшите вызовы баз данных

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

Пример старого кода в шаблоне:

<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

Здесь WordPress динамически вставляет тип страницы и кодировку текста. Но на практике почти всегда это будет text/html; charset=UTF-8.

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

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Так вы немного ускорите загрузку страниц, при этом функциональность сайта останется такой же.

*Если вы используете актуальные темы, большинство из них уже оптимизировано и таких лишних обращений почти нет. Этот трюк полезен, если вы работаете со старой или сильно кастомизированной темой.

15. Оптимизируйте базу данных WordPress

Попользовавшись WordPress какое-то время, в вашей базе данных накопится много информации, которая вам скорее всего уже больше не понадобится. Это можно легко исправить при помощи плагина WP-Sweep или WP-Optimize, который позволяет почистить базу данных, удаляя лишнюю информацию, очищая ревизии постов, спам-комментарии и временные данные. Регулярная очистка базы данных ускоряет сайт и уменьшает размер бэкапов.

16. Ограничьте повторные редакции постов

Повторные редакции постов занимают место в вашей базе данных WordPress. Некоторые пользователи полагают, что они также могут влиять на запросы баз данных, которые отправляют плагины. Вы можете ограничить кол-во повторных редакций, просто добавив следующую строку кода в файл wp-config.php

define( ‘WP_POST_REVISIONS’, 4 );

Этот код ограничит количество сохраняемых редакций до четырех и автоматически удалит более старые редакции, что снижает нагрузку на базу данных и ускоряет работу сайта.

17. Отключите хотлинкинг и личинг вашего контента

Некоторые сайты, занимающиеся воровством контента, автоматически создают посты с RSS фидов других WordPress сайтов. Поэтому мы советуем показывать только выдержки в RSS фидах. Однако есть сайты, где вручную копируется контент с вашего ресурса. Вместо прямой загрузки на свой сервер они показывают его через ваш сайт, а это уже влияет на скорость работы вашего сайта. Чтобы сторонние сайты не загружали ваши изображения напрямую, используйте правила в .htaccess или настройку через CDN:

#disable hotlinking of images with forbidden or custom image option
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com [NC]
RewriteRule \.(jpg|jpeg|png|gif)$ – [NC,F,L]

18. Пользуйтесь более быстрым плагином галерей

WordPress

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

Можно также использовать встроенные блоки Gutenberg, которые позволяют создавать галереи без лишнего JavaScript, минимизируя нагрузку на сайт и ускоряя его работу.

19. Используйте ленивую загрузку (Lazy Loading)

WordPress по умолчанию лениво подгружает изображения, то есть они загружаются только тогда, когда пользователь доскроллит до них, что ускоряет открытие страниц. Однако для видео, iframe и некоторых галерей, которые не используют встроенную ленивую загрузку, стоит подключить специальные плагины, например a3 Lazy Load или WP Rocket. Такой подход снижает нагрузку на сервер, ускоряет первую видимую загрузку страницы и делает сайт более комфортным для посетителей.

20. Оптимизируйте шрифты

Шрифты могут значительно замедлять загрузку страниц, особенно если они загружаются с внешних сервисов, вроде Google Fonts. Оптимизация шрифтов включает локальное хранение, объединение нескольких стилей в один файл и использование только нужных начертаний — то есть только тех вариантов шрифта, которые реально нужны, например обычный, жирный или курсив. Это ускоряет рендер текста, делая сайт более отзывчивым и удобным для чтения.

21. Минимизируйте и объединяйте CSS и JavaScript

Множество отдельных CSS и JS-файлов увеличивает количество запросов к серверу и замедляет загрузку страниц. Минификация и объединение файлов позволяют уменьшить размер и количество запросов. Плагины вроде Autoptimize или функции WP Rocket могут автоматически объединять и сжимать скрипты и стили, ускоряя загрузку страниц и делая сайт более плавным для пользователя.

22. Контролируйте блоки Gutenberg и сторонние скрипты

Редактор блоков WordPress (Gutenberg) предоставляет широкие возможности, но лишние блоки могут создавать ненужную нагрузку на сайт и замедлять его загрузку. Убедитесь, что используете только необходимые блоки, чтобы сайт работал быстрее.

Отдельные скрипты плагинов (CSS и JavaScript) также могут замедлять страницы, особенно если они загружаются на всех страницах, где не нужны. Чтобы уменьшить нагрузку, подключайте скрипты выборочно — только на тех страницах, где они реально используются. Для этого удобно использовать плагины Asset CleanUp или Perfmatters, которые позволяют выбрать, где загружать каждый скрипт.

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

23. Следите за Core Web Vitals

Показатели Core Web Vitals – это метрики скорости и интерактивности страниц, которые Google учитывает при ранжировании. Сюда входят: время загрузки основного контента, задержка взаимодействия и стабильность визуального контента. Используйте плагины для анализа и оптимизации, исправляйте большие блоки CSS/JS, оптимизируйте изображения и шрифты. Улучшение этих показателей делает сайт быстрее, удобнее и повышает позиции в поисковой выдаче.

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


Наша специальность — разработка и поддержка сайтов на WordPress. Контакты для бесплатной консультации — [email protected], +371 29394520