HubSpot-Marketplace für Vorlagen – Compliance, Design, Code-Qualität und Listing

Anbieter von Inhaltselementen im Marketplace müssen die folgenden von HubSpot festgelegten Standards einhalten, wenn sie Designs (zusammen mit den Vorlagen und Modulen des Designs) einreichen. Diese Standards gelten für alle Inhaltselemente im Marketplace. 

Marketplace-Anbieter müssen ihre Anbieterinformationen jederzeit auf dem neuesten Stand halten. HubSpot behält sich das Recht vor, jedes Listing eines Inhaltselements zu entfernen oder abzulehnen, wenn Anbieterinformationen (wie E-Mail oder Website) ungenau sind, fehlen oder nicht mehr funktionieren.

Derzeit können Sie nur Designs beim Vorlagen-Marketplace einreichen. Vorlagen und Module können nur als Teil eines Designs eingereicht werden. Designs können keine Funktionen wie HubDB und serverlose Funktionen verwenden. Erfahren Sie mehr über Design-Limits.

Inhaltselementdateien von Drittanbietern müssen in das HubSpot CDN geladen werden, sofern sie nicht von einer zuverlässigen Quelle stammen, wieJSDelivr, Google Hosted Libraries oder CDNJS. Diese Elemente können über die @import-Funktion zum Stylesheet hinzugefügt werden.

Hinweis: Wenn Sie Dateien in ein Modul einschließen, müssen Sie die Parameter css_assets und js_assets in Ihrer meta.json-Datei verwenden (Abschnitt zu verknüpften Dateien in Design-Tools).

Anbieter im HubSpot Vorlagen-Marketplace dürfen bis zu 20 kostenlose Designs anbieten, ausschließlich Designs, die über das Design-Accelerator-Programm eingereicht wurden

Alle Inhaltselemente sollten eine ordnungsgemäße Ordnerstruktur enthalten und unter einem „übergeordneten“ Ordner gruppiert werden, der Ihr Produkt-Listing beschreiben sollte. Wenn Sie beispielsweise ein Design mit dem Namen „Super-Toll“ für den Marketplace erstellen, sollte Ihre Struktur ähnlich dem Bild unten aussehen.

Wenn Sie Vorschau-URLs erstellen, müssen Sie Ihren eigenen Domain-Namen verwenden. Sie können nicht die von HubSpot bereitgestellte Domain verwenden, die folgende Struktur hat:
[AccountID].hs-sites.com

Nachfolgend finden Sie Anforderungen, die beim Entwerfen von Inhaltselementen eingehalten werden müssen.

Ihre Inhaltselemente sollten bei den gängigen Auflösungen/Breiten von Mobilgeräten und Desktops korrekt angezeigt werden. Dies bedeutet, dass Inhaltselemente korrekt angezeigt werden sollten, wenn sie sowohl auf mobilen Bildschirmen als auch auf Desktop-Bildschirmen angezeigt werden. Für Ihr Inhaltselement sollten Nutzer nicht außerhalb der Seite scrollen müssen (es sei denn, dies ist das beabsichtigte Verhalten des Inhaltselemente) und es sollte nicht unerwartete Ergebnisse in verschiedenen Browsern verursachen.

 Es wird empfohlen, physische Geräte und verschiedene Browser zu testen. Sie können jedoch auch Dienste von Drittanbietern verwenden, z. B.:

• BrowserStack
• Responsinator
• Sauce Labs

Alle Inhaltselemente müssen von HubSpot unterstützten Browsern unterstützt werden. Eine vollständige Liste finden Sie in diesem Wissensdatenbank-Artikel.

Designs müssen von hoher ästhetischer Qualität und visuell ansprechend sein. Nachfolgend finden Sie einige Beispiele für eine schlechte Designästhetik, die eine Einreichung beim Marketplace für Vorlagen ungültig machen würden:

• Das Design ähnelt zu sehr vorhandenen Vorlagen: Ihr Design weist eine erhebliche Ähnlichkeit zu einem bestehenden Listing auf und könnte zu Verwirrung bei der Unterscheidung führen.
• Inkonsistente Abstände, Auffüllungen, Ränder oder Zeilenhöhen in Elementen: Ihr Design hat einen inkonsistenten Abstand zwischen den Elementen, wodurch Nutzer nicht in der Lage sind, zwischen Abschnitten oder Textgruppen zu unterscheiden.
• Verwendung unangemessener, mit Wasserzeichen versehener, verpixelter oder nicht lizenzierter Bilder: Ihr Design muss Bilder verwenden, die angemessen sind. Bilder, die über die „Bild“-Suche einer Suchmaschine gefunden werden, sind nicht für die öffentliche Verwendung lizensiert. Wenn Sie nach kostenlosen Bildern suchen, empfehlen wir Ihnen, unseren Blog-Beitrag über kostenlose Seiten für Bilder zu lesen.
• Verwendung von Farben, die nicht komplementär sind: Ihr Design sollte ein Farbschema enthalten, das ästhetisch ansprechend ist. Wenn Sie sich für Farbschemata entscheiden, empfehlen wir Ihnen dringend, an Standards der Barrierefreiheit zu denken, um ein integratives Design zu erstellen.
• Nicht aufeinander abgestimmte oder inkohärent platzierte Elemente: Ihr Design sollte einen logischen visuellen Fluss haben und kein visuelles Durcheinander verursachen. Ein Beispiel dafür wäre, dass sich fließende Textfelder ungewollt in Bereichen überlappen, in denen man an sich keinen Text erwartet.

Bei der Kennzeichnung Ihrer Inhaltselemente müssen Sie aussagekräftige Namenskonventionen verwenden. Wenn Sie beispielsweise ein Modul erstellen, über das Nutzer Bilder in einem Galerie-Listing-Format mit Filtern anzeigen können:

• Gute Benennung: Bildergalerie mit Filtern
• Schlechte Benennung: Galerie

Informationen zum Erstellen von Vorlagen finden Sie in der Dokumentation für Vorlagenanmerkungen. Sie sollten die label-Anmerkung verwenden, die das Label steuert, das Content-Autoren bei der Auswahl einer Seitenvorlage im Seitenerstellungsablauf sehen.

Modullabel, Vorlagenlabel und Abschnittslabel sollten nicht den Namen des Inhaltselements im Label enthalten. Wenn Ihr Design beispielsweise den Titel „Gizmo“ trägt, darf das Label nicht den Designnamen wie „Gizmo-Slider“ enthalten. 

Erfahren Sie mehr über Anforderungen an Modulinhalte.

Alle im Inhaltselement verwendeten Slogans, Bilder und Standardinhalte müssen mit dem übereinstimmen, was auf der Listing-Seite und Demo-Website des Inhaltselements beworben wird.

Wenn Ihr Design-Listing beispielsweise auf Immobilien mit einer funktionierenden Demo ausgerichtet ist, muss der Endbenutzer dieses Design erhalten. Wenn beim Kauf dem Endbenutzer stattdessen ein Design bereitgestellt wird, das sich um Fitness dreht, würde dies als Lockvogeltaktik gelten und damit inakzeptabel sein.

Die Einreichung von Inhaltselementen mit unterschiedlichen Varianten bei Folgendem ist nicht zulässig:

• Farbvarianten: identische Inhaltselemente mit unterschiedlichen Farbdesigns werden nicht als einzigartige Inhaltselemente gezählt. Sie können beispielsweise kein Inhaltselement mit einem blauen Farbdesign einreichen und dann eine rote Version des gleichen Inhaltselements einreichen.  
• Vorlagenlayouts: Das Einreichen eines Elements wie „Landingpage mit rechter Seitenleiste“ und „Landingpage mit linker Seitenleiste“, bei dem die Seitenleiste einfach vertauscht wird, bedeutet nicht, dass es sich um eindeutige separate Instanzen eines Inhaltselements handelt.
• Inhaltsvariante: Das Einreichen eines Elements mit Inhalten, die sich auf Bildung konzentrieren, und das Einreichen desselben Inhaltselements mit Inhalten, die sich auf Immobilien konzentrieren, bedeutet nicht, dass es sich um eine einzigartige separate Instanz eines Inhaltselements handelt.

Inhaltselemente dürfen keine Elemente von einem bestehenden Listing im Marketplace für Vorlagen verwenden. Ein Inhaltselement, das gekauft/heruntergeladen wurde oder eine geklonte Version eines Inhaltselements ist, das im Marketplace für Vorlagen gekauft bzw. von diesem heruntergeladen wurde, wird abgelehnt. 

Beim Einfügen von Stylesheets oder JavaScript-Dateien in Ihre Designs wird empfohlen, die require_css-Funktion und die require_js-Funktion zu verwenden. Es wird empfohlen, Render-Blocking-JavaScript im Footer zu laden, um die Performance zu verbessern.

Wenn Sie Stylesheets oder JavaScript-Dateien im Modul eines Designs einschließen, empfehlen wir dringend, diese Dateiabhängigkeiten zum Modul zu verknüpfen. Erfahren Sie mehr über Anforderungen an die Qualität von Modulcode.

Beim Anwenden von IDs und Klassen müssen Sie geeignete Namen verwenden und eine konsistente Namenskonvention befolgen. Es gibt viele verschiedene Methoden der Namenskonvention im Web. Im Folgenden sind einige Beispiele aufgeführt:

• BEM: https://en.bem.info/methodology/naming-convention/
• ABEM: https://css-tricks.com/abem-useful-adaptation-bem/
• ITCSS: https://www.xfive.co/blog/itcss-scalable-maintainable-css-architecture/
  • https://www.creativebloq.com/web-design/manage-large-css-projects-itcss-101517528

Sie sollten Ihre Inhalte niemals anhand von standardmäßig generierten Klassen formatieren, die Teil des strukturellen Frameworks Ihrer Website sind. Dies beinhaltet (ist aber nicht darauf beschränkt) die folgende Liste von Klassen und IDs, die von HubSpot in Vorlagen und Modulen generiert werden:

Standardmäßig von HubSpot generierte Klassen können sich jederzeit ändern. Stattdessen sollten Sie benutzerdefinierte Klassen verwenden, die entweder über die Design-Tools in den angegebenen Klassenfeldern oder durch lokale Entwicklung zugewiesen werden, indem Ihren Element-Tags eine benutzerdefinierte Klasse hinzugefügt wird.

Fügen Sie keine benutzerdefinierten Klassen oder IDs über die Option „Quellcode“ in die Inhalte des Rich-Text-Editors ein. Klassen und IDs, die über diese Option hinzugefügt werden, können leicht überschrieben werden (entweder direkt oder indirekt), was zu Problemen mit Ihrem Inhaltselement führen kann.

Ihr Inhaltselement darf keinen Code oder Elemente enthalten, die für das Funktionieren des Inhaltselements nicht erforderlich sind. Dies umfasst (ist aber nicht darauf beschränkt) unter anderem folgende Elemente:

• Nicht verwendete Stylesheets oder Skripts 
• Auskommentierter Code 
• Nicht verwendeter Code

Es gibt einen Unterschied zwischen auskommentiertem Code und Kommentaren im Code. Wenn Sie Kontext in Ihrem Code zu Klärungszwecken angeben, verwenden Sie den Kommentarbegrenzer, da Sie so Ihren Code kommentieren können, während diese Kommentare auch nicht in den Ansichten „Quelle anzeigen“ oder „Überprüfen“ einer Seite angezeigt werden. Im Folgenden finden Sie ein Beispiel.

In Ihrem Design müssen alle Standardmodule von HubSpot formatiert sein und in allen eingereichten Vorlagen korrekt angezeigt werden.

Ein Design darf zusammen mit seinen Vorlagen und Modulen weder in den Design-Tools noch in der Browser-Konsole Fehler anzeigen. Ein Beispiel für Fehler in den Design-Tools finden Sie unten:

Ihr Listing muss, wenn Inhaltselemente von Drittanbietern verwendet werden, über HTTPS geladen werden, um eine angemessene Sicherheit zu gewährleisten. Ebenso müssen alle Codes korrekt gerendert werden, wenn sie über HTTPS angezeigt werden. Dies dient dazu, gemischte Inhaltswarnungen in der Browser-Konsole zu vermeiden und sicherzustellen, dass alle Inhalte ordnungsgemäß angezeigt werden.

Die folgenden Anforderungen gelten, wenn Sie Ihr Inhaltselement im Marketplace für Vorlagen listen. HubSpot behält sich das Recht vor, die Informationen bei der Einreichung Ihres Inhaltselement-Listings zu ändern, um die folgenden Anforderungen zu erfüllen.

