Our designer came up with the idea of making a giant hot pocket the size of a burrito and started making a fake brand/company for it. Fast forward a few months and we have an entire HubSpot Website theme for Pizzarrito, our fake restaurant/drive-thru we hope someone will make a reality for us someday 😆

What it does

We tried to integrate as much of the restaurant specific markup into our modules as possible with the goal being that the restaurant that uses this would rank the highest in their area in local search results.

How we built it

We used the HubSpot Boilerplate theme as our base and went from there. Page load performance was a priority for us since this is an image heavy website design. In order to combat slow image loading, we made sure that all of the "background" images were actually using <img> tags. This enables us to take advantage of native lazy loading and srcset which automatically loads the right size image based on the device size. We also coded the entire theme without jQuery, woot!

Challenges we ran into

The biggest challenge by far was making time for our HubSpot theme in the face of our client work. Agency life, am I right?

What we learned

Using the design manager is so much quicker to create modules compared to using the CLI locally. Also was the first time using the language switcher and making translations for a page in HubSpot, a really great feature!

What's next for Restaurant Pro

Completing a WordPress version of the theme for those customers that might have both WordPress and HubSpot pages and incorporating additional markup for more of the modules. Additionally, we would love to include eCommerce like functionality using the new HubSpot payments feature so people can order ahead and pickup their order in person.

Built With

Share this project: