Привет!
Я часто ищу изображения, опубликованные пользователями на моём форуме, особенно по определённым темам (на самом деле, иногда пытаюсь реализовать это на любом движке форумов).
Поисковый запрос выглядит так:
@Canapin with:images topic:265354
На странице просмотра темы результаты выглядят следующим образом:
На странице расширенного поиска это выглядит так:
Было бы здорово, если бы в сниппетах отображались миниатюры, чтобы легче находить нужное — или хотя бы иметь хорошее общее представление.
Кроме того, в настоящее время единственный способ просмотреть все результаты — это нажать на результат, чтобы увидеть пост, затем снова нажать на иконку поиска, чтобы вернуться к списку результатов, затем нажать на второй результат и так далее… Это быстро надоедает. ![]()
Пример макета:
Пример кода сниппета:
<a class="widget-link search-link" href="/t/pictures-of-your-latest-ride-continued/265354/450" title="">
#450 от Canapin
<span class="blurb"><span title="Sep 24, 2016 4:52 pm" data-time="1474728722000" data-format="tiny" class="relative-date">Сен 2016</span><span> — </span>
<span>Poitiers, Франция http://tof.canardpc.com/view/6009f51c-c924-4d4b-b04f-b93fda475d3f.jpg</span></span>
<span class="thumbnails-container">
<span class="result-thumbnail" style="background-image: url('https://f5i4i8k5.stackpathcdn.com/uploads/default/original/3X/f/5/f5ec74ec6a23af79ccc2aa0fa175e2db15932aa2.jpeg');"></span>
<span class="result-thumbnail" style="background-image: url('https://f5i4i8k5.stackpathcdn.com/uploads/default/original/3X/6/d/6d47f72debc3920dabf483e940b8c0b66f0da772.jpeg');"></span>
<span class="result-thumbnail" style="background-image: url('https://f5i4i8k5.stackpathcdn.com/uploads/default/original/3X/a/3/a3ff77045a113377db71625dba7ac63487958608.jpeg');"></span>
<span class="result-thumbnail" style="background-image: url('https://f5i4i8k5.stackpathcdn.com/uploads/default/original/3X/0/1/018c76e5db311eddf6ee18740f139e0594773be0.jpeg');"></span>
<span class="result-thumbnail" style="background-image: url('https://f5i4i8k5.stackpathcdn.com/uploads/default/original/3X/d/e/dec5d4e4948c074614d41c56ae087d782361ec6f.jpeg');"></span>
</span>
</a>
.thumbnails-container {
display: flex;
}
.result-thumbnail {
width: 20%;
height: 80px;
margin-right: 10px;
background-size: cover;
}
В качестве альтернативы можно добавить ссылку, которая отображает обычный список постов, содержащий только те сообщения, которые найдены по поисковому запросу, и мы могли бы прокручивать их как обычный список постов (похоже на функцию «суммировать тему»).





