Поиск по блогу с помощью SimpleSearch

Наступило время для новой части уроков по созданию интернет-магазина на MODx Revolution. Сейчас мы с вами рассмотрим, как реализовывать поиск по сайту средствами SimpleSearch. Некоторые спросят: “Как SimpleSearch? Ведь в анонсе у нас был mSearch2”. Объясняю, через SimpleSearch у нас будет работать поиск по блогу, а через mSearch2 поиск по каталогу и фильтр в категории товаров.

Что ж приступим? Для начала нам необходимо установить из официального репозитория компонент SimpleSearch (как это сделать я рассказывал здесь). После того как мы установили пакет, мы увидим, что в комплекте с SimpleSearch идет два сниппета:

  • SimpleSearch – сниппет, отвечающий за вывод результатов поиска.
  • SimpleSearchForm – сниппет, который выводит форму поиска на странице.

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

Вызов simpleSearch:


[[!SimpleSearch?
	&ids=`2`
]]

ids – это список родителей через запятую, указывает где искать ресурсы (в моем случае, это 2 — блог)

И создаем ресурс:

У меня идентификатор ресурса, на котором будут выводиться результаты – 6 (запомним его). Теперь в нашем чанке blogSidebar нам нужно вывести форму поиска. Но для начала нужно создать чанк этой формы. Я соединил чанк по умолчанию с тем отображением, которое у нас на шаблоне – получилось следующее (blogSearchFormTpl):


<form role="search" class="search-form" action="[[~[[+landing:default=`[[*id]]`]]]]" method="[[+method:default=`get`]]">
  <div class="form-group">
	<label class="sr-only" for="page-search">Type your search here</label>
	<input name="[[+searchIndex]]" id="[[+searchIndex]]" class="search-input form-control" type="search" placeholder="Поиск по блогу...">
	<input type="hidden" name="id" value="[[+landing:default=[[*id]]]]" /> 
  </div>
  <button class="page-search-button" type="submit">
	<span class="fa fa-search">
	  <span class="sr-only">Search</span>
	</span>
  </button>
</form>

И прикрепляю скриншот:

Теперь вызовем сниппет simpleSearchForm в сайдбаре:


[[!SimpleSearchForm? 
	&landing=`6`
	&tpl=`blogSearchFormTpl`
]]

landing – это id страницы, где у нас будут выводиться результаты (там должен быть вызван сниппет simpleSearch)

tpl – это чанк вывода формы.

Теперь нам осталось проверить работу (например, вбить “Тестовая статья”, надеюсь, что еще не удалили):

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

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

Оцените статью:

Проголосовало: 17

Комментарии (9)

  1. Артем 02 марта 2017, 06:05 # 0
    Здравствуйте! У меня такой вопрос, у меня постоянно выводится в результате поиска «По вашему запросу ничего не найдено. Попробуйте ввести похожие по смыслу слова, чтобы получить лучший результат.»Я пишу название статьи, все правильно, но все равно поиск не выводит ее. Как вы думаете, какие предположения в чем я мог ошибиться
    1. Петропавловский Артем 02 марта 2017, 09:53 # 0
      Скорее всего у вас отличаются id ресурсов. Проверьте параметр &ids=`2`в вызове SimpleSearch. Будьте внимательны.
      1. Артем 02 марта 2017, 15:25 # 0
        Спасибо!
    2. Константин 13 марта 2017, 19:05 # 0
      Почем-то ресурс Новости сайта у которого был шаблон Блог, сам меняет себе шаблон на Новости сайта. Т.е. ставлю обратно Блог — после обновления страницы меняет сам
      1. Петропавловский Артем 13 марта 2017, 22:13 # 0
        Когда устанавливаете шаблон, страница обновляется, подгружая доп поля. После этого еще нужно нажать «Сохранить».
      2. Данил 17 апреля 2017, 14:44 # 0
        Как попасть на тестовый сервер?
        1. Петропавловский Артем 17 апреля 2017, 14:48 # 0
          Доступы в данной статье Интернет-магазин на MODx Revo
          1. Данил 17 апреля 2017, 16:06 # 0
            Благодарю.
        2. Ольга 18 мая 2017, 12:45 # 0
          Добрый день!А вы сталкивались с тем, что SimpleSearch не работает в некоторых браузерах? Точнее, работает только в Google Chrome? Во всех остальных случаях не переходит на страницу поиска, а просто остаётся на той же самой странице. Никаких ошибок в консоле, никаких ограничений в htaccess — он просто остаётся на той же самой странице