Please ensure that you have a HubSpot account to use this theme. If not, you can visit this link to create a HubSpot account.

Create a HubSpot account

Installation

You can either install your theme from HubSpot Asset Marketplace or a .zip file.

From HubSpot Asset Marketplace

If you're installing the theme from HubSpot Asset Marketplace, just click the Install for free button on theme page and then follow the instructions.

From .zip file

If you have a .zip file of your HubSpot CMS theme, please follow the steps below to install it onto your account:

  1. Login to your HubSpot account.
  2. On the top right, click the Settings icon (looks like a gear).
  3. Click Tools > Website > Themes from the left sidebar menu.
  4. You'll see the Upload Theme button at the top right corner of the screen. Click it and then choose the zip file you've got.

If you completed the steps successfully, you should see the pizzami theme and its templates when you're creating a new page.

To learn more about theme installation, please visit HubSpot Reference Docs.


FAQ

Here you can find the answers to frequently asked questions by our customers.

How can I view "Theme Settings"?

Navigate to Marketing > Website > Website Pages and choose a page to edit. On Edit page screen, switch to Theme tab and then click Edit theme settings button.


Templates

Pizzami has 8 ready-to-use page templates for you, as well as the default HubSpot system templates such as Search Results, Password Required Page, Subscription Page etc.

Home

This template has been designed to be used on the homepage of your website. It contains the following sections and modules in order:

  • Hero Banner
  • Feature Section
  • Peicing Menu Section
  • Products Section
  • Expert Chef Section
  • Gallery Section
  • Brand Section
  • Testimonial Section
  • Blog (Module)
  • Newsletter Section

File location: /templates/home.html

About

When you need to provide some information about you and your team, you can use this template. It contains the following sections and modules in order:

  • Breadcrumb
  • About Section
  • Expert Chef Section
  • Video Section
  • Brand Section
  • Testimonial Section
  • Newsletter Section

File location: /templates/about.html

Menu

You can provide information about what you do, your services and clients, customer reviews and pricing with this template. It contains the following sections and modules in order:

  • Breadcrumb
  • Pricing Menu Section
  • Products Section
  • Newsletter Section

File location: /templates/menu.html

Reservation

You can provide information about what you do, your services and clients, customer reviews and pricing with this template. It contains the following sections and modules in order:

  • Breadcrumb
  • Single Image (Module)
  • Section Title (Module)
  • Form (Module)

File location: /templates/reservation.html

Contact

You can use this template to create your contact page. It contains the following sections in order:

  • Breadcrumb
  • Contact Info
  • Google Map (Module)
  • Section Title (Module)
  • Form (Module)

File location: /templates/contact.html

Blog Index

This is the template for your blog. It contains the following module:

  • Breadcrumb
  • Blog (Module)
  • Pagination (Module)

File location: /templates/blog-index.html

Blog Post

For now, HubSpot does not allow to use drag & drop features in blog post templates. So, sections and modules are embedded into the template and you can't access them via the page editor.

  • Breadcrumb (Module)

File location: /templates/blog-post.html

Landing Page

This is a general landing page template to collect some information about your visitors via a form and reply a couple of frequently asked questions. It contains the following sections in order:

  • Hero Banner
  • Feature Section
  • Peicing Menu Section
  • Products Section
  • Expert Chef Section
  • Gallery Section
  • Brand Section
  • Testimonial Section
  • Blog (Module)
  • Newsletter Section

File location: /templates/landing-page.html


Sections

Pizzami has 12 ready-to-use sections.

Feature Section

The feature section is separated into four columns. All column has an Image icon, heading, and excerpt.

Example Image

Pricing Menu

The pricing Menu section is separated into two rows and one column. The first column has a section heading and the Second column has a product filtering menu and product image, title, excerpt, and price.

Example Image

Products Section

The products section is separated into three columns with sliders. All column has an Image, title, and price.

Example Image

Chef Section

The Chef section is separated into three columns. All column has an image, social icon, name, and designation.

Example Image

The Gallery section is separated into two rows and all rows are separated into three columns. All column has an Image, zoom icon, and title.

Example Image

Brand Section

The brand section is separated into five columns with a slider section. All column has an image.

Example Image

Testimonial Section

The testimonial section is separated into two rows and three columns with a slider. All column has a rating icon, quote icon, excerpt, image, name, and designation.

Example Image

About Section

The about section is separated into two columns. The left column has an Image and the Right column has a section title & other Info.

Example Image

Contact Info

The contact Info section is separated into three columns. All column has an icon, title, and Info.

Example Image

Newsletter section

The Newsletter section is separated into two rows and one column. The first row has a section title and the second row has a newsletter form.

Example Image

Video Section

The Video section is separated into two columns. The left column has a section title & other Info and the Right column has a Popup Video.

Example Image

Reservation Section

The Reservation section is separated into two columns. The left column has an image and the Right column has a section title and reservation form.

Example Image

Modules

Pizzami has 27 ready-to-use modules.

Header Manu

One module for the entire header menu.

Header Menu Image

Header No Menu

One module for the entire header no menu.

Example Image

Mobile Menu

One module for the entire Mobile Menu.

Example Image

One module for the entire footer.

Example Image

About Image

You can add an image in various layouts.

Example Image

Blog

You can list your blog posts in various layouts.

Example Image

Add breadcrumb navigation to your page.

Example Image

Add a button to your website.

Example Image

Contact Info

You can use this module if you are planning to add a section to inform your visitors about your services, features, etc.

Example Image

Feature Box

This module includes icons, images, and excerpts.

Example Image

Form

One module for the entire a form

Example Image

This module includes icons, images, and titles.

Example Image

Google Map

Add a Google Map to your website.

Example Image

Hero Banner

Full-width hero banner with background color and particle image

Example Image

Newsletter

Add a Newsletter to your website.

Example Image

Section Title

Add Section Title to your website. Every Section Title has a different content.

Example Image

Social Share

A Social Share module to add your popular social accounts to your website

Example Image

Chef

This module has an image, social icon, name, and designation.

Example Image

Testimonial

It's very important to let your visitors know about your current clients' thoughts in today's world. With this module, you can insert the reviews in a modern slider.

Example Image

Video Popup

Add a Video Popup to your website.

Example Image

Product

You can easily add a product to your website by adding this module.This module has an Image, title, and price.

Example Image

Pricing Menu

You can easily add a pricing menu to your website by adding this module.This module has a product filtering menu and product image, title, excerpt, and price.

Example Image

Single Image

You can add an image in various layouts.

Example Image

You can add brand logo with slider.

Example Image

Column Content

You can add content in various layouts.

Example Image

Theme Settings

To edit your theme settings, you'll first need to create a page with a theme template. The theme settings can be accessed within the content editor by clicking the Theme tab on the left. Then click Edit theme settings.

Example Image

The complete structure is as follows:

  • Global colors
    Example Image
  • Typography
    Example Image
  • Forms
    Example Image
  • Website Header
    Example Image
  • Website Footer
    Example Image

Keep in mind that you'll need to click the Publish to ... assets button at the top right corner of the screen only if you'd like to make changes on all pages that created with the theme.

Don't forget to click Apply Changes to let your changes take affect, when needed. You can visit HubSpot Knowledge Base for more information regarding your theme settings.

Visit HubSpot Knowledge Base

Support

To provide the best experience, MagicalMtas provides continuous support for all of our customers. If you’re facing any issue or if you’ve any query or a presale question please feel free to contact us via our support forum https://magicalmtas.freshdesk.com/. Our developer will help you all the way.