---
title: Restaurant Pro - Documentation
---

[Skip to content](https://restaurant.kelp.agency/docs#content)

[![restaurant-pro-logo](https://restaurant.kelp.agency/hs-fs/hubfs/restaurant-pro-logo.png?width=213&height=63&name=restaurant-pro-logo.png "restaurant-pro-logo")](https://restaurant.kelp.agency/?hsLang=en)

Toggle Navigation

- [Visit Us](https://restaurant.kelp.agency/visit-us)
- [Menu](https://restaurant.kelp.agency/menu)
- [Blog](https://restaurant.kelp.agency/blog)
- [Contact](https://restaurant.kelp.agency/contact) 
    - [Landing Page](https://restaurant.kelp.agency/landing-page)
- Theme 
    - [Documentation](https://restaurant.kelp.agency/docs)
    - [Buy Now](https://ecosystem.hubspot.com/marketplace/website/restaurant-pro-theme-by-kelp-creative-agency)

[Follow us on Facebook](https://www.facebook.com) [Follow us on LinkedIn](https://www.linkedin.com) [Follow us on Twitter](https://www.twitter.com) [Follow us on Instagram](https://www.instagram.com)

# Documentation

Getting Started with Restaurant Pro HubSpot Theme

[THEME SETTINGS](https://restaurant.kelp.agency/docs#theme-settings)   [Templates](https://restaurant.kelp.agency/docs#templates)   [Modules](https://restaurant.kelp.agency/docs#modules) 

## Theme Settings

Global colors  
The theme is designed with 2 colors that get used throughout the website—*Primary* and *Secondary*.  Changing these two options first is a great idea since most of the other color settings will use these by default.

Global fonts  
Same as the colors, their are 2 primary fonts that will be used throughout the website. Choose your more simple font for the *Primary* and a more stylistic font for *Secondary* and the rest of the settings will inherit these values.

Text  
This group is for setting all the default fonts and text colors across the website including Headings, Body text, and Links. The default settings should already look great, but feel free to adjust as necessary.

Forms  
This field group is for adjusting all the default form styles across the entire site. The default settings should already look great, but feel free to adjust as necessary.

Buttons  
This field group is for adjusting all the default button styles across the entire website including form submit buttons. You can change the font, color, and background color as desired. If you want to use the button styles on your Call-to-Actions simple add the \`button\` class to your unsettled CTA.

Website header  
If you have a light logo you may want to change your header background to be darker or vice versa. In this field group you can change the text color, text hover color, and background color if the inherited values don't work.

Website footer  
Similar to the website header group, you can adjust the text, hover, and background colors. In addition, you can also adjust the footer button colors in case you want to have a form or CTA in your footer.

 

## Templates

Restaurant Pro comes with 5 custom page templates, 2 blog templates, plus the standard 7 system themes:

- **Home** - page
- **Locations** - page
- **Restaurant Menu** - page
- **Contact** - page
- **Landing Page** - page
- **Blog Listing** - blog
- **Blog Post** - blog
- **404** - system
- **500** -system
- **Unsubscribe** -system
- **Password Protected Page** -system
- **Search Results** -system
- **Subscription Preferences** -system
- **Subscriptions Confirmation** -system

Page Templates  
You can use the page templates by selecting the appropriate template when creating a new website page or landing page. [Read HubSpot's useful knowledgeable article](https://knowledge.hubspot.com/website-pages/create-and-customize-pages) for additional information on how to use page templates.

Blog Templates  
Blog templates can be applied to a blog via your HubSpot settings page:

1. In your HubSpot account, click the **settings icon** in the main navigation bar.
2. In the left sidebar menu, navigate to **Website** > **Blog**.
3. In the Templates tab apply the Restaurant Pro Blog Listing and Blog Post templates via the two drop downs and hit save.

For additional information on setting up your blog visit [HubSpot's knowledgeable article here](https://knowledge.hubspot.com/blog/manage-your-blog-template-and-settings).

System Templates  
Similar to blog templates, system templates can be applied via your HubSpot settings page:

1. In your HubSpot account, click the **settings icon** in the main navigation bar.
2. In the left sidebar menu, navigate to **Website **> **Pages**.
3. Click the **System Pages** tab. 
4. Click the corresponding dropdown menus to select your **404 error page**, **500 error page**, **Password prompt page**, and **Search results** Restaurant Pro templates then hit save when done.

For additional information on system templates [read HubSpot's knowledgeable article here](https://knowledge.hubspot.com/design-manager/use-system-templates-to-customize-error-subscription-and-password-prompt-pages).

## Modules

At the heart of Restaurant Pro are 10 custom modules specifically designed to bring your restaurant to the top of search results thanks to the performant design and implementation of the restaurant schema.org structured markup.

 

Hero Banner  
This module is the first module on the home page template. It features a large H1 heading with optional subheading and featured illustration. In addition, you can add up to 3 call-to-actions cards that will align themselves perfectly with the main content area.

Card  
The card module is perfect for a quick ad for a special event or deal. The card features an H3 heading along with optional description and CTA fields. You can also easily incorporate some of your brand colors by choosing a background image and color overlay. Be sure to test for text readability when choosing your colors.

Navigation  
This is what powers the main navigation on your website. You can choose the navigation menu and the maximum amount of levels deep you want the drop downs to go (max of 3). To edit your navigation menus head on over to your *HubSpot site settings > Website > Navigation*

Restaurant Address  
This module incorporates Schema.org structured data so it's smart to include this in the footer which means every page on your website will give Google the information they want for local search rankings.

Restaurant Featured Entrée  
This module is for featuring your menu items or specials. For the best visual results use a transparent PNG with the background cropped out. You can use a service like [removebg](https://www.remove.bg) to achieve the desired look or [contact a creative agency](https://www.kelp.agency/contact) like us 😉.

Restaurant Hours  
This module incorporates Schema.org structured data so it's smart to include this in the footer so every page will tell Google your hours and help you rank in local search results.

Restaurant Locations  
The locations module embeds an interactive Google Map and enables you to customize the map marker color and add up to 10 locations. Google requires an API key for this to work. Steps to get your API Key:

1. [Create new project](https://console.cloud.google.com/projectcreate) in Google Cloud.
2. [Go to the Billing page](https://console.cloud.google.com/projectselector/billing) and enable billing. You won't be charged as long as you stay within the [free quota](https://developers.google.com/maps/billing-and-pricing/billing#monthly-credit).
3. [Enable the Maps JavaScript API](https://console.cloud.google.com/apis/library/maps-backend.googleapis.com) and the [Geocoding API](https://console.cloud.google.com/apis/library/maps-backend.googleapis.com).
4. [Go to the Credentials page](https://console.cloud.google.com/project/_/google/maps-apis/credentials) click Create credentials > API key
5. Optionally as a final step, you can then restrict your API Key to your domain for more security.

Once you have your key, copy and paste it into the module API Key field and you're good to go.

Restaurant Menu  
This module lets you easily create your restaurant menu on your website. In the future we plan to also incorporate Schema.org structured data in this module as well.

Restaurant Reviews  
This module lets you easily add your latest Yelp reviews automatically via your Yelp Business ID. To get your business ID you just need to find your restaurant on Yelp and copy the last portion of the URL. For reference, the Business ID is the highlighted portion in this example URL: https://www.yelp.com/biz/mountaineer-coffee-brooksville

Alternatively, you can also add reviews manually in case you want to choose exactly what shows up on your website and/or if you want more than 3 reviews.

Social Follow  
We include this module in the header and footer by default but you can add this module anywhere you like. This is a local module so be sure to update each instance of it with your social links.

 

---

 

Have a question or need additional support?  
Send us an email at [support@kelp.agency](mailto:support@kelp.agency)

 

### Visit Us

 123456 Florence Ave.  
 Scranton, GA 34567

[Get Directions](https://restaurant.kelp.agency/docs#directions)

(312) 555-3124

![pizzarrito](https://restaurant.kelp.agency/hs-fs/hubfs/pizzarrito.png?width=285&name=pizzarrito.png)

### Our Hours

1. Sunday  CLOSED
2. Monday  10am-10pm
3. Tuesday  11am-10pm
4. Wednesday  11am-10pm
5. Thursday  11am-10pm
6. Friday  11am-10pm
7. Saturday  11am-12pm

### Other Links

- [Visit Us](https://restaurant.kelp.agency/visit-us?hsLang=en)
- [Our Menu](https://restaurant.kelp.agency/menu?hsLang=en)
- [Our Story](https://restaurant.kelp.agency/visit-us?hsLang=en)
- [Contact Us](https://restaurant.kelp.agency/contact?hsLang=en)

[Follow us on Facebook](https://www.facebook.com) [Follow us on LinkedIn](https://www.linkedin.com) [Follow us on Twitter](https://www.twitter.com) [Follow us on Instagram](https://www.instagram.com)

### Deals & Coupons

© 2026, Kelp Creative Agency

```json
{
  "@context" : "https://schema.org/",
  "@type" : "Restaurant",
  "address" : {
    "@type" : "PostalAddress",
    "addressCountry" : "US",
    "addressLocality" : "Scranton",
    "addressRegion" : "GA",
    "postalCode" : "34567",
    "streetAddress" : "123456 Florence Ave. "
  },
  "name" : "Kelp Creative Agency"
}
```

```json
{
  "@context" : "https://schema.org",
  "@type" : "Restaurant",
  "name" : "Kelp Creative Agency",
  "openingHoursSpecification" : [ {
    "@type" : "OpeningHoursSpecification",
    "closes" : "10pm",
    "dayOfWeek" : "Monday",
    "opens" : "10am"
  }, {
    "@type" : "OpeningHoursSpecification",
    "closes" : "10pm",
    "dayOfWeek" : "Tuesday",
    "opens" : "11am"
  }, {
    "@type" : "OpeningHoursSpecification",
    "closes" : "10pm",
    "dayOfWeek" : "Wednesday",
    "opens" : "11am"
  }, {
    "@type" : "OpeningHoursSpecification",
    "closes" : "10pm",
    "dayOfWeek" : "Thursday",
    "opens" : "11am"
  }, {
    "@type" : "OpeningHoursSpecification",
    "closes" : "10pm",
    "dayOfWeek" : "Friday",
    "opens" : "11am"
  }, {
    "@type" : "OpeningHoursSpecification",
    "closes" : "12pm",
    "dayOfWeek" : "Saturday",
    "opens" : "11am"
  }, {
    "@type" : "OpeningHoursSpecification",
    "closes" : "",
    "dayOfWeek" : "Sunday",
    "opens" : ""
  } ]
}
```