> ## Documentation Index
> Fetch the complete documentation index at: https://developers.hubspot.de/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Globaler Content

> Globaler Content ist Inhalt, der in allen Vorlagen wiederverwendet werden kann, um konsistente Informationen wie Header und Footer, Seitenleisten, Logos oder andere Komponenten zu erstellen.

Globaler Content ist Inhalt, der über Teile einer Website verteilt ist. Häufige Beispiele sind Website-Header, -Footer und Seitenleisten. Als Entwickler legen Sie fest, welche Komponenten global sein sollen, indem sie globale Teilvorlagen verwenden oder Module global machen. HubSpot stellt Content-Autoren eine andere Bearbeitungsumgebung bereit, die es ihnen erleichtert, den globalen Content zu bearbeiten und die Änderungen vor der Veröffentlichung seitenübergreifend in der Vorschau anzuzeigen. Um mehr darüber zu erfahren, wie Sie Ihren globalen Content bearbeiten können, lesen Sie bitte den Artikel über die [Verwendung von globalem Content in mehreren Vorlagen](https://knowledge.hubspot.com/design-manager/use-global-content-across-multiple-templates) in der HubSpot-Wissensdatenbank.

<Frame>
  <img src="https://cdn2.hubspot.net/hubfs/53/5Cdocs/global-content/global-content-editor-4.png" alt="Editor für globalen Content" />
</Frame>

## Überblick

Globaler Content wird am besten zur Anzeige der gleichen Informationen auf mehreren Seiten verwendet. Zum Beispiel den Header und Footer Ihrer Website, z. B. den Header oben auf dieser Seite.

<Frame>
  <img src="https://www.hubspot.com/hubfs/Knowledge_Base_2021/Developer/hubspot-developers-header.png" alt="hubspot-developers-header" />
</Frame>

Im Folgenden finden Sie einige weitere Beispiele für Bereiche, in denen Sie globalen Content verwenden können:

* Sekundäre Navigation für verschiedene Abschnitte Ihrer Website
* Copyright-Footer (oder Unterfußzeilen)
* Seitenleisten für Blogbeiträge (zur Anzeige der letzten Beiträge, Autorenlisten und mehr)

<Warning>
  Da globaler Content an mehreren Stellen auf einer Website verwendet wird, ist es umso wichtiger, dass Sie [Ihre globalen Teilvorlagen und Module barrierefrei gestalten und entwickeln](/cms/best-practices/improve-existing-sites/accessibility).
</Warning>

### Globale Teilvorlagen vs. Globale Module

Als Entwickler können Sie globale Teilvorlagen und globale Module erstellen, mit einigen wesentlichen Unterschieden zwischen ihnen:

* Globale Teilvorlagen sind eine Art von Vorlage, die mit HTML & HubL erstellt wurde und auf Ihrer gesamten Website wiederverwendet werden kann. Die gebräuchlichsten Arten von globalen Teilverlagen sind Header, Seitenleisten- und Footer von Websites.
* Globale Module sind Module, die aus einzelnen oder mehreren Inhalten bestehen, die auf mehreren Seiten Ihrer Website verwendet werden können. Einige häufige Arten von globalen Modulen können Elemente wie Blog-Abonnementformulare, sekundäre Navigationselemente und Calls-to-Action sein.

Sie sollten es vermeiden, globale Module in globale Teilvorlagen aufzunehmen, da dies zu einem negativen Content-Bearbeitungserlebnis führen kann.

<Info>
  Alle Module und Felder in Ihren globalen Teilvorlagen und globalen Modulen lassen sich problemlos im [Editor für globalen Content](https://knowledge.hubspot.com/design-manager/use-global-content-across-multiple-templates) bearbeiten.
</Info>

## Globale Teilvorlagen

### Eine globale Teilvorlage erstellen

Eine globale Teilvorlage ist ein Typ von Vorlage, den Sie lokal über das HubSpot CLI erstellen können, indem Sie den [create-Befehl](https://developers.hubspot.de/docs/guides/cms/tools/local-development-cli#create) wie unten gezeigt verwenden.

```shell theme={null}
hs create template <partial-file-name>
```

Wenn Sie aufgefordert werden, einen Typ von Vorlage auszuwählen, wählen Sie `global partial` aus.

Dadurch wird Ihre Vorlage im gewünschten Verzeichnis erstellt und die HTML-Datei enthält die folgenden Annotationen zur Vorlage.

```html theme={null}
<!--
  templateType: global_partial
  label: Page Header
-->
```

Ein Beispiel für eine Teilvorlage mit globalen Content bietet [unsere Boilerplate bei GitHub.](https://github.com/HubSpot/cms-theme-boilerplate/blob/main/src/templates/partials/header.html)

### Drag-&-Drop-Bereiche zu globalen Teilvon hinzufügen

Sie können Drag-&-Drop-Funktionen für Inhalte in Ihren Teilvorlage mit globalen Content aktivieren, indem Sie `dnd_area`-Tags hinzufügen, ähnlich wie bei der Aktivierung in Seitenvorlagen. Weitere Informationen finden Sie in der [Dokumentation zum Drag-&-Drop-Bereich](/cms/reference/hubl/tags/dnd-areas).

### Eine Teilvorlage in Ihrer vorhandenen Vorlage berücksichtigen

Um eine Teilvorlage mit globalen Content in eine Ihrer bestehenden Vorlagen einzufügen, verwenden Sie das HubL-Tag `global_partial` und verweisen dabei auf den Pfad zu Ihrer Teilvorlage. Nachfolgend finden Sie ein Beispiel aus [der CMS-Boilerplate](https://github.com/HubSpot/cms-theme-boilerplate/blob/main/src/templates/layouts/base.html#L21), das dieses Tag verwendet.

```hubl theme={null}
{% global_partial path="../partials/header.html" %}
```

Wenn globale Teilvorlagen ausgegeben werden, enthalten sie ein `<div>`-Wrapping um die globale Teilvorlage. Dies wird vom Seiten-Editor verwendet, um zu erkennen, dass es sich um eine globale Teilvorlage handelt.

```html theme={null}
<div
  data-global-resource-path="cms-theme-boilerplate/templates/partials/header.html"
>
  <!-- Your header.html code is output here -->
</div>
```

<Warning>
  ### Bitte beachten:

  Verwenden Sie `global_partial` nicht innerhalb des `<head>` einer Vorlage. Dies würde zu ungültigem HTML führen.

  In den meisten Situationen, in denen Sie eine globale Teilvorlage im Header verwenden sollten, ist es möglicherweise sinnvoller, stattdessen ein globales Modul mit einem [`{%require_head%}`](/cms/reference/hubl/tags/standard-tags#require-head) zu verwenden, um benutzerdefinierten Code in den Header einzufügen und trotzdem Modulfelder bereitzustellen.
</Warning>

## Globale Module

Sie können globale Module wie jedes andere Modul mithilfe des CLI erstellen, indem Sie den `hs create`-Befehl wie unten gezeigt ausführen.

```shell theme={null}
hs create module <module_name>
```

Ein globales Modul unterscheidet sich durch das `global`-Flag in der `meta.json`-Datei des Moduls.

```json theme={null}
// meta.json file
{
  "css_assets": [],
  "external_js": [],
  "global": true,
  "help_text": "",
  "host_template_types": ["PAGE"],
  "js_assets": [],
  "other_assets": [],
  "smart_type": "NOT_SMART",
  "tags": [],
  "is_available_for_new_content": false
}
```

Sie können auch [globale Module in HubSpot mithilfe des Design-Managers erstellen](https://knowledge.hubspot.com/design-manager/create-and-edit-modules).

Erfahren Sie mehr über das Arbeiten mit Modulen in den folgenden verwandten Ressourcen:

* [Überblick über Module](https://developers.hubspot.de/docs/guides/cms/content/modules/overview)
* [Standardmodule von HubSpot](/cms/reference/modules/default-modules)
* [Konfigurieren von Modulen](/cms/reference/modules/configuration)
* [Verwenden von Modulen in Vorlagen](/cms/reference/modules/using-modules-in-templates)
