CMS Development

LoisJ
Contributeur

Site search functionality

Résolue

Hi,

 

I'd be really interested to learn how hubspot.com achieves this lovely site search functionality?

search-shot.pngI'm in the process of moving our blog from Wordpress over to HubSpot and so far I haven't been able to find any documentation on how to offer a search option for visitors. I realise this example is probably custom development, but are there any global modules that would help us achieve a basic free text search of all blog posts? If so, can anyone point me in the direction of the documentation?

 

Thanks so much.

Lois

2 Solutions acceptées
relabidin
Solution
Ancien salarié HubSpot
Ancien salarié HubSpot

Site search functionality

Résolue

Hi @LoisJ,

 

The site search function on the HubSpot site was built with a great deal of custom development. However, I did locate a post from our Designers blog on creating custom site search on the COS: http://designers.hubspot.com/blog/how-to-custom-search-hubspot-cos-website

 

Hopefully, this article points you in the right direction, but it would be great to hear from some experienced COS designers/developers on the topic. @stefen @ndwilliams3 do you guys have any input on this?

 

Rami 

Voir la solution dans l'envoi d'origine

stefen
Solution
Conseiller clé | Partenaire solutions
Conseiller clé | Partenaire solutions

Site search functionality

Résolue

@LoisJ it sounds like a z-index issue.  I've updated the css with a higher z-index and with the fix for scrolling results. Try again with the latest files and see if that helps..

Stefen Phelps, Community Champion, Kelp Web Developer

Voir la solution dans l'envoi d'origine

25 Réponses
cdeiulis
Participant

Site search functionality

Résolue

Has anyone conquered this for a global site? We have essentially one domain, but on it runs different subdirectories (e.g. /uk or /au). While the beta search from Hubspot seems to be OK, it would search *all* our sites, which would be a terrible user experience. Has anyone gotten around this? With so much content on our site, I"m eager to figure out how to implement search. 

mcoley
Équipe de développement de HubSpot
Équipe de développement de HubSpot

Site search functionality

Résolue

I'll add this functionality tomorrow so you can filter search results by path.

0 Votes
SvenVanbrabant
Contributeur

Site search functionality

Résolue

Filter search results based on domain name would be very handy for Enterprise users.

0 Votes
mcoley
Équipe de développement de HubSpot
Équipe de développement de HubSpot

Site search functionality

Résolue

This can already be done two ways. You can use `www.domain.com/_hcms/search?term=` which will only search content under `www.domain.com`. If you would like to search a subdomain, you can use `www.sub.domain.com/_hcms/search?term=`. If you wish to use the API to search multiple subdomains in your portal: `www.api.hubapi.com/contentsearch/v2/search?portalId=&domain=&domain=&term=`. We're are working on getting all these options documented publicly on https://developers.hubspot.com/docs/overview.

0 Votes
cdeiulis
Participant

Site search functionality

Résolue

Thanks for the response! We have subdirectories, not subdomains (e.g. /uk or /au off of our main domain not mainsite.uk.com or mainsite.au.com). Does this functionality work the same as with subdomains? 

0 Votes
mcoley
Équipe de développement de HubSpot
Équipe de développement de HubSpot

Site search functionality

Résolue

You can now add a `pathPrefix=` query param to filter results by path prefix. `https://www.hubspot.com/_hcms/search?term=hubspot&minScore=0&pathPrefix=services` as an example to only return results that match `hubspot.com/services*`. This requries a reindex of portals, so may take up to 24 hours to be available for your portal.

0 Votes
vonTrapp
Participant

Site search functionality

Résolue

Hi @mcoley, The pathPrefix parameter sounds very useful to me. Where is this variable entered? In the Site Search Input module or Site Search Results module? In the snippet, JS or elsewhere?

How do I configure a sub folder such as /en/app/services instead of only /services ?

0 Votes
ThomasReitz
Participant

Site search functionality

Résolue

Hi @vonTrapp,

 

you can set the pathPrefix in your search input module in the HTML&HUBL-code window. This hidden input adds two different parameters to the search-query url. (In this Screenshot: Search only for Blogposts with the pathPrefix=de => german blogposts) 

 

Bildschirmfoto 2018-08-21 um 15.40.15.png

 

On this page you can see different implementations of the search:

  • Search on English Website (Topnavigation) => Search Results Page delivers Results of the english website.
  • Search on German Website => German Website Results
  • Search on English Blog (Sidebar or Topnavigation) => English Blogposts
  • Search on German Blog => German Blogposts

You also can use the query parameters in the URL to customize the behaviour of the search result page. (German/English Footer, Tabbed Search Module in the sidebar, German/English-"No Results-Message",...)

 

I hope this helps a little bit. Best regards

Tom

vonTrapp
Participant

Site search functionality

Résolue

Hi @ThomasReitz,

Thank you for your great and clear explanation. However, I’m still a bit confused about how I may implement it in my particular case. I intend to make a search in a user manual, i.e. a section with a limited group of pages at our site. You can’t isolate these pages by neither page type, language or only first level in the path (Path Prefix). The ability to use several levels in the path would be terrific. Alternatively, if I could tag these pages with a searchable ID. Or do you have an even more clever solution?

0 Votes
mcoley
Équipe de développement de HubSpot
Équipe de développement de HubSpot

Site search functionality

Résolue

PathPrefix extends however far you want. So you can do `pathPrefix=/a/very/long/path/` and it will work.

0 Votes
vonTrapp
Participant

Site search functionality

Résolue

I agree, it ought to work, but it doesn’t. At least not for me. As soon there is a / in the URL it will be transcoded to %2F (as it should) but there is where it stop working.

It will always result in “Sorry. There are no results for [query string] Try rewording your query, or browse through our site.”

I’m curious about what makes it work for you, but not for me.

0 Votes
mcoley
Équipe de développement de HubSpot
Équipe de développement de HubSpot

Site search functionality

Résolue

Hmm let me take a look.

0 Votes
mcoley
Équipe de développement de HubSpot
Équipe de développement de HubSpot

Site search functionality

Résolue

http://www.mattcoley.me/_hcms/search?term=test&pathPrefix=rss%2Flong%2Ftest appears to work for me. Can you send me a link to the site you are having trouble with?

0 Votes
ThomasReitz
Participant

Site search functionality

Résolue

Hi everyone,

 

we've just found out that HubSpots' Site Search is now in Beta. If you use the new design manager, you can sign up here: https://designers.hubspot.com/content-search-beta

 

We've been playing around with the feature since yesterday and you can see our first results in our Blog: https://www.hoppe7.de/blog

 

 

There is also an API-Endpoint for every HS-Portal: DOMAIN/_hcms/search?term=inbound

 

Blueleadz has a blogpost about, how they use this for their own Custom Search: https://www.bluleadz.com/blog/3-reasons-why-site-search-is-important-and-how-to-implement-search-in-...

(which is also the source, how we found out about the Beta-Search)

 

Best regards

Tom

SvenVanbrabant
Contributeur

Site search functionality

Résolue

Is there any official documentation about the Content Search beta released yet?

LoisJ
Contributeur

Site search functionality

Résolue

Thank you all for taking the time to respond. I really appreciate your insight.

I'll look at what we can do with the Google CSE and move on to customising it if we need to.

 

Cheers,

Lois

0 Votes
stefen
Conseiller clé | Partenaire solutions
Conseiller clé | Partenaire solutions

Site search functionality

Résolue

@LoisJ so I created a plugin that takes your sitemap and turns it into search results. Try it out: https://github.com/growwithsms/HubSpot-COS-Site-Search

 

A live example can be found on our site: https://www.growwithsms.com/

 

Blog post that goes a little more into the details of how it works and it's limitations: https://www.growwithsms.com/blog/hubspot-cos-modal-site-search-plugin

 

Let me know what you think!

Stefen Phelps, Community Champion, Kelp Web Developer
LoisJ
Contributeur

Site search functionality

Résolue

@stefen that is incredible! Thank you so much!

 

I'm the marketer here rather than a designer/developer, but I know enough to have been able to install this and get it working on our site. I do have a question though if you don't mind.....on my site, the search overlay seems to sit behind the main navigation and side scroll bar so I lose the box to type the search in as well as the close link. I was able to  adjust the positioning of the overlay in the css to bring it down enough to be able to see it all below the nav, but it looks like something in the css also adjusted the positioning of the menu.

 

I don't seem to have a scroll bar on the result set at all, unlike the demo running on your site, which means I can't scroll the results if they go further than the one page - it just scrolls the page in the background.

 

Can you think of anything obvious I may have done wrong, or overlooked before I get our developer to take a closer look?

 

Thanks so much!

0 Votes
stefen
Solution
Conseiller clé | Partenaire solutions
Conseiller clé | Partenaire solutions

Site search functionality

Résolue

@LoisJ it sounds like a z-index issue.  I've updated the css with a higher z-index and with the fix for scrolling results. Try again with the latest files and see if that helps..

Stefen Phelps, Community Champion, Kelp Web Developer
LoisJ
Contributeur

Site search functionality

Résolue

@stefen That worked a treat! Thank you again 🙂

0 Votes