So I have been asked to build a resource center just like hubspot's. (insert rolleyes here)

https://www.hubspot.com/resources

You can click into a type, and then click at topic and it creates a url like so:

https://www.hubspot.com/resources/ebook/advertising

You can also click a topic and then click type and it will do the same.

I have this part pretty much working. In my category template I have done this:

    Filter by type:

    <a href="/resources/case-studies/{{category.slug}}">case studies</a>

    <br/><br/>

    <a href="/resources/ebooks/{{category.slug}}">ebooks</a>

    <br/><br/>

    <a href="/resources/webinars/{{category.slug}}}">webinars</a>

    <br/><br/>

    <a href="/resources/whitepapers/{{category.slug}}">whitepapers</a>

then I have a routes for each type setup like this:

if the URI looks like this:

/resources/case-studies/*

Loads this template:

resources/_filtered.html

and in that template filtered I do the filtering like this:

        {% set resourceType = craft.request.segment(2) %}

        {% set resourceCatSlug = craft.request.segment(3) %}

        {% set resourceCat = craft.categories.slug(resourceCatSlug).first() %}

        {{resourceType}}

        {{resourceCat}}

        {% set filteredEntries = craft.entries({
            section:    ['resources'],
            orderBy:    {postDate: SORT_DESC},
            type:       resourceType,
            relatedTo:  resourceCat,
        }).all() %}

This all works and I planned to do the same method on the resources types to get to the filtered template.

But where I'm stuck is it was also requested that you could filter your search even further with a string search.

So from this:

<form class="control txt-center" action="{{ url('resources/search/results-filtered') }}">

<input class="input margin-auto-left-right display-block is-narrow-field " type="search" name="q" placeholder="Search">

<button class="margin-top-1 button is-info" role="button" type="submit"> Search the library </button>

How can I pass entry type and category to my filtered results?

{% set searchTerm = craft.app.request.getParam('q') %}
{% set searchResults = craft.entries.search(searchTerm).section('resources').orderBy('score') %}

PS, If anyone has a more elegant way to handle this I'm all ears!

up vote 2 down vote accepted

Without completely changing your direction and following in Hubspot's footsteps. From the search box set the query param for the page ?q=search-text then as the page refreshes grab the query {% set query = craft.request.getParam('q') %}. Then loop over your filteredEntries results only showing those entries who's title has the query.

{% for item in filteredEntries %}
    {% if query in item.title %}
        …
    {% endif %}
{% endfor %}

Containment Operator

You could also accomplish the filter by textual query in Javascript: Filter by search using text found in element within each div

  • Keep in mind this won't order them by score and it will only search the title. So chances are high your first results are no actual matches as one would expect but titles that randomly contain the characters. In fact I don't see any reason not to include the search param to the query. – Robin Schambach Aug 17 at 17:29
  • I would say Robin's answer would be your best bet since you are adding the search within the entries query. – aran Aug 17 at 17:40

A more elegant way to handle it would be to use PHP, rely on a more complex routing system with default values, don't rely on segments but on routing parameters. Use real URLs instead of relative paths and build your URLs dynamically instead of just inserting the string hard coded in order to be able to filter by multiple values without loosing the already set filters.

However - to include your parameters all you need to do

{% set searchResults = craft.entries
    .search(searchTerm)
    .section('resources')
    .type(resourceType)
    .orderBy('score') 
    .relatedTo(resourceCat)
%}

I would create a dynamic rule

$event->rules[] = [
    'pattern'  => '/resources/<type:\S+>/<category:\S+>/<search:[a-zA-Z0-9-]+>',
    'route'    => 'module/search/search-elements',
    'defaults' => [
        'type' => '',
        'category' => '',
        'search' => '',
    ]
];

and search in PHP

public function actionSearchElements(string $type, string $category, string $search)

You can then create a Twig function/filter in order to change those

<a href="/resources/ebooks/{{category.slug}}">ebooks</a>

to something like

<a href="{{ getSearchUrl({category: category.slug}) }}">ebooks</a>

And build your URL based on your route params + overwrite the new category. It will make it more re-usable and easier to change in the future if you would like to add an additional parameter or need to change the order you only need to change one place instead of many

  • Thank you so much for alway thoughtful answers. You have helped me out so much with this website build. I really appreciate all your help! – Danielle Frappier Aug 17 at 17:11

Your Answer

 

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.