Wenn Sie Ihr Inhaltselement benennen, stellen Sie sicher, dass Sie einen eindeutigen Namen verwenden, der Ihrem Inhaltselement hilft, sich von anderen abzuheben. Folgendes ist nicht zulässig, wenn Sie Ihr Inhaltselement benennen:

• Verwendung des Wortes „Design“, „Modul“ oder „Abschnitt“ zur Identifizierung des Inhaltselementtyps. Dies ist unnötig, da wir bereits sicherstellen, dass Inhaltselemente anhand dieser Typen kategorisiert werden. 
  • Beispiel: „Beispieldesign“, „Einfaches Accordion-Modul“, „Single-Send-E-Mail“
• Ihr Unternehmensname. Auf der Listing-Seite geben Sie bereits den Namen und die Informationen des Anbieters des Inhaltselements an. 
  • Beispiel: „Wachstum durch HubSpot“, „Slider | HubSpot“, „HubSpots Super Easy Mailer“
• Versionsnummern. Unser Marketplace verwendet ein eigenes Versionierungssystem für veröffentlichte Inhaltselemente, das im Listing des Inhaltselements angegeben ist. 
  • Beispiel: „Wachstum – 1,21“, „Wachstum v2“, „Wachstum 2-1“

Erfahren Sie mehr über Modulbenennung und andere Inhaltsanforderungen.

Beschreibungen sollten eine Zusammenfassung Ihres Inhaltselements sein und wichtige Verkaufsargumente enthalten und wie Ihr Inhaltselement den Käufern helfen kann, ihr Ziel zu erreichen. Beim Verfassen von Beschreibungen für Designs müssen Sie kein Listing der im Design enthaltenen Module oder Vorlagen einschließen, da wir diese bereits auf der Listing-Seite des Inhaltselements für Sie listen.

Ihre Bilder für Ihr Inhaltselement müssen Ihr Inhaltselement selbst als primären Fokus des Bildes präsentieren. Ihr Inhaltselement sollte mindestens 75 % des Bildinhalts einnehmen.

Ihre Bilder dürfen keine der folgenden Aspekte enthalten. Wenn dies der Fall ist, werden wir sie nach eigenem Ermessen entfernen.

• Übermäßig viel Marketingsprache/Slogans, Text oder Branding
  • Beispiel: „Über 100 Funktionen plus Support!!!“ oder das Überlagern von Text/Branding über das Bild Ihres Elements.
• Bilder von Personen (real oder fiktiv), die posieren, auf etwas zeigen oder Gegenstände halten.
  • Beispiel: Verwendung eines Bildes einer Person, die einen Computer hält, auf dessen Bildschirm Ihr Inhaltselement zu sehen ist.
• Abzeichen und/oder Banner mit Informationen zu Bewertungen und Installationen Ihrer Inhaltselemente, HubSpot-Partnerstufen oder -Abzeichen (falls vorhanden) oder zur Bewertung der Website-Performance. Diese Typen von Daten können schwanken und deshalb potenziell andere irreführen. Wenn Sie HubSpot-Partner sind und Ihre Partnerstufe und/oder Ihren Abzeichen anzeigen möchten, vergewissern Sie sich bitte, dass es sich um die aktuellste Version handelt.

Um zu zeigen, wie Ihr Inhaltselement aussieht und funktioniert, stellen Sie sicher, dass Sie Bilder von diesem in voller Größe verwenden. Die folgenden Bildmaße werden dringend empfohlen, um eine optimale Anzeige des Listings Ihres Inhaltselements zu erzielen. 

• Thumbnail-Bild:
  • Größe: Mindestens 480 Pixel x 360 Pixel (4:3-Verhältnis)
  • Formate: JPG, JPEG, PNG
• Designbilder:
  • Minimale Breite: 1160 Px
  • Formate: JPG, JPEG, PNG
• Feature-Bilder: 
  • Größe: Mindestens 480 Pixel x 360 Pixel (4:3-Verhältnis)
  • Formate: JPG, JPEG, PNG
• Kundenbeispiele
  • Größe: Mindestens 480 Pixel x 360 Pixel (4:3-Verhältnis)
  • Formate: JPG, JPEG, PNG

Ihr Demo-Video sollte Ihr Inhaltselement in Aktion präsentieren und geeignete Anwendungsfälle vermitteln. Videos müssen im mp4-Format vorliegen und es wird empfohlen, ein Verhältnis von 4:3 oder 16:9 zu verwenden, um sie optimal anzuzeigen.

Funktionstitel werden in der Marketplace für Vorlagen-Listenansicht angezeigt und sind eines der ersten Dinge, die Ihre potenziellen Kunden sehen.

Verwenden Sie den Abschnitt für Funktionen, um die wichtigsten Funktionen hervorzuheben, die Ihr Inhaltselement enthält. Sie sollten außerdem erläutern, wie Ihr Inhaltselement helfen kann, bestimmte Probleme oder Anwendungsfälle für potenzielle Käufer zu lösen. Innerhalb des Abschnitts „Funktionen“ können Sie marketingorientierte Bilder verwenden, um die Merkmale zu vermitteln. Verwenden Sie beispielsweise eine Collage von Bildern, die Schaltflächenstile präsentieren.

HubSpot bietet eine Reihe von Standard-Tags, die Sie Ihrem Design zuweisen können. Wenn ein bestimmtes Tag nicht verfügbar ist, können Sie ein neues Tag hinzufügen.

Bei der Auswahl von Such-Tags für Ihre Elemente:

• Verwenden Sie Tags, die das gelistete Inhaltselement genau wiedergeben.
• Sie dürfen keine Tags verwenden, die Folgendes enthalten:
  • Unternehmensnamen wie HubSpot oder Beispielunternehmen.
  • Relative Begriffe wie „am besten bewertet“, „bestes“ oder „Nummer eins“.
  • Tags, die den Inhaltselement-Typ wie „Design“, „Modul“ oder „E-Mail“ beschreiben, da diese auf der Grundlage des angezeigten Inhaltselement-Typs impliziert werden.
  • Obszönität oder abfällige Sprache.

Kundenbeispiele (d. h., funktionale Websites Ihrer Kunden) sind für Kunden wichtig, um zu sehen, wie andere Unternehmen Ihr Inhaltselement nutzen. Es ermöglicht potenziellen Käufern, sich ein Bild davon zu machen, wie Sie Ihr Inhaltselement nutzen, und auch zu sehen, wie individuell es gestaltet werden kann. Es wird dringend empfohlen, sicherzustellen, dass Sie die schriftliche Erlaubnis Ihrer Kunden haben, zu ihrer Website zu verlinken. Wenn gewünscht, stellen Sie bitte die schriftliche Erlaubnis Ihres Kunden zur Verifizierung zur Verfügung.

HubSpot behält sich vor, Inhaltselementen auch aus nicht oben aufgeführten Gründen abzulehnen. In allen Fällen, in denen eine Ablehnung erfolgt, erhalten Sie von einem HubSpot Quality Assurance (QA)-Ingenieur eine Rückmeldung per E-Mail.

Inhaltselemente müssen innerhalb von drei erneuten Einreichungen genehmigt werden oder sie werden automatisch abgelehnt. 

Unsere QA-Ingenieure arbeiten eine Warteschlange von eingereichten Inhaltselementen ab. Inhaltselemente, die die QA nicht bestanden haben, werden am Ende der Warteschlange hinzugefügt, wenn diese erneut eingereicht werden. Aufgrund des schwankenden Volumens der eingereichten Inhaltselemente können wir auch keine Informationen zur Position oder den Zeitrahmen Ihres Inhaltselements für die Überprüfung in der Warteschlange bereitstellen. Durch das Befolgen unserer Anweisungen zum Einreichen Ihrer Inhaltselemente können Sie einfacher sicherstellen, dass Ihr Inhaltselement unserem QS-Prozess bereits beim ersten Mal besteht. 

Anbieter im Marketplace für Vorlagen sind für alle Codes und Dateien verantwortlich, die hochgeladen werden. Sie müssen ihre eigenen Arbeit für die Dauer des Listings im Marketplace unterstützen, wenn Probleme mit ihrem Code oder ihren Dateien bestehen.

Anbieter im Marketplace für Vorlagen und deren Team (einschließlich anderer Personen in ihrem Unternehmen, die möglicherweise nicht an ihrem Inhaltselement gearbeitet haben) sind nicht berechtigt, ihre eigenen Listings zu überprüfen.

Anbieter im Marketplace für Vorlagen müssen in der Lage sein, einen detaillierten Beleg bereitzustellen, wenn dies verlangt wird, der Folgendes umfasst:

• Name des Inhaltselement-Listings
• Beschreibung des Inhaltselement-Listings
• Datum des Kaufs des Inhaltselements
• Preis des Inhaltselements
• Umsatzsteuerinformationen (falls zutreffend)
• Unternehmensinformationen des Anbieters im Marketplace für Vorlagen

HubSpot behält sich das Recht vor, Marketplace-Listings aus folgenden Gründen zu entfernen:

• Im Inhaltselement sind Fehler vorhanden
• Drittanbieter haben die Einreichung Ihrer Inhaltselemente pausiert
• Das Inhaltselement ist nicht mit von HubSpot unterstützten Browsern kompatibel (Abschnitt 2.1.2).
• Es wird urheberrechtlich geschütztes Material wie Bilder, Symbole, Schriftarten, Audio und Video verwendet, das nicht für den Vertrieb lizensiert ist
• Es werden Inhaltselemente verwendet, die Nutzer ohne deren informierte, explizite Einwilligung (Opt-in) nachverfolgen.
• Es werden Inhaltselemente (einschließlich Links zu Inhalten im Marketplace für Vorlagen oder aus Ihrer Inhaltselement-Demo) verwendet, die Folgendes enthalten:
  • Werbung für oder Teilnahme an rechtswidrige(n) Aktivitäten
  • Abwertende, abfällige und/oder böswillige Inhalte 
  • Unehrliche oder falsche Behauptungen
  • Beleidigende Inhalte über Rasse, Religion, Alter, Geschlecht oder sexuelle Ausrichtung
• Module werden gelöscht, wenn das Modul andere Elemente der Seite/E-Mail beeinträchtigt (siehe unsere Modulanforderungen, Abschnitt 5 zur Code-Qualität)

Wir respektieren das Recht am geistigen Eigentum von anderen und wir bitten unsere Anbieter von Inhaltselementen, dies ebenfalls zu tun. Wir können nach eigenem Ermessen den Zugriff von Nutzern aussetzen oder die Accounts von Anbieter von Vorlagen auflösen, die das Recht am geistigen Eigentum anderer verletzen. Bitte reichen Sie keine Inhaltselemente (d. h. Designs, Vorlagen und Module) ein, die auf dem Inhaltselement eines Dritten basieren, es sei denn, Sie haben die Erlaubnis des Urheberrechtsinhabers zur Nutzung dieses Inhaltselements. Bitte reichen Sie auch keine Inhaltselemente ein, die die Logos anderer Unternehmen enthalten, es sei denn, Sie erhalten deren Erlaubnis. Wenn Sie Inhaltselemente (entweder einzeln oder als Teil eines anderen Produkts) über den Marketplace eines Drittanbieters erwerben und diese so modifizieren, dass sie mit HubSpot-Produkten funktionieren, stellen Sie bitte sicher, dass Sie entweder der Urheberrechtsinhaber des Inhaltselements sind oder über eine zugrundeliegende Lizenz verfügen, die den Verkauf und/oder die Verbreitung des Inhaltselements auf dem Marketplace eines Drittanbieters wie unserem ermöglicht. Andernfalls wird dieses Inhaltselement möglicherweise nicht von uns genehmigt. Wenn Sie der Meinung sind, dass Ihre Arbeit in einer Weise kopiert wurde, die eine Urheberrechtsverletzung in unserem Marketplace für Vorlagen darstellt, befolgen Sie bitte die Schritte, die im Abschnitt zu Ansprüchen bei Urheberrechtsverletzungen in den Nutzungsbedingungen für unsere Website beschrieben sind.

Inhaltselemente dürfen keine Bilder aus der Shutterstock-Integration von HubSpot enthalten.

HubSpot bietet zwei Zahlungsgateway-Optionen, die mit Ihrem Anbieter-Account für den HubSpot-Marketplace für Vorlagen verknüpft werden können. Dies sind Stripe und PayPal. HubSpot ermutigt Anbieter im Marketplace für Vorlagen, das Stripe-Zahlungsgateway zu verwenden, wenn es in ihrem Land verfügbar ist. Wenn Stripe nicht in Ihrem Land verfügbar ist, empfehlen wir, das PayPal-Zahlungsgateway zu verwenden.