Поиск по блогу с помощью 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 – это чанк вывода формы.


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



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


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

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

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

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

  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 — он просто остаётся на той же самой странице
          1. noname 17 апреля 2018, 18:08 # 0
            Та же проблема, работает только в опере, пробовал со всех устройств та же история.
            1. noname 17 апреля 2018, 18:15 # 0
              А проблема оказалась самой дурацкой, на странице результаты поиска в админке забыл поставить галочку «опубликовать», вот она и работала только с того браузера с которого в админке авторизован был. Может у вас то же самое было.
            2. Андрей 22 ноября 2018, 16:14 # 0
              что тут указать "&ids=`2`" чтобы поиск делался по всему сайту?
              1. Erik 17 марта 2019, 20:34 # 0
                указать надо id ресурсов, в которых будет поиск
              2. Erik 17 марта 2019, 20:32 # 0
                Спасибо… Помогли
                1. Александр 22 марта 2019, 16:21 # 0
                  При введение в поиске русскими буквами название, не находит у меня ничего + в ссылке в запросе слова имеет такsearch=%D0%97%D0%B0%D0%B3%D0%BE%D0%BB%D0%BE%D0%B2%D0%BE%D0%BA+1&id=39А должноsearch=Заголовок+1&id=39как быть?
                  1. дмитрий 21 июня 2019, 23:59 # 0
                    добрый день, сделал всё как в уроке, но есть такая проблема, по одному слову поиск идёт хорошо, но есть допустим ввести в строку поиска запрос «3 класс», то по итогу будет выдаваться не «3 класс» а просто «класс». Я посмотрел, он не работает корректно если в поиске есть пробел

                    Написать комментарий

                    Наши клиенты

                    Многие компании уже доверяют нам. Будьте в их числе!

                    Хотите реализовать проект?

                    Контакты

                    Напишите нам - мы расскажем вам много интересного!


                    Пермь, ул. Крупской 34, офис 510