Создание финансовой витрины с помощью ИИ. Часть 4. Установка плагинов и создание типов записей для продуктов

30.07.2026

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

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

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

Часть 1. Анализ конкурентов и генерация прототипа через нейросеть

Выбор сайтов-конкурентов, создание прототипов различными способами и разработка основных страниц будущего проекта.

Часть 2. Покупка домена, хостинг, установка WordPress и пустой темы

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

Часть 3. Создание хедера, футера, логотипа и списка страниц

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

Часть 4. Установка плагинов и создание типов записей для продуктов

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

Часть 5. Создание шаблонов страниц и наполнение кодом

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

Часть 6. Финальная сборка: фильтры, сравнение, SEO и запуск

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

Готовый сайт, который мы создаём в данной серии материалов, уже можно посмотреть по адресу https://centrzaima.ru

Что будет сделано в этой статье

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

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

микрозаймы (МФО);
кредиты;
кредитные карты;
дебетовые карты.

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

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

Плагины

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

Первый плагин — Cyr-To-Lat. Он автоматически преобразует названия страниц, записей и категорий из кириллицы в латиницу. Это важно для правильной работы SEO и формирования читаемых URL-адресов. Вместо адресов с набором символов сайт будет использовать понятные человеку ссылки, состоящие из латинских букв.

Второй плагин — Advanced Custom Fields (ACF). Это один из самых популярных инструментов для создания дополнительных полей у записей. С его помощью мы сможем добавить к каждому финансовому предложению все необходимые параметры: сумму займа, процентную ставку, срок, рейтинг, логотип, ссылку на рекламодателя и другую информацию. Без этого плагина управлять данными в карточках офферов было бы крайне неудобно.

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

Установка плагинов

Все три плагина устанавливаются через стандартный раздел административной панели WordPress «Плагины» → «Добавить новый».

В открывшемся окне в поисковую строку вводим название плагина — например, Cyr-To-Lat. Первый результат в списке и будет тем вариантом, который нам нужен. Далее нажимаем кнопку «Установить», а после завершения — кнопку «Активировать». После чего он добавится в систему и станет доступен для настройки.

Точно так же поступаем с оставшимися двумя плагинами. В поисковую строку вводим Advanced Custom Fields, устанавливаем его и активируем. Затем повторяем то же самое для Yoast SEO. Таким образом, все три плагина будут установлены и готовы к использованию буквально за несколько минут.

Создание финансовых продуктов

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

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

Создание типа записи

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

Для начала открываем ChatGPT и используем следующий промпт:

Мне необходимо создать новый тип записи в WordPress с названием «МФО». Сгенерируй код для файла functions.php, который зарегистрирует этот тип записи. Важно, чтобы в левом меню административной панели WordPress появился отдельный раздел с нужным названием, через который можно было бы добавлять, редактировать и удалять записи этого типа.

При регистрации типа записи предусмотри следующие параметры:

поддержку стандартных полей: заголовок, текст, миниатюру (изображение);
наличие таксономий: категории и метки;
понятные ярлыки для интерфейса на русском языке;
корректную работу с SEO-плагинами.

Код должен быть готов к вставке в файл functions.php и не вызывать конфликтов с другими элементами темы.

В результате нейросеть сгенерирует примерно следующий код:

Далее переходим в административную панель WordPress в раздел «Внешний вид» → «Редактор тем» и открываем файл functions.php.

Вставляем полученный код в конец файла и сохраняем изменения.

После этого в левой колонке административной панели появляется новый раздел «МФО» . Теперь можно перейти туда, нажать кнопку «Добавить новый МФО» и убедиться, что все поля работают корректно.

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

Создание нужных полей

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

Настройка выполняется через плагин Advanced Custom Fields, который мы установили на предыдущем этапе.

Для этого переходим в левом меню административной панели в раздел ACF и открываем пункт «Группы полей». Далее нажимаем кнопку «Добавить новое».

Задаём произвольное название группы полей. В нашем случае это будет «Поля займов» .

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

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

В рамках нашего проекта мы создадим следующий набор полей для МФО:

Логотип оффера — тип «Изображение», символьный код offer_logo.
Рейтинг — тип «Число», символьный код offer_rating.
Количество отзывов — тип «Число», символьный код offer_reviews.
Максимальная сумма — тип «Число», символьный код offer_amount.
Максимальный срок — тип «Число», символьный код offer_term.
Одобрение (минут) — тип «Число», символьный код offer_approval.
Возраст — тип «Текст», символьный код offer_rate.
Способ получения — тип «Чекбокс», символьный код offer_method.
Партнерская ссылка — тип «URL», символьный код offer_link.
Порядок по умолчанию — тип «Число», символьный код offer_order. Чем больше цифра, тем выше оффер в списке.
Подробное описание на странице оффера — тип «WYSIWYG редактор», символьный код offer_full_text.
Реквизиты — тип «WYSIWYG редактор», символьный код offer_requisites.

После того как все поля добавлены, необходимо указать, где именно эта группа полей должна отображаться. Для этого в нижней части страницы настроек находим раздел «Настройки группы полей» и в блоке «Правила отображения» выбираем: Тип записи = МФО

Это означает, что созданная группа полей будет отображаться только при добавлении и редактировании записей типа «МФО». После сохранения настроек все добавленные поля становятся доступны в карточке каждого оффера.

Если теперь открыть любую запись типа «МФО» на редактирование, ниже стандартного редактора WordPress появится блок с созданными полями. Именно через них мы будем заполнять информацию о каждом финансовом предложении.

Создание карточки оффера

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

Для этого снова обращаемся к ChatGPT и загружаем в диалог два файла.

Во-первых, скриншот созданных нами кастомных полей — как они выглядят в интерфейсе Advanced Custom Fields. Во-вторых, скриншот прототипа страницы отдельного оффера, который мы разработали в первой части цикла.

Используем следующий промпт:

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

Ранее в теме уже был создан файл single-offer.php, который является шаблоном для отображения записей типа «МФО». Сейчас нужно подготовить полный код этого шаблона, чтобы он выводил все необходимые данные, включая кастомные поля, которые мы создали через Advanced Custom Fields.

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

Страница должна содержать:

- стандартный хедер и футер WordPress, которые подключаются через get_header() и get_footer();

- хлебные крошки Yoast SEO;

- все поля со скриншота.

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

Важные технические требования:

- все кастомные поля должны выводиться с проверкой на существование (if (!empty(get_field('...'))));

- партнерская ссылка должна быть обёрнута в тег < a > с атрибутом target="_blank";

В результате необходимо получить два отдельных блока кода:

Полный PHP-код для файла single-offer.php с корректным WordPress Loop, выводом всех кастомных полей и подключением хедера и футера.
CSS-код для вставки в файл style.css, включая стили для всех элементов карточки оффера.

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

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

PHP-код мы вставляем в файл card-offer.php, а CSS-код в файл style.css.

Важно отметить, что в нашей теме специально был создан отдельный файл card-offer.php, который мы сейчас использовали для генерации страницы с МФО. Для остальных финансовых продуктов — кредитов, кредитных карт и дебетовых карт — в теме также предусмотрены отдельные файлы шаблонов. Использовать их можно по тому же принципу.

Наполнение карточки оффера

После того как код шаблона single-offer.php подготовлен и все кастомные поля созданы, можно переходить к добавлению финансовых предложений на сайт. Для этого в административной панели WordPress переходим в раздел «МФО» и нажимаем кнопку «Добавить новый» .

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

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

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

Пример готовой карточки оффера на сайте после заполнения всех полей

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

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

Создание каталога офферов с фильтрацией

Теперь, когда у нас есть карточки отдельных офферов и все необходимые поля, можно переходить к созданию страницы со списком всех предложений. Именно на таких страницах пользователи будут видеть все доступные варианты и фильтровать их по нужным параметрам. Вместо того чтобы вручную добавлять каждый оффер на страницу, мы создадим специальный шорткод, который автоматически будет выводить все записи типа «МФО» в виде карточек с возможностью фильтрации.

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

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

Мне необходимо создать шорткод WordPress для вывода списка офферов типа «МФО» с фильтрацией по параметрам.

У нас уже есть тип записи «МФО» и кастомные поля, созданные через Advanced Custom Fields. На основе загруженного скриншота с макетом страницы, где отображаются карточки офферов с фильтрами, нужно подготовить полноценный PHP-код для добавления в файл functions.php, который будет выводить офферы в виде адаптивных карточек с возможностью фильтрации.

Требуется создать шорткод, который будет выводить все опубликованные записи типа «МФО» в виде карточек, повторяющих дизайн из макета. Также необходимо реализовать фильтрацию по параметрам, расположенным над списком в виде выпадающих списков или переключателей:

Фильтр по сумме займа.
Фильтр по сроку займа.
Фильтр по рейтингу.

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

Важные технические требования:

код должен быть полностью готов к вставке в файл functions.php;
все кастомные поля должны выводиться с проверкой на существование (if (!empty(get_field('...'))));
карточки должны быть адаптивными и корректно отображаться на всех устройствах;
вывод должен быть отсортирован по полю offer_order (чем больше число, тем выше оффер в списке);
для AJAX-фильтрации необходимо реализовать отдельный обработчик, который будет принимать параметры фильтров и возвращать обновлённый список карточек;
партнёрская ссылка должна открываться в новой вкладке (target="_blank");

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

В результате должен получиться готовый PHP-код для functions.php, включая:

Регистрацию шорткода;
Основную функцию вывода карточек;
Обработчик AJAX-запросов;
JavaScript для отправки запросов и обновления контента;
CSS-код для стилизации карточек и элементов фильтрации.

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

Дополнительно напиши название этого шорткода, например [offers_block]

В результате нейросеть сгенерирует полный код, который нам останется скопировать в файл functions.php нашей темы. После этого на любой странице сайта достаточно вставить шорткод, который сгенерирует нейросеть (в нашем случае это [offers_block]), и система автоматически выведет список всех МФО с возможностью фильтрации по сумме, сроку и рейтингу.

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

После того как шорткод для вывода списка МФО с фильтрацией готов, остаётся только создать страницу, на которой он будет отображаться.

Для этого переходим в административную панель WordPress в раздел «Страницы» → «Добавить новую» .

В поле заголовка указываем название страницы, например, «Займы». Это название будет отображаться в URL-адресе и на самой странице. Затем в область редактора вставляем полученный на предыдущем этапе шорткод. Выбираем шаблон под названием “Каталог офферов”. После этого нажимаем кнопку «Опубликовать» .

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

Готовая страница со списком МФО, фильтрами и карточками офферов

На открывшейся странице мы увидим результат работы шорткода. Сверху будут расположены фильтры, а ниже — все опубликованные записи типа «МФО», выведенные в виде карточек. Каждая карточка содержит необходимые поля, а также кнопки «Получить деньги» с партнерской ссылкой и «Подробнее» со ссылкой на карточку конкретного оффера.

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

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

Создание страниц с фильтрацией по меткам

Помимо основной страницы со всеми МФО, мы можем создавать отдельные страницы, на которых будут выводиться только те предложения, которые соответствуют определённым условиям. Например, займы с плохой кредитной историей, предложения под 0% или МФО с высоким процентом одобрения. Это делает сайт более структурированным, увеличивает количество страниц и улучшает его видимость в поисковых системах.

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

Чтобы создать метку, переходим в раздел «МФО» → «Теги МФО» . В поле названия указываем нужную характеристику, например, «С плохой КИ» , и нажимаем кнопку «Добавить новую метку». После сохранения метка становится доступна для присвоения офферам. Далее стоит скопировать или запомнить ее ярлык. В нашем случае это “s-plohoj-ki”.

Затем открываем карточку нужного МФО на редактирование, находим блок с тегами и выбираем созданную метку. Для ее появления достаточно начать писать название по-русски. После чего обновляем страницу.

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

Алгоритм действий аналогичен созданию основной страницы со списком МФО:

Переходим в «Страницы» → «Добавить новую»
Указываем заголовок, например, «Займы с плохой кредитной историей»
В область редактора вставляем тот же самый шорткод, только с параметром фильтрации по метке. В нашем случае это будет [offers_block tag="s-plohoj-ki"]
Нажимаем кнопку «Опубликовать»

После публикации страница становится доступна по своей ссылке. На ней будут отображаться только те МФО, которым присвоена указанная метка. Все остальные офферы будут скрыты.

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

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

Заключение

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

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

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

Желаем, чтобы созданный функционал стал надёжной основой для быстрого запуска витрины и привлечения трафика!
Команда Saleads.pro