HubSpot Asset Marketplace compliance, design, code quality, and listing

Last updated:

Asset providers on the marketplace must adhere to the following standards set by HubSpot when submitting themes (along with the theme's templates and modules). These standards apply to all assets on the marketplace. 

Marketplace compliance

Marketplace provider information

Marketplace providers must keep their provider information up to date at all times. HubSpot reserves the right to remove or unapprove any asset listing where provider information (such as email or website) is inaccurate, missing, or no longer functioning.

Acceptable Asset Marketplace submissions

At this time, you can only submit themes to the Asset Marketplace. Templates and modules can only be submitted as part of a theme. Themes cannot use features such as HubDB and serverless functions. Learn more about theme limits.

Third-party assets

Third-party asset files must be loaded on the HubSpot CDN unless they are from a reputable source such as JSDelivr, Google Hosted Libraries, CDNJS. These assets can be added to the stylesheet using the @import feature.

Note: If you are including files in a module, you must use the css_assets and js_assets parameters in your meta.json file (Linked Files section in Design Tools).

Free asset limits

Asset Marketplace providers may offer up to 20 free themes, not including themes submitted through the theme accelerator program

Asset file structure

All assets should contain a proper folder structure and be grouped under one parent folder, which should describe your product listing. For example, if you are building a theme named “SuperAwesome” for the marketplace, your structure should look similar to the image below.

Sample of asset file structure

Preview URLs for assets

When creating preview URLs you must use your own domain name. You cannot use the HubSpot-provided domain, which has a structure of:
[AccountID].hs-sites.com

If at any point your live demo becomes inaccessible, HubSpot reserves the right, with notification to the provider, to delist/remove your asset until the live demo becomes accessible again.

Design requirements

Below are requirements that must be adhered to when designing assets.

Mobile/desktop resolutions

Your assets should display properly at common mobile and desktop resolutions/widths. This means assets should display properly when being viewed on both mobile and desktop screens. Your asset should not require users to have to scroll off-page (unless this is the intended behavior of the asset) or cause unexpected results across different browsers.

 It's recommended to test using physical devices and different browsers, but you can also use third party services, such as:

HubSpot supported browsers

All assets must be supported by HubSpot’s supported browsers. For a full list, please reference this knowledge base article.

Design aesthetics

Designs must display high aesthetic quality and be visually appealing. Below are some examples of poor design aesthetics that would invalidate a submission to the Asset Marketplace:

  • Designs are too similar to existing items: your design closely resembles an existing listing and could cause confusion in differentiating them.
  • Inconsistent spacing, padding, margin, or line-heights on elements: your design has inconsistent spacing among the elements causing users to be unable to visibility discern between sections or groups of texts.
  • Use of inappropriate, watermarked, pixelated, or unlicensed imagery: your design must use imagery that is appropriate. Images that are found through a search engine “image” search are not licensed for public use. If you are looking for free images, we recommend reading our blog post about free image sites.
  • Use of colors that are not complementary: your design should contain a color scheme that is aesthetically pleasing. When choosing color schemes, we strongly encourage you to think of accessibility standards in order to create an inclusive design.
  • Misaligned or inconsistently-placed elements: your design should have a logical visual flow and not cause visual clutter. An example of this would be having floating text boxes unintentionally overlapping in areas where text wouldn’t be expected to be placed.

Naming conventions

You must use descriptive naming conventions when labeling your assets. For example, if you are creating a module that allows users to show images in a gallery listing format with filters:

  • Good naming: Image Gallery with Filters
  • Bad naming: Gallery

When creating templates, refer to the template annotation documentation. You should use the label annotation which controls the label that content creators see when choosing a page template in the page creation flow.

Module labels, template labels, and section labels should not include the name of the asset in the label. For example, if your theme is titled "Gizmo", the label cannot contain the theme name such as "Gizmo-Slider". 

Learn more about module content requirements.

Default template content

All verbiage, images, media, and default content used in the asset must match what is advertised on the asset listing page and demo site.

For example, if your theme listing is geared towards real estate with a working demo, the end user must receive that theme. If upon purchase the end user is delivered a theme centered around fitness instead, this would be considered a bait-and-switch, which is unacceptable.

Asset variants as separate submissions are not permitted

Submitting assets with different variations of the following is not permitted:

  • Color variations: identical assets with different color schemes will not be counted as unique assets. For example, you cannot submit an asset with a blue color theme, then submit a red version of the same asset.  
  • Template layouts: submitting an asset such as “Landing page with Right Sidebar” and “Landing Page with Left Sidebar” where the sidebar is simply swapped does not equate to being unique separate instances of an asset.
  • Content variation: submitting an asset with content that is focused on Education and submitting the same asset with content focused on Real Estate does not equate to being a unique separate instance of an asset.

Inclusion of existing marketplace content is not permitted

Assets must not use elements from an existing Asset Marketplace listing. Any asset that was purchased/downloaded or is a cloned version of an asset that was purchased/downloaded from the Asset Marketplace will be rejected. 

Stylesheets and scripts

When including stylesheets or JavaScript files in your themes, it's recommended to use require_css function and require_js function when including these files. It's recommend to load render-blocking JavaScript in the footer to improve performance.

When including style sheets or JavaScript files in a theme's module, we strongly recommend linking these file dependencies to the module. Learn more about module code quality requirements.

Classes

ID and class naming conventions

When applying IDs and classes, you must use appropriate names and follow a consistent naming convention. There are many different naming convention methodologies on the web. Below are a few examples:

Default classes

You should never style your content based on default generated classes that are a part of your sites structural framework. This includes, but is not limited to, the following list of classes and IDs that are generated by HubSpot on templates and modules:

/* ids */ #hs_cos_wrapper*, #hs_form_target_dnd* /* classes */ .heading-container-wrapper, .heading-container, .body-container-wrapper, .body-container, .footer-container-wrapper, .footer-container, .container-fluid, .row-fluid, .row-fluid-wrapper, .row-depth-*, .row-number-*, .span*, .hs-cos-wrapper, .hs-cos-wrapper-widget, .dnd-section, .dnd-column, .dnd-row, .dnd-module, .dnd_area*

HubSpot default generated classes are always subject to change. Instead, you should use custom classes that are assigned either through the Design Tools in the designated class fields or through local development by adding a custom class to your element tags.

Adding classes inside the rich text editor source code

Do not include custom classes or IDs inside of content in the rich text editor through the “Source Code” option. Classes and IDs added through this option can easily be overridden (either directly or indirectly) causing perceived issues with your asset.

Redundant and unnecessary code

Your asset must not include any code or items that are not necessary for the asset to function. This includes, but is not limited to, items such as:

  • Unused style sheets or scripts 
  • Commented out code 
  • Unused code

There is a difference between commented out code and comments in code. If you are providing context in your code for clarification purposes, use the comment delimiter as this will let you comment on your code while also not having these comments show in the “View Source” or “Inspect” views of a page. See below for an example.

<p>This is a sample. When viewing source, you should only see the HTML Comment.</p> <p>HTML Comment Wrapper Start</p> <!-- This is an HTML Comment and will show in the View Source / Inspect --> <p>HTML Comment Wrapper End</p> <hr> <p>HubL Delimiter Comment Wrapper Start</p> {# This comment is using the HubL Delimiter for comments. These comments appear here but do not render in the front end #} <p>HubL Delimiter Comment Wrapper End</p> <p>This is a sample. When viewing source, you should only see the HTML Comment.</p> <p>HTML Comment Wrapper Start</p> <!-- This is an HTML Comment and will show in the View Source / Inspect --> <p>HTML Comment Wrapper End</p> <hr> <p>HubL Delimiter Comment Wrapper Start</p> <p>HubL Delimiter Comment Wrapper End</p>

Default module styles

In your theme, all of HubSpot’s default modules must be styled and must display properly on all templates submitted.

Theme, template, and module errors

A theme, along withes its templates and modules, must not display any errors in either the Design Tools or the browser console. An example of errors inside of the Design Tools are shown below:

Design Tools error console

Assets must load over HTTPS

Your listing, if using third party assets, must be loaded over HTTPS to ensure proper security. Likewise, all code must render properly when being viewed over HTTPS. This is to avoid mixed content warnings in the browser console and make sure all content displays properly.

Asset Listing Requirements

The following are requirements when listing your asset on the asset marketplace. HubSpot reserves the right to modify the information on your asset listing submission in order to comply with the following requirements.

In addition to complying with the Theme Provider Branding Guidelines, the following requirements apply to asset listings on the new marketplace that launched August 3rd, 2021. At this time, this only applies to Theme Listings on the Asset Marketplace.

Asset naming

When naming your asset make sure to use a unique name that will help your asset to stand out. The following will not be allowed when naming your asset:

  • Usage of the word “theme”, “module” or "section"  to identify the asset type. This is unnecessary as we already make sure to categorize assets by these types. 
    • Ex: “Example Theme”, “Easy Accordion Module”, “Single Send Email”
  • Your company name. Asset listings already indicate the asset provider's name and information on the listing page. 
    • Ex: “Growth by HubSpot”, “Slider | HubSpot”, “HubSpot’s Super Easy Mailer”
  • Version numbers. Our marketplace uses its own versioning system for published assets which is indicated on the asset listing. 
    • Ex: “Growth - 1.21”, “Growth v2”, “Growth 2-1”

Learn more about module naming and other content requirements.

Asset descriptions

Descriptions should be a summary of your asset and include key selling points and how your asset can help buyers achieve their goal. When writing descriptions for themes, you do not need to include a listing of the modules or templates included in the theme as we already list these for you on the asset listing page.

Images

Your images for your asset must showcase your asset itself as the primary focus of the image. At least 75% of an image's content should showcase your asset.

Your images may not contain any of the following below. If they do, we’ll remove them at our sole discretion.

  • Excessive marketing verbiage/slogans, text, or branding
    • Ex: “Over 100 features plus support!!!” or superimposing text/branding over the image of your asset.
  • Imagery of individuals (real or fictitious) posing, pointing, or holding items.
    • Ex: Using a stock image of a person holding a computer with your asset on the screen.
  • Badges and/or banners containing information related to reviews and installs of your assets, HubSpot partner tiers or badges (if any), or website performance grading. These types of data can fluctuate and have the potential to mislead others. If you’re a HubSpot partner and would like to display your partner tier and/or badge, please make sure that it’s the most current version.

Make sure to use full-size images of your asset to showcase how your asset looks and functions. The following image dimensions are strongly recommended for the best viewing experience of your asset listing. 

  • Thumbnail image:
    • Size: Minimum 480px x 360px (4:3 ratio)
    • Formats: JPG, JPEG, PNG
  • Theme images:
    • Minimum width: 1160px
    • Formats: JPG, JPEG, PNG
  • Feature images: 
    • Size: Minimum 480px × 360px (4:3 ratio)
    • Formats: JPG, JPEG, PNG
  • Client examples:
    • Size: Minimum 480px x 360px (4:3 ratio)
    • Formats: JPG, JPEG, PNG

Demo video

Your demo video should showcase your asset in action and convey proper use cases. Videos must be in mp4 format, and it's recommend to use a 4:3 or 16:9 ratio for optimal viewing.

Features

Feature titles are displayed in the Asset Marketplace list view and are one of the first things that your prospective customers see.

Use the features section to highlight key features that your asset contains. You should also explain how your asset can help to solve certain problems or use cases for potential buyers. Inside of the features section, you can use marketing based imagery to convey feature sets. For example, using a collage of images showcasing button styles.

Search tag

HubSpot provides a set of default tags to assign to your theme. If a particular tag is not available, you can add a new tag.

When choosing search tags for your assets:

  • Use tags that accurately reflect the asset being listed.
  • You may not use tags that contain the following:
    • Company names such as HubSpot or Example Company.
    • Relative terms such as "top rated," "best," or "number one."
    • Tags that describe the asset type such as "theme," "module," or "email," as these are implied based on the asset type being viewed.
    • Profanity or derogatory language.

Client examples

Client examples (i.e. functional websites of your clients) are important for customers to see how other companies are using your asset. It allows potential buyers to get an idea of how to use your asset and also see how customizable it can be. It's strongly recommended to ensure that you have written permission from your clients to link to their website. If requested, please make your client’s written permission available for verification.

Disclaimers

Asset rejections

HubSpot reserves the right to reject assets for reasons not listed above. In all cases, if rejection happens, a HubSpot Quality Assurance (QA) Engineer will provide feedback via email.

Asset resubmissions

Assets must be approved within three resubmissions or will be automatically rejected. 

The submission queue

Our QA Engineers work out of a queue of submitted assets. Assets that do not pass QA will be moved to the bottom of the queue when they are resubmitted. We are also unable to provide information about your assets position or timeframe for review in the queue due to the fluctuating volume of assets submitted. Following our directions for submitting your assets will help to ensure that your asset passes the first time in our QA Process. 

Support for published assets

Asset Marketplace Providers are responsible for all code and files that are uploaded. They must support their own work for the duration of the listing in the marketplace if there are any issues with their code or files.

Self-reviews are not allowed

Asset Marketplace Providers and their team (including others at their company who may not have worked on their asset) are not allowed to review their own listings.

Customer requests for receipt of purchase

Asset Marketplace Providers must be able to provide a detailed receipt if requested that includes:

  • Asset Listing Name
  • Asset Listing Description
  • Date of Asset Purchase
  • Price of Asset
  • VAT Tax Information (if applicable)
  • Asset Marketplace Provider Company Information

Removal of asset listings

HubSpot reserves the right to remove marketplace listings for reasons including, but not limited to:

  • Bugs are present in the asset
  • 3rd party assets in the submission break
  • The asset is not compatible with HubSpot supported browsers (Section 2.1.2).
  • Use of copyrighted material such as images, icons, fonts, audio, and video that are not licensed for distribution
  • Assets that track users without their informed, explicit opt-in consent
  • Assets (including linking to content from the Asset Marketplace or from your asset demo) that includes:
    • Promoting or engaging in illegal activities
    • Derogatory, disparaging, and/or malicious content 
    • Dishonest or false claims
    • Offensive content about race, religion, age, gender or sexual orientation
  • Modules will be removed if the module affects other elements of the page/email (see our Modules Requirements, section 5 regarding code quality)

Intellectual property violation

We respect the intellectual property rights of others and ask our asset providers to do the same. We may, in our sole discretion, suspend the access or terminate the accounts of asset providers who violate others' intellectual property rights. Please do not submit any assets (ie. themes, templates and modules) that are based on a third party’s asset unless you have permission to use that asset from the copyright owner. Also, please do not submit any assets that incorporate other companies' logos unless you obtain their permission. If you purchase any assets (either individually or as part of another product) through third-party marketplaces and modify them to work with HubSpot products, please make sure that you’re either the copyright owner of the asset or have an underlying license that permits the asset to be sold and/or distributed on third-party marketplaces like ours. Otherwise, that asset may not get approved by us. If you believe that your work has been copied in a way that constitutes copyright infringement on our asset marketplace, please follow the steps outlined in the Claims of Copyright Infringement section on our Website Terms of Use page.

HubSpot-Shutterstock integration

Assets must not include imagery from the HubSpot Shutterstock integration.

Payment gateways

HubSpot is not responsible for Payment Gateway (Stripe and PayPal) issues that may occur during the purchase process.

HubSpot offers two payment gateway options that can be connected to your Asset Marketplace Provider Account. These are Stripe and PayPal. HubSpot strongly encourages Asset Marketplace Providers to use the Stripe Payment Gateway if it is available in their country. If Stripe is not available in your country, then we recommend using the PayPal Payment Gateway.


Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.