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

Основы элемента Inspect Element

Oct 31, 2025/by Vadim Pavlovich

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

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

Что такое Inspect Element или Developer Tools

Современные браузеры вроде Google Chrome, Mozilla Firefox, Edge и Safari имеют встроенные инструменты, которые позволяют веб-разработчикам отслеживать ошибки и редактировать элементы. Эти инструменты показывают HTML, CSS и код JavaScript, а также то, как браузер работает с этим кодом. С помощью этих инструментов вы можете посмотреть как ваш сайт будет выглядеть после ваших коррекций, при этом не внося изменения в сам сайт.

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

В этой статье мы рассмотрим его работу в Google Chrome, поскольку это наш любимый браузер.

Запуск инспектора и поиск кода

Вы можете запустить Инспектор кода с помощью сочетания клавиш Ctrl + Shift + I. В качестве альтернативы можете щелкнуть по любому месту страницы и выбрать его из меню браузера.

Ваш браузер поделится на два окна, в нижнем из которых будет отображен исходный код. Код разработчика также поделен на два окна. Слева вы видите HTML, а справа – правила CSS.

Слева вы видите HTML, а справа – правила CSS

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

Выбранная область

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

Редактирование и отладка кода в Inspect Element

Оба окна в Инспекторе редактируемы. Вы можете дважды щелкнуть в любом месте и редактировать код.

Вы также можете дважды щелкнуть и редактировать любые атрибуты и стили в окне CSS. Чтобы добавить свое правило щелкните по иконке с плюсиком или просто чуть ниже последнего правила.

Как только вы внесете изменения в код, эти изменения мгновенно отобразятся в браузере. Но помните, что после обновления страницы (refresh или F5) все изменения, который вы сделали через Inspect Element исчезнут.

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

Легко находите ошибки у себя на сайте

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

Например, если вы являетесь пользователем OptinMonster, который удивляется почему его optin не загружается, то вы можете с легкостью найти ошибку «your page slug does not match”. Если ваш sharebar не работал корректно, то вы можете заметить, что там есть ошибка JavaScript. Инструменты вроде Inspect Element и SupportAlly помогут вам получить более эффективную поддержку. Любая служба поддержки, куда вы будете обращаться с вашими вопросами, ценит клиентов, которые проявляют инициативу и предоставляют максимум деталей о проблеме.

И это лишь малая часть того, что можно сделать с таким мощным инструментом как Inspect Element. DevTools включают вкладки и инструменты, такие как Lighthouse для проверки производительности, SEO и Core Web Vitals, а также средства анализа сетевых запросов (Network) и профилирования производительности (Performance). Эти возможности помогают выявлять узкие места в скорости и структуре сайта, делая его быстрее и удобнее для пользователей.

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

Как настроить push-уведомления на сайте WordPress

Oct 31, 2025/by Vadim Pavlovich

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

Зачем вообще нужны уведомления?

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

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

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

Настройка уведомлений с помощью OneSignal

OneSignal — это один из самых удобных сервисов для веб-уведомлений с бесплатным базовым планом. Он поддерживает различные устройства и браузеры, такие как Chrome, Safari, Firefox, Edge, Opera и другие, благодаря чему охватывает практически всю аудиторию. Сервис позволяет показывать окна подписки, автоматически уведомлять о новых публикациях и отслеживать взаимодействие пользователей, предоставляя полноценную систему уведомлений без лишних хлопот.

Шаг 1. Создаём приложение в OneSignal

Начать стоит с регистрации в OneSignal. После регистрации вам предложат создать своё первое приложение.

Введите любое название — оно будет видно только вам. Сразу после этого откроется стартовый экран с предложением выбрать, какие каналы вы хотите использовать. Здесь нас интересуют web push-уведомления, поэтому открываем пункт Push notifications.

OneSignal спросит, для какой платформы вы хотите настроить уведомления. Выберите Web.

Затем появится экран с тремя вариантами подключения. Первый подходит для обычных сайтов, второй — для WordPress и других CMS, а третий — для ручной интеграции через код. Поскольку мы настраиваем уведомления именно для WordPress, выбираем WordPress Plugin or Website Builder Integration. После этого откроется список поддерживаемых платформ — найдите там WordPress и нажмите на него.

Теперь перед вами появится большая форма настройки сайта. Она содержит все параметры, которые впоследствии будет использовать плагин, поэтому заполняем всё аккуратно. Укажите название сайта так, как оно должно отображаться в OneSignal, затем введите полный адрес сайта — важно перепроверить, используется ли в адресе приставка www, потому что OneSignal учитывает это как отдельный домен.

Чуть ниже находится блок с иконками уведомлений. Здесь вы можете указать изображение, которое будет использоваться в самих уведомлениях. Стоит выбрать чёткую квадратную иконку размером 256×256 пикселей, чтобы она корректно выглядела во всех браузерах. Нажмите Select image, чтобы выбрать файл или загрузить новую картинку. Рядом есть отдельное поле Upload or input a URL, куда можно вставить ссылку на изображение, если оно уже размещено в интернете. Если загрузить иконку через интерфейс OneSignal, сервис сам разместит файл на своих серверах — это снизит нагрузку на ваш хостинг.

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

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

В конце расположены дополнительные настройки: поведение уведомлений при клике, параметры сервис-воркера, опции для Safari и webhook’и. Эти поля можно не трогать — они предназначены для более тонкой настройки, которая нужна лишь в особых случаях.

Когда все параметры вас устраивают, сохраните изменения. После сохранения OneSignal сгенерирует App ID и API Key, которые вам понадобятся на следующем этапе (их можно будет позже получить в настройках приложения OneSignal, но для удобства и чтобы не терять время рекомендуем сразу их скопировать и сохранить в безопасном месте).

Шаг 2. Установка и настройка плагина OneSignal в WordPress

Теперь можно перейти в админку WordPress. Установите OneSignal Web Push Notifications. После активации в меню появится новая страница настроек OneSignal. Откройте её — и вы увидите поля App ID, API Key и параметры отображения уведомлений.

Просто скопируйте значения из OneSignal и вставьте их в соответствующие строки плагина. Сохраните изменения — и сайт будет связан с вашим приложением.

На этом всё: система уведомлений полностью готова.

Как проверить, что уведомления работают

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

После клика подсказка исчезнет. Иногда кажется, будто «ничего не произошло», но на самом деле браузер в этот момент уже зарегистрировал устройство и отправил данные в OneSignal. Чтобы убедиться, что всё прошло успешно, зайдите в свой аккаунт OneSignal и откройте раздел Audience → Users. Здесь появится новый пользователь — с уникальным ID, статусом подписки и данными о браузере. Это знак, что ваш сайт успешно подключился, и уведомления готовы к работе.

Теперь можно перейти к самой интересной части — тестов. Откройте список приложений и выберите своё.

Затем нажмите кнопку создания нового сообщения — New Message, и в выпадающем списке выберите New Push. OneSignal предложит несколько вариантов начала работы: пустой шаблон, AI-генерацию или готовые дизайны. Выберите подходящий — и перед вами появится знакомая панель редактора уведомлений, где можно задать заголовок, текст и ссылку, по которой попадёт пользователь после клика. Превью обновляется в реальном времени, так что вы сразу увидите, каким будет уведомление.

Чтобы отправить тестовое сообщение, переключитесь на вкладку Test & Preview.

OneSignal предложит выбрать подписчиков, которым отправить тест. Если вы ещё ни разу не добавляли тестовые устройства, вместо списка появится сообщение «You have 0 test subscriptions for the selected platforms» — в этом случае нажмите Add Test Subscriptions.

Откроется отдельная вкладка в вашем браузере — Audience → Test Subscriptions, где снова есть кнопка Add Test Subscriptions.

Нажмите её, и откроется раздел Audience → Subscriptions — именно здесь отображаются все устройства, которые уже подписались на уведомления с вашего сайта. Справа от нужной записи щёлкните по трём точкам и выберите Add as Test Subscriptions.

Появится всплывающее окно, где нужно ввести имя для тестовой подписки.

После того как вы введёте имя и нажмёте Add, появится уведомление о том, что тестовая подписка успешно добавлена. Теперь можно вернуться на вкладку с Test & Preview и нажать Refresh Test Subscriptions list. После этого тестовая подписка появится в Audience → Test Subscriptions и вы сможете использовать её для отправки тестового уведомления — просто отметьте её и нажмите Send Test Push.

Через несколько секунд браузер покажет уведомление. Время появления зависит от того, как быстро сам браузер обрабатывает push-сообщения, но обычно задержка минимальна. Кликните по уведомлению — оно должно открыть ту ссылку, которую вы указали в настройках. OneSignal при этом зафиксирует факт доставки и взаимодействия, и вы сможете увидеть эти данные прямо в панели управления (Delivery → Sent Messages).

Как отправлять уведомления в WordPress с помощью OneSignal

После того как вы подключили сайт и протестировали подписку, можно переходить к обычной работе. Плагин OneSignal в WordPress умеет автоматически отправлять уведомления каждый раз, когда вы публикуете новый пост. Чтобы эта функция работала, в настройках плагина нужно включить опцию Automatically send notifications when a post is published. Теперь достаточно нажать «Опубликовать», и плагин сам пошлёт сообщение всем подписчикам — никаких дополнительных действий не требуется.

Но если вам нужно больше контроля, можно отправлять уведомления вручную прямо из панели OneSignal. Для этого снова зайдите в свой аккаунт и выберите приложение. В левом меню нажмите Create… → Push.

После этого откроется страница Messages → Push. В правом верхнем углу будет кнопка New Push, которая открывает окно создания нового push-уведомления.

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

OneSignal также позволяет очень гибко управлять доставкой.

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

WordPress

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

WordPress

После того как всё заполнено, нажмите Review and Send. Появится всплывающее окно Review Your Message, где можно ещё раз проверить все настройки.

Если всё выглядит корректно, нажмите Send Message — уведомление будет отправлено выбранной аудитории.

Итог

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

Как добавить свои администраторские уведомления в WordPress

Oct 30, 2025/by Vadim Pavlovich

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

Зачем и когда нужно использовать уведомления?

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

Способ 1. Добавляем свои уведомления вручную

Этот способ требует от вас добавлять код на сайт WordPress. Вам нужно вставить следующий кусок в файл functions.php вашей темы или в индивидуальный плагин:

function general_admin_notice() {
    global $pagenow;

    if ( $pagenow === 'options-general.php' ) {
        echo '
        <div class="notice notice-warning is-dismissible">
            <p>This notice appears on the settings page.</p>
        </div>
        ';
    }
}
add_action('admin_notices', 'general_admin_notice');

Этот код отображает уведомление на странице настроек. Так будут выглядеть ваши уведомления в админке:

Если вы изучите код, то заметите, что у нас есть переменная $pagenow, которая обнаруживает текущую страницу. После этого мы добавили условие, которое проверяет подходит ли страница для отображения уведомления. Если подходит, то мы показываем уведомление, упакованное в элемент <div> с классами интерфейса админки WordPress. Доступны классы: notice-error, notice-warning, notice-success, notice-info. А класс is-dismissible добавляет кнопку закрытия уведомления.

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

function author_admin_notice() {
    global $pagenow;

    if ( $pagenow === 'index.php' ) {
        $user = wp_get_current_user();

        if ( in_array( 'author', (array) $user->roles, true ) ) {
            echo '
            <div class="notice notice-info is-dismissible">
                <p>Click on <a href="edit.php">Posts</a> to start writing.</p>
            </div>
            ';
        }
    }
}
add_action('admin_notices', 'author_admin_notice');

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

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

Способ 2. Добавляем уведомления с помощью плагина

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

После установки и активации плагина в админке появится новое меню Custom Admin Interface → Admin Notices, где можно создавать и настраивать уведомления для любых пользователей и разделов. Вы увидите нечто вроде редактора постов.

WordPress

В поле Notice Content вы указываете текст уведомления. Здесь можно использовать специальные теги вроде [CURRENT_YEAR], [WEBSITE_TITLE], [WEBSITE_TAGLINE], [WEBSITE_URL], [ADMIN_EMAIL_ADDRESS], а также теги, связанные с пользователем: [USER_FIRST_NAME], [USER_LAST_NAME], [USER_NICKNAME] и [USER_EMAIL]. Можно добавлять медиа, визуальные элементы или код.

Далее можно выбрать цвет уведомления через Admin Notice Color и настроить дату окончания действия через Admin Notice End Date в формате YYYY-MM-DD. При желании уведомление можно сделать dismissable, чтобы пользователи могли его закрывать. Также есть возможность исключений: уведомление показывается всем пользователям, кроме тех, кого вы добавите в раздел Add an exception case. После внесения всех настроек нужно нажать Save All Settings, чтобы уведомление стало активным.

Помимо возможности добавлять собственные уведомления, WP Custom Admin Interface предлагает широкий спектр возможностей, таких как персонализировать меню, добавлять собственные виджеты, упрощать интерфейс для авторов или клиентов и управлять доступом к разделам админки.

Как показать количество пользователей, зарегистрированных на сайте?

Oct 25, 2025/by Vadim Pavlovich

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

Способ 1. Покажите количество зарегистрированных пользователей с помощью плагина

В первую очередь вам надо будет установить и активировать Simple Blog Stats. Если вы еще не занимались установкой плагинов, то советуем вам заглянуть в наше пошаговое руководство как установить плагин на WordPress. После активации перейдите в Settings > Simple Blog Stats.

Этот плагин позволяет вам показывать различную статистику своего сайта. Откройте вкладку шорткодов, пролистайте вниз до пункта number of users — там вы увидите шорткод:

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

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

Способ 2. Показ количества зарегистрированных пользователей вручную с помощью кода

Если вы предпочитаете собственное решение или хотите минимальный код без сторонних плагинов, можно использовать шорткод с оптимизированным кодом, который включает кэширование и встроенную HTML-разметку. Код можно добавить в свой мини-плагин или в functions.php вашей темы:

// Function to get the total user count with caching
function wpb_user_count() {
    // Check if the count is cached
    $cached_count = get_transient('wpb_user_count');
    if ($cached_count !== false) {
        return '<span class="user-count">' . esc_html($cached_count) . '</span>';
    }

    // Get the total number of users
    $usercount = count_users();
    $result = $usercount['total_users'];

    // Cache the result for 1 hour to reduce database load
    set_transient('wpb_user_count', $result, HOUR_IN_SECONDS);

    // Return the result wrapped in HTML for easy styling
    return '<span class="user-count">' . esc_html($result) . '</span>';
}

// Register the shortcode
add_shortcode('user_count', 'wpb_user_count');

Этот код создаёт шорткод [user_count], который вы можете использовать в постах, на страницах или внутри сайдбар-виджета, чтобы отобразить количество пользователей вашего сайта. Число выводится с HTML-классом user-count, что позволяет легко применять к нему стили через CSS. Например, можно добавить в файл темы или в кастомный CSS:

.user-count {
    font-weight: bold;
    color: #2a9d8f;
    font-size: 1.2em;
}

Шорткод можно использовать прямо в тексте поста или страницы:

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

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

Платные или бесплатные шаблоны WordPress: преимущества и недостатки

Oct 23, 2025/by Vadim Pavlovich

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

Преимущества бесплатных шаблонов

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

Главное преимущество бесплатных шаблонов заключается в их цене, вернее, в ее отсутствии. Таким образом, это снижает порог вхождения для начинающего разработчика или предпринимателя. Однако слово «бесплатный» зачастую вызывает у людей определенные сомнения. Возникает закономерный вопрос: зачем кому-то предоставлять тебе бесплатный шаблон, когда другие продают их за деньги? В чем подвох? Очень часто люди думают, что бесплатные шаблоны не отличаются особым качеством, однако это далеко не так.

Строгий процесс отбора

На самом деле к бесплатным шаблонам WordPress зачастую гораздо более высокие требования, поскольку все шаблоны, имеющиеся в официальном списке WordPress, проходят серьезный отбор. В жюри обычно сидят очень талантливые и опытные ребята, которые тщательно проверяют каждый шаблон, прежде чем включать его в свой список. Например, бесплатные шаблоны проверяют на код, безопасность, совместимость с современными плагинами (в том числе WooCommerce, SEO и другими популярными расширениями), качество HTML и CSS, а также базовую оптимизацию скорости и мобильной адаптивности. Для разработки такого шаблона нужны навыки и талант.

Но зачем тогда они отдают даром?

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

Недостатки бесплатных шаблонов WordPress

Недостатки платных или бесплатных шаблонов WordPress подчас могут быть очень субъективными. То, что для некоторых будет недостатком, для других может стать преимуществом. Однако есть несколько общих моментов, которые никак не назовешь преимуществами бесплатных шаблонов и это:

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

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

Преимущества премиум-шаблонов WordPress

Платные шаблоны доступны для покупки в проверенных магазинах: ThemeForest, StudioPress, Themify и других.

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

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

Недостатки премиум-шаблонов WordPress

Однако не все платные шаблоны идеальны, возможны следующие проблемы:

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

Как найти действительно хороший шаблон?

Самый простой способ это покупать из проверенного источника или магазина, заслужившего свою репутацию (ThemeForest, StudioPress, Themify). Премиум-шаблоны включают документацию и поддержку, а также совместимы с современными конструкторами страниц (Elementor, Gutenberg).

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

Я в замешательстве… Что мне выбрать?

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

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

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

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

Что такое functions.php и как его использовать в WordPress?

Oct 20, 2025/by Alina

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

Где находится functions.php и как его использовать

Файл functions.php расположен в папке вашей темы:

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

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

Что можно делать через functions.php (с примерами)

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

Включение поддержки миниатюр (thumbnails):

add_theme_support( 'post-thumbnails' );

Добавление новых форматов записей:

add_theme_support( 'post-formats', array( 'aside', 'gallery', 'quote' ) );

Создание навигационных меню:

register_nav_menus( array(
    'main_menu' => 'Главное меню',
    'footer_menu' => 'Меню в футере',
) );

Подключение собственных скриптов и стилей:

function my_theme_scripts() {
    wp_enqueue_style( 'main-style', get_stylesheet_uri() );
    wp_enqueue_script( 'custom-js', get_template_directory_uri() . '/js/custom.js', array('jquery'), null, true );
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );

Автоматическое добавление текста в конец каждой записи:

function add_custom_text($content) {
    if (is_single()) {
        $content .= '<p>Спасибо за чтение! Подпишитесь на обновления.</p>';
    }
    return $content;
}
add_filter('the_content', 'add_custom_text');

Создание собственного виджета:

class Welcome_Widget extends WP_Widget {
    function __construct() {
        parent::__construct('welcome_widget', 'Приветственный виджет');
    }
    function widget($args, $instance) {
        echo $args['before_widget'] . '<p>Добро пожаловать на наш сайт!</p>' . $args['after_widget'];
    }
}
add_action('widgets_init', function() {
    register_widget('Welcome_Widget');
});

Регистрация пользовательского типа записи (Custom Post Type):

function create_portfolio_post_type() {
    register_post_type('portfolio',
        array(
            'labels' => array('name' => 'Портфолио'),
            'public' => true,
            'has_archive' => true,
            'supports' => array('title', 'editor', 'thumbnail')
        )
    );
}
add_action('init', 'create_portfolio_post_type');

Что лучше помещать в functions.php, а что — в плагин

Functions.php идеален для:

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

Плагин лучше использовать, если:

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

Советы по работе с functions.php

Используйте дочернюю тему для внесения изменений, чтобы обновления основной темы не стерли ваши функции.
Минимизируйте количество кода в functions.php — если функционал большой или универсальный, лучше сделать плагин.
Всегда тестируйте добавленные функции на локальном или тестовом сайте, чтобы не сломать сайт на продакшене.
Используйте хуки (actions и filters), чтобы не изменять ядро WordPress и тем самым сохранить совместимость с будущими обновлениями.

Вывод

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

Что такое: Типы постов

Oct 17, 2025/by Vadim Pavlovich

Типы постов – термин, используемый для различных видов содержания текста на сайте WordPress. В 2003 WordPress был изначально запущен как платформа для блогов. Посты – это общая терминология блоггинга, которая закрепилась за системой WordPress, в то время как она развилась в систему управления контентом (CMS). Когда WordPress добавил разный тип контента, страницы, они назвали это другим видом постов, отсюда и пошло название «тип поста». В поздних версиях WordPress добавил разработчикам возможность зарегистрировать свои собственные виды постов. В целом, тип поста определяет структуру и поведение конкретного контента.

По умолчанию WordPress предлагает следующие типы:

Пост (post)
Страница (page)
Медиафайл (attachment)
Ревизия (revision)
Пункт навигационного меню (nav_menu_item)

Дизайнеры и разработчики тем могут добавить пользовательские виды постов при помощи функции register_post_type() или одного из множества плагинов.

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

Что такое: JavaScript

Oct 17, 2025/by Vadim Pavlovich

JavaScript – это язык программирования, встроенный в браузеры, который делает веб-страницы «живыми». Программы на этом языке называются скриптами. В браузере они подключаются к HTML и выполняются сразу после загрузки страницы. JS позволяет добавлять динамичные элементы на сайт: слайдеры, всплывающие окна, кнопки, интерактивные формы и другие элементы интерфейса.

JavaScript в WordPress

WordPress темы и плагины активно используют JavaScript для создания интерактивных и динамических элементов. Чаще всего используется комбинация:

Vanilla JS (чистый JavaScript без библиотек)
AJAX для динамических запросов без перезагрузки страницы
jQuery (для обратной совместимости и старых тем)
Современные фреймворки в продвинутых темах: React, Vue.js, Alpine.js

JavaScript может быть добавлен к теме или плагину через стандартные функции WordPress:

// Регистрация и подключение скрипта
wp_register_script( 'custom-js', get_template_directory_uri() . '/js/custom.js', array('jquery'), null, true );
wp_enqueue_script( 'custom-js' );

Совет: напрямую вставлять JS в файлы темы (например, header.php или footer.php), не рекомендуется. Лучше использовать wp_enqueue_script() и при необходимости wp_localize_script() для передачи данных из PHP в JS.

Организация скриптов в теме

Многие темы содержат отдельную папку /js, где хранятся все JavaScript-файлы. Скрипты вызываются только там, где они нужны. Это ускоряет загрузку страницы и предотвращает ненужную загрузку скриптов.

Пример структуры темы:

/wp-content/themes/my-theme/
├── js/
│   ├── main.js
│   ├── slider.js
│   └── popup.js
├── style.css
├── functions.php
└── index.php

Стандартные библиотеки WordPress

WordPress включает несколько библиотек, которые можно использовать в своих темах и плагинах:

jQuery — для обратной совместимости
Underscore.js — утилитарные функции
Backbone.js — для создания структурированных клиентских приложений
wp.i18n — для интернационализации
wp.apiFetch — для AJAX-запросов к REST API

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

wp_enqueue_script( 'jquery' ); // Подключение jQuery

Вывод

JavaScript остаётся основным инструментом для создания интерактивных сайтов на WordPress. Современные темы используют сочетание ванильного JS, AJAX и фреймворков. Организованный и правильно подключённый JS делает сайт быстрее, удобнее и современнее.

Что такое: Дочерняя Тема

Oct 17, 2025/by Vadim Pavlovich

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

Чтобы создать дочернюю тему, необходимо создать отдельную папку внутри каталога тем. Главный файл, без которого она не будет распознана, — это style.css. В его заголовке указывается родительская тема через параметр Template, который должен точно соответствовать имени папки родительской темы. После включения дочерней темы её стили подключаются поверх стилей родительской, поэтому вы можете переопределять любые правила CSS. Родительская тема при этом продолжает работать полностью, предоставляя функциональность, которую вы не изменяли в дочерней теме.

Пример правильного файла `style.css` дочерней темы

/*
 Theme Name:   My Child Theme
 Theme URI:    https://example.com/
 Description:  Child theme for the Twenty Twenty-Five theme
 Author:       Your Name
 Author URI:   https://example.com/
 Template:     twentytwentyfive
 Version:      1.0.0
 Text Domain:  my-child-theme
*/

/* Ваши пользовательские стили */

Важно:
Template: должен быть строго названием папки родительской темы. Например, если тема находится в /wp-content/themes/twentytwentyfive, то Template: twentytwentyfive.

Пример `functions.php` для правильного подключения стилей

Хотя дочерняя тема может работать и без собственного functions.php, на практике он нужен почти всегда — прежде всего для подключения стилей родительской темы.

<?php
add_action( 'wp_enqueue_scripts', 'my_child_theme_styles' );
function my_child_theme_styles() {
    // Подключаем стиль родительской темы
    wp_enqueue_style(
        'parent-style',
        get_template_directory_uri() . '/style.css'
    );

    // Подключаем стиль дочерней темы
    wp_enqueue_style(
        'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( 'parent-style' )
    );
}

Структура файлов дочерней темы

Минимальная структура выглядит так:

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

Пример переопределения шаблона:

Поддержка `theme.json` в дочерних темах

Если родительская тема является блочной темой (FSE), она использует файл theme.json. В дочерней теме можно создавать свой theme.json — он:

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

Пример минимального theme.json в дочерней теме:

{
  "version": 2,
  "settings": {
    "color": {
      "palette": [
        {
          "name": "Брендовый цвет",
          "slug": "brand",
          "color": "#0066ff"
        }
      ]
    }
  }
}

Что такое Inspect Element или Developer Tools

Запуск инспектора и поиск кода

Редактирование и отладка кода в Inspect Element

Легко находите ошибки у себя на сайте

Зачем вообще нужны уведомления?

Настройка уведомлений с помощью OneSignal

Шаг 1. Создаём приложение в OneSignal

Шаг 2. Установка и настройка плагина OneSignal в WordPress

Как проверить, что уведомления работают

Как отправлять уведомления в WordPress с помощью OneSignal

Итог

Зачем и когда нужно использовать уведомления?

Способ 1. Добавляем свои уведомления вручную

Способ 2. Добавляем уведомления с помощью плагина

Способ 1. Покажите количество зарегистрированных пользователей с помощью плагина

Способ 2. Показ количества зарегистрированных пользователей вручную с помощью кода

Преимущества бесплатных шаблонов

Строгий процесс отбора

Недостатки бесплатных шаблонов WordPress

Преимущества премиум-шаблонов WordPress

Недостатки премиум-шаблонов WordPress

Как найти действительно хороший шаблон?

Я в замешательстве… Что мне выбрать?

Где находится functions.php и как его использовать

Что можно делать через functions.php (с примерами)

Что лучше помещать в functions.php, а что — в плагин

Советы по работе с functions.php

Вывод

JavaScript в WordPress

Организация скриптов в теме

Стандартные библиотеки WordPress

Вывод

Пример правильного файла style.css дочерней темы

Пример functions.php для правильного подключения стилей

Структура файлов дочерней темы

Поддержка theme.json в дочерних темах

О нас

Контакты

Навигация

Пример правильного файла `style.css` дочерней темы

Пример `functions.php` для правильного подключения стилей

Поддержка `theme.json` в дочерних темах