--- title: "Interaktive Grafiken mit klickbaren Hotspots" description: "Machen Sie aus einem Bild eine Karte mit klickbaren Elementen, zeigen Sie Elemente an bestimmten Tagen und nutzen Sie sie als Kalender." url: https://scratcher.io/de/help/elements/interactive-graphic language: de --- 1. [Hilfe-Center](https://scratcher.io/de/help) 2. [Elemente und Design](https://scratcher.io/de/help/elements) 3. Interaktive Grafiken mit klickbaren Hotspots # Interaktive Grafiken mit klickbaren Hotspots Machen Sie aus einem Bild eine Karte mit klickbaren Elementen, zeigen Sie Elemente an bestimmten Tagen und nutzen Sie sie als Kalender. Eine interaktive Grafik ist ein Bild mit klickbaren Elementen darauf, zum Beispiel ein Lageplan Ihres Geschäfts, ein Messe-Hallenplan oder eine Winterlandschaft, in der jeden Tag ein neues Element erscheint. Sie ist ein Spezialformat: Sie brauchen das Add-on **Special formats** oder einen Plan, der es enthält. ## Eine interaktive Grafik erstellen 1. Klicken Sie auf **Seite hinzufügen** und wählen Sie **Interaktive Grafik**, oder fügen Sie das Element auf einer Seite ein. 2. Laden Sie im Tab **Inhalt** das Grundbild unter **Bild** hoch. 3. Klicken Sie auf **Kartenelement hinzufügen** und ziehen Sie das Element an seinen Platz auf dem Bild. 4. Klicken Sie auf das Element, um es einzurichten: - **Name**: nur für Sie sichtbar. - **Bild**: das Bild des Elements. Sie können auch **Vorher-Bild auswählen** und **Nachher-Bild auswählen** nutzen, zum Beispiel ein geschlossenes und ein geöffnetes Geschenk. - **Aktion**: **Zur Seite** oder **Link**. 5. Legen Sie im Tab **Stile** des Elements **Hover-Hintergrund**, **Größe** und **Form** fest. Aktivieren Sie unter **Einstellungen** **Festes Quadrat**, damit es quadratisch bleibt. Entfernen Sie ein Element mit **Eintrag löschen**. Mit **Positionen der Kartenelemente bearbeiten** verschieben Sie die Elemente auf der Seite. Ohne Aktion nutzt ein Element **Zum Eintrag**. ## Einstellungen für die ganze Grafik - **Bild auf volle Breite skalieren**: Das Bild füllt die Breite der Seite. - **Gemeinsames Bild für alle Elemente verwenden**: Alle Elemente nutzen dasselbe Bild. - **Aktivität der Kartenelemente planen**: Elemente sind nur zu bestimmten Zeiten aktiv. ## Elemente an bestimmten Tagen zeigen Ist **Aktivität der Kartenelemente planen** eingeschaltet, bekommt jedes Element einen **Zeitplan**: 1. Legen Sie den **Anfangszustand** des Elements fest: aktiviert oder deaktiviert. 2. Klicken Sie auf **Zeitplan hinzufügen** und wählen Sie, wann er sich ändert: **Von**, **Am (einzelner Tag)** oder **Zwischen**. Der Zeitplan aktiviert oder deaktiviert das Element, je nach seinem Anfangszustand. 3. Wählen Sie den **Datumstyp**: einen **Kampagnentag** (zum Beispiel Tag 3 der Kampagne) oder ein **Festes Datum**. ## Als Kalender nutzen Aktivieren Sie **Erweiterten Kalender aktivieren**, um jedem Element eigene Seiten, ein eigenes Spiel und eigene Gewinne zu geben, genau wie bei einem Kalendertürchen. Nutzen Sie das Add-on **Aktionen der Einträge überschreiben**, wenn manche Elemente etwas anderes tun sollen. Siehe [Advents- und Weihnachtskalender](https://scratcher.io/de/help/games/advent-and-christmas-calendars). In der Liste der Elemente wird jeder Zeitplan zusammengefasst, zum Beispiel „Ab Kampagnentag 3“, „Bis Kampagnentag 10“ oder „Kampagnentag 3–5“. Ein **Festes Datum** wählen Sie unter **Datum auswählen**. Das Add-on **Aktionen der Einträge überschreiben** trägt die Beschreibung „Eigene Aktion für Einträge erlauben“. Elemente und Design - [So funktionieren die Element-Einstellungen](https://scratcher.io/de/help/elements/element-settings-basics) - [Text und Überschriften bearbeiten](https://scratcher.io/de/help/elements/text-and-headings) - [Buttons und Klickaktionen](https://scratcher.io/de/help/elements/buttons-and-click-actions) - [Bilder, Logos, Video und Schriften](https://scratcher.io/de/help/elements/images-video-and-fonts) - [Abschnitte, Spalten, Trennlinien und Abstandshalter](https://scratcher.io/de/help/elements/sections-columns-and-layout) - [Seiteneinstellungen, Hintergründe und Popup-Seiten](https://scratcher.io/de/help/elements/page-settings-and-backgrounds) - [Countdown, Social Media, Teilen und Menü](https://scratcher.io/de/help/elements/countdown-social-share-and-menu) - [Interaktive Grafiken mit klickbaren Hotspots](https://scratcher.io/de/help/elements/interactive-graphic) - [Cookie-Hinweis, eigener Code und weitere Kampagnen-Add-ons](https://scratcher.io/de/help/elements/cookie-notice-and-custom-code) - [Vorlagen speichern und wiederverwenden](https://scratcher.io/de/help/elements/templates-and-reuse) ## Ähnliche Artikel - [Buttons und Klickaktionen](https://scratcher.io/de/help/elements/buttons-and-click-actions): Legen Sie fest, was passiert, wenn jemand auf einen Button oder ein Bild klickt: nächste Seite, ein Link, Spielen, Absenden, Teilen, Herunterladen und mehr. - [Advents- und Weihnachtskalender: Schritt für Schritt einrichten](https://scratcher.io/de/help/games/advent-and-christmas-calendars): Wählen Sie zwischen Weihnachtskalender, Adventskalender und freiem Kalender, legen Sie die Daten fest, gestalten Sie die Türchen, legen Sie hinter jedes Türchen ein Spiel und einen Gewinn und testen Sie jeden Tag, bevor Sie live gehen. - [Countdowns, Vorregistrierung und Seiten für beendete Kampagnen](https://scratcher.io/de/help/games/special-pages): Sorgen Sie vor dem Start mit einem Countdown für Spannung, sammeln Sie Anmeldungen vor dem Start, zeigen Sie eine Seite, wenn die Kampagne beendet ist, und lassen Sie Menschen Fotos hochladen. ## Brauchen Sie noch Hilfe? Echte Menschen helfen Ihnen gern. Wenn Sie Scratcher bereits nutzen, ist der Chat in der Plattform der schnellste Weg. - **[Chatten Sie mit uns](https://platform.scratcher.io/login)** Melden Sie sich an und klicken Sie unten rechts auf den Chat-Button. Rex antwortet sofort, und unser Team ist nur einen Klick entfernt. - **[Termin buchen](https://scratcher.io/de/book-a-meeting)** Ein kostenloser 30-minütiger Videocall mit unserem Team: eine Tour, Kampagnenideen oder Hilfe bei Ihrer Einrichtung. - **[Schreiben Sie uns](mailto:kontakt@scratcher.io)** Schreiben Sie an kontakt@scratcher.io, und wir melden uns bei Ihnen.