CMS Development

LoisJ
Contributor

Site search functionality

SOLVE

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 Accepted solutions
relabidin
Solution
HubSpot Alumni
HubSpot Alumni

Site search functionality

SOLVE

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 

View solution in original post

stefen
Solution
Key Advisor | Partner
Key Advisor | Partner

Site search functionality

SOLVE

@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

View solution in original post

25 Replies 25
Patryk
Member

Site search functionality

SOLVE

I took different approach for search functionality on our website netguru.co. (search is in top right corner)

 

It's much simplier and requires no external modules - good for start. I described the solution in detail on my blog: Blog Search in Hubspot COS

 

stefen
Key Advisor | Partner
Key Advisor | Partner

Site search functionality

SOLVE

Awesome @Patryk! I like your server side implementation. If only HubSpot provided a way to loop through the site pages and landing pages!

Stefen Phelps, Community Champion, Kelp Web Developer
0 Upvotes
stefen
Key Advisor | Partner
Key Advisor | Partner

Site search functionality

SOLVE

like @ndwilliams3 said... there really isn't a good turnkey solution available right now.  The blog post mentioned by @relabidin is your best bet.

 

However, I think I know what my next blog post will be about... 🙂

Stefen Phelps, Community Champion, Kelp Web Developer
relabidin
Solution
HubSpot Alumni
HubSpot Alumni

Site search functionality

SOLVE

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 

ndwilliams3
Key Advisor

Site search functionality

SOLVE

I haven't really implemented any site search using Google CSE. The post @relabidin provided, looks like a simple implementation that could be handled by anyone with basic Javascript knowledge.

 

Looking under the hood of the hubspot.com site, it appears they are using the CSE API with their own custom callback script to populate a modal window. You could definately create something similar, but you would need a Javascript pro familiar with the CSE api.