Как создать сайт-каталог с помощью WordPress - пошаговое руководство

Опубликовано: 2019-07-12

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

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

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

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

Пошаговое руководство по созданию веб-сайта-каталога с помощью WordPress

Вот шаги по созданию веб-сайта каталога, которые мы опишем ниже:

  • Определитесь с нишей для вашего веб-сайта каталога
  • Как монетизировать свой сайт-каталог
  • Выберите лучшую CMS
  • Получите домен и хостинг
  • Выберите тему каталога
  • Выбирайте лучшие плагины
  • Создайте особенности

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

Создайте сайт-каталог с помощью WordPress

1. Выберите нишу для своего каталога на сайте.

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

Здесь нужно учесть несколько моментов:

Что бы вас заинтересовало в листинге:

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

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

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

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

На что есть спрос:

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

Первое, что нужно сделать, - это провести исследование ключевых слов и определить, что пользователи ищут в Интернете. Лучший способ сделать это - использовать инструменты исследования ключевых слов, такие как Google Keyword Planner или Ahrefs.

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

Например, представьте, что после некоторого исследования вы решили, что хотите разместить список ресторанов Чикаго на своем веб-сайте каталога.

Поисковый запрос «Лучшая пицца в Чикаго» имеет около 13 000 запросов в месяц, а также имеет низкую сложность ключевых слов, что означает, что по нему будет довольно легко получить высокий рейтинг.

AHRefs - отличный инструмент для сайтов-каталогов

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

Проверьте, есть ли уже другие сайты-каталоги в вашем районе

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

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

Используя наш пример «Лучшая пицца в Чикаго» с помощью Ahrefs, мы можем увидеть, какие веб-сайты уже имеют высокие рейтинги в поиске.

Список AHRefs

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

2. Как монетизировать свой сайт

Теперь, когда вы решили, какой тип веб-сайта-каталога вы будете создавать, возникает, возможно, еще более важный вопрос. Как ты будешь на этом зарабатывать?

Вот три наиболее распространенных способа сделать это:

1. Продавайте места для рекламодателей.

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

Один из лучших способов обеспечить показ наиболее релевантной рекламы для ваших клиентов - это использовать Google AdSense. Он определит лучшие рекламные объявления и самые высокооплачиваемые, чтобы максимизировать ваш доход.

2. Плата за объявления

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

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

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

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

3. Создайте членство

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

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

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

3. Выберите CMS.

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

WordPress невероятно адаптивен и работает для веб-сайтов с низким трафиком на веб-сайты, которые посещают миллионы посетителей каждый месяц, такие как Colorlib.

WordPress имеет ряд других преимуществ:

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

4. Выберите надежный веб-хостинг.

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

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

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

Bluehost - отличный вариант для размещения веб-сайтов каталогов на WordPress

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

5. Сделайте свой сайт выделяющимся с помощью отличной темы каталогов.

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

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

  • Поддерживает ли он самые популярные плагины?
  • Как часто он обновляется?
  • Поддерживает ли он SEO?
  • Готово ли многоязычное?
  • Насколько адаптируются макеты к разным размерам экрана?

Для вдохновения ознакомьтесь со списком лучших тем WordPress в каталоге Colorlib.

6. Выберите плагин для создания веб-сайта каталога.

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

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

  • Вам не нужно перегружать свой сайт другими плагинами. Все, что вам нужно, это Каталог инструментов.
  • Эти функции могут быть добавлены без какого-либо сложного PHP-кодирования.
  • Работает со всеми темами.
  • Он совместим с другими важными плагинами для веб-сайта каталога, такими как WooCommerce, WPML и Elementor.
  • Он регулярно обновляется, постоянно добавляются новые функции.

веб-сайт каталога

7. Создайте каталог функций веб-сайта.

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

  • Пользовательские типы сообщений
  • Настраиваемые поля
  • Пользовательские таксономии
  • Шаблон для отображения ваших товаров
  • Поиск
  • Интерфейсная форма для пользователей, чтобы отправлять свои объявления

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

пример сайта каталога на WordPress

1. Как создавать собственные типы сообщений

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

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

Вот как я создал свой собственный тип сообщения «Объявления»:

  1. Зайдите в Toolset -> Post Types , нажмите Add New .
  2. Назовите свой собственный тип сообщения.

Пользовательский тип публикации для сайтов-каталогов с WordPress

3. Щелкните Сохранить тип сообщения, и ваш пользовательский тип сообщения готов.
4. Теперь вы увидите новое меню, появившееся на боковой панели с вашим типом сообщения «Объявления».

Объявления на веб-сайте каталога

2. Как создавать настраиваемые поля

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

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

  1. Перейдите в Toolset -> Custom Fields и нажмите Add New .
  2. Выберите поля публикации .

Публикация полей на веб-сайте каталога

3. Назовите свою группу полей.
4. Сохраните группу полей и выберите, для каких сообщений вы хотите использовать поля. В моем случае я выбрал вариант " Объявления" .
5. Выберите Добавить новое поле, чтобы добавить каждое из ваших полей.
6. Выберите тип поля, которое вы хотите добавить. Например, для поля Год производства я использовал числовое поле.

Пользовательские поля для веб-сайта каталога

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

8. После того, как вы добавили все поля, нажмите «Сохранить группу полей», и ваши настраиваемые поля будут добавлены в редактор сообщений.

3. Как добавлять собственные таксономии

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

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

Вот как вы можете создавать собственные таксономии.

  1. Перейдите в Toolset -> Dashboard и в разделе Taxonomies нажмите Add Custom Taxonomy .
  2. Назовите свою настраиваемую таксономию.
  3. В разделе Тип таксономии вы можете выбрать, хотите ли вы иерархическую или плоскую таксономию. Иерархическая таксономия отлично подходит, если вы хотите создать подкатегории таксономий.
  4. Выберите тип сообщения, которому вы хотите назначить таксономии. Я выбрал тип сообщения " Объявления" .

Таксономии для веб-сайта каталога

5. Щелкните Сохранить таксономию .

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

4. Как создать шаблон для отображения вашего контента

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

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

Я использовал макеты Toolset для создания шаблона. Макеты Toolset основаны на сетке Bootstrap, которая отображает вашу страницу в строках из 12 столбцов, которые вы можете использовать для разработки своей страницы.

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

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

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

  1. Перейдите в Toolset -> Dashboard и нажмите Create Template рядом с вашим типом записи. Вы попадете в раздел "Макеты набора инструментов".
  2. Выберите, сколько столбцов вы хотите, чтобы каждая ячейка занимала, и выберите, чтобы открыть редактор.

Новый макет

3. Выберите нужную ячейку. В этом примере я выберу Визуальный редактор .
4. Нажмите « Поля и представления», где вы увидите список добавляемых шорткодов. В этом примере я хочу добавить свои настраиваемые поля. У каждого свой шорткод. Для демонстрации я добавлю настраиваемое поле Год производства .

Шорткоды полей и представлений

5. Щелкните « Вставить короткий код» .
6. Теперь мы видим шорткод в ячейке редактора. Мы можем добавить дополнительный текст, который будет отображаться в интерфейсе, чтобы пользователи могли видеть, о чем это поле. Как у меня ниже:

7. Нажмите « Применить» после того, как добавите поля и текст, и ячейка будет готова.

Вот так мой шаблон выглядит на бэкэнде.

И вот оно на интерфейсе:

5. Как создать собственный поиск

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

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

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

Шаг 1. Создайте поиск

  1. Перейдите в Toolset -> Layouts и создайте новый шаблон.
  2. Щелкните, чтобы добавить ячейку, как мы это делали, когда создавали наш предыдущий шаблон, и выберите ячейку Просмотр .
  3. Щелкните Вставить ячейку .

4. Щелкните Отображать результаты как настраиваемый поиск, а затем щелкните Создать .
5. В разделе « Выбор содержимого » выберите тип публикации , по которой нужно выполнить поиск.
6. В разделе «Настройки пользовательского поиска» выберите способ обновления результатов поиска. Здесь вы найдете несколько различных вариантов:

7. В разделе « Поиск и разбивка на страницы» вы можете выбрать, какие фильтры вы хотите добавить, чтобы пользователям было проще сузить область поиска. Щелкните « Новый фильтр», чтобы открыть параметры.

8. Теперь вы можете добавить свои фильтры. Я использовал настраиваемое поле « Цена», чтобы добавить минимальную и максимальную цену .

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

10. Нажмите кнопку « Отправить» , чтобы добавить кнопку, позволяющую пользователям отправлять результаты поиска.
11. Добавьте кнопку « Сброс» , чтобы пользователи могли вводить новый поиск с удаленными фильтрами.

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

Шаг 2. Спроектируйте, как будут выглядеть результаты

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

В разделе «Поиск и разбивка на страницы» мы можем использовать редактор циклов для разработки вывода.

  1. Щелкните Мастер петель и выберите способ отображения петли. Я использовал сетку Bootstrap с четырьмя столбцами.

2. Затем добавьте фильтры, которые вы хотите отображать вместе с результатами. Вот те, которые я добавил для своего сайта с каталогом классических автомобилей.

3. Нажмите « Готово», и вы вернетесь в редактор циклов .

4. Нажмите « Сохранить вид» и « Сохранить», и теперь ваш макет для поиска готов.

Вот как теперь выглядит мой поиск в интерфейсе:

6. Создайте интерфейсную форму для отправки объявлений.

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

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

  1. Перейдите в Toolset -> Post Forms и нажмите Add New .
  2. Теперь вы увидите мастер форм. Щелкните Продолжить .
  3. Назовите форму и нажмите « Продолжить» .
  4. Заполните настройки для вашей формы, включая тип сообщения, для которого он нужен, статус сообщения после его отправки и срок действия сообщения. Щелкните Продолжить .
  5. Теперь вы увидите редактор перетаскивания в Toolset для форм. Выберите, какие поля вы хотите отображать в вашей форме. Вы также можете добавить дополнительные элементы в зависимости от того, какую информацию вы хотите отображать в каждом сообщении. Щелкните Продолжить .
  6. Добавьте любые уведомления по электронной почте, которые вы хотите отправить, как только форма будет отправлена. Например, ниже я добавил электронное письмо для отправки пользователям, когда они отправят новое объявление, чтобы сообщить им, что оно находится на рассмотрении. Щелкните Готово.
  7. Наша форма готова, но нам все еще нужно отобразить ее во внешнем интерфейсе. Мы можем использовать тот же подход, что и при отображении нашего поиска и шаблонов. Перейдите в Toolset -> Layouts, создайте новый Layout и щелкните, чтобы вставить ячейку.
  8. Щелкните ячейку формы публикации и щелкните Создать ячейку. Нажмите «Сохранить», и ваша форма отобразится в интерфейсе пользователя.

Создайте свой сайт-каталог с помощью WordPress прямо сейчас!

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

Сообщите нам о своем опыте создания веб-сайта-каталога ниже. А если у вас возникнут проблемы, мы с радостью поможем!