Designvorlage · Widget-Katalog
Willkommen bei Novamag
Das ist deine erste Designvorlage – von uns für dich erstellt. Hier siehst du die Widgets des Editors auf einer Seite: was sie können, wofür sie gedacht sind und wie sie aussehen.
Der Editor
Was ist der Novamag Editor?
Der Novamag Editor ist das zentrale Werkzeug zur Gestaltung deines Digitalmagazins. Er arbeitet visuell und zeigt dir die Seite so, wie sie später aussieht.
Layouts bestimmen die Struktur, zum Beispiel mit Containern, Spalten oder Rastern. Widgets bringen Inhalte auf die Seite: Texte, Bilder, Videos, Zahlen oder externe Einbindungen. Über die Einstellungen steuerst du Farben, Schriften, Abstände und Hintergründe – für jede Bildschirmgröße einzeln.
Alle Widgets folgen derselben Baukastenlogik und lassen sich frei kombinieren. Die Karten unten zeigen die Widgets mit ihrem Namen im Editor, einem Satz zum Einsatzzweck und einem Live-Beispiel.
01 / 05 · Layout
Struktur geben
Layout-Widgets bauen das Gerüst einer Seite. Sie tragen keine eigenen Inhalte, sondern ordnen, rahmen und verteilen alle anderen Widgets.
Container
Container
Der Rahmen für alles: Hintergrund aus Farbe, Bild oder Video, Innenabstand, Breite, Ausrichtung und Mindesthöhe.
Container
Ich bin ein Container
Mit Hintergrundfarbe, Innenabstand und runden Ecken. Container lassen sich verschachteln – diese Karte ist selbst einer.
Column Layout
Spalten
Teilt Inhalte in zwei bis vier Spalten, die sich auf kleinen Bildschirmen automatisch untereinanderstellen.
Erste Spalte
Spalten stehen nebeneinander und teilen sich die Breite nach Anteilen.
Zweite Spalte
Unter 1024 Pixeln rutschen sie automatisch untereinander.
Dritte Spalte
Jede Spalte hat eigenen Hintergrund und Innenabstand.
Grid
Raster
Ein freies Raster aus Zellen, die sich über mehrere Spalten oder Zeilen strecken lassen – für Kacheln, Teaser und Übersichten.
Zwei Spalten breit
Zellen können sich über mehrere Spalten strecken – ideal für einen Aufmacher.
Eine Zelle
Standardgröße, gleiche Abstände.
Noch eine
Das Raster ordnet alles automatisch.
Tablet: zwei
Pro Gerät legst du fest, wie viele Spalten eine Reihe hat.
Handy: eine
Auf dem Smartphone steht alles untereinander.
Divider
Trenner
Eine Linie zwischen zwei Gedanken, in Stärke, Farbe, Stil und Breite einstellbar.
Spacer
Abstand
Unsichtbar, aber wichtig: sorgt für einen gleichmäßigen Rhythmus zwischen zwei Blöcken.
↑ 48 px Abstand
02 / 05 · Text
Worte in Form bringen
Text-Widgets tragen die Botschaft. Überschriften gliedern, der Texteditor erzählt, das Zitat hebt eine Stimme hervor.
Heading
Überschrift
Titel und Zwischenzeilen von H1 bis H6, mit eigener Schrift, Größe, Farbe und Laufweite pro Gerät.
Ich bin eine Überschrift – Schrift, Größe und Farbe wählst du für jedes Gerät.
Text Editor
Texteditor
Fließtext mit Formatierung, Links und Listen – so einfach wie in einem Textprogramm.
Digitalmagazine verbinden die Stärken klassischer Magazine mit den Möglichkeiten des Digitalen. Inhalte lassen sich jederzeit aktualisieren, mit Videos, Galerien und Animationen anreichern und ohne Druckzeiten veröffentlichen.
- Absätze, Fett, Kursiv, Unterstreichung
- Listen, Links und Farben im Text
- Mehrspaltiger Fließtext auf Wunsch
Mehr über Novamag erfährst du auf novamag.de.
Quote
Zitat
Hebt eine Aussage hervor, mit Name, Funktion und auf Wunsch einem Porträt.
Ein gutes Magazin erkennt man daran, dass man es gern bis zur letzten Seite liest.
03 / 05 · Medien
Bild, Bewegung, Ton
Medien-Widgets holen Fotos, Videos, Klang und Animation in den Artikel – aus der eigenen Mediathek oder von externen Diensten.
Image
Bild
Ein Einzelbild mit Seitenverhältnis, Fokuspunkt, Bildunterschrift und Vergrößerung per Klick.
Video
Video
Eigene Videos aus der Mediathek, mit oder ohne Autoplay, Schleife und Steuerleiste.
Audio
Audio
Podcasts, Interviews oder Klangkulissen direkt im Artikel abspielen.
Lottie
Lottie-Animation
Leichte, gestochen scharfe Animationen aus einer .lottie-Datei.
Embed
Embed
Bindet externe Dienste ein – hier YouTube, Spotify und ein Vorher-Nachher-Slider von Elfsight.
Hinweis
Eingebettete Dienste laden erst, wenn Leserinnen und Leser in den Cookie-Einstellungen zustimmen. Bis dahin steht an ihrer Stelle ein Hinweis mit Zustimmungs-Button.
Dieser Inhalt ist durch deine Cookie-Einstellungen blockiert. 🍪
Du kannst dies in den Cookie-Einstellungen ändern oder es für diesen Besuch nur akzeptieren und laden.
Dieser Inhalt ist durch deine Cookie-Einstellungen blockiert. 🍪
Du kannst dies in den Cookie-Einstellungen ändern oder es für diesen Besuch nur akzeptieren und laden.
Dieser Inhalt ist durch deine Cookie-Einstellungen blockiert. 🍪
Du kannst dies in den Cookie-Einstellungen ändern oder es für diesen Besuch nur akzeptieren und laden.
04 / 05 · Galerie
Viele Bilder, wenig Platz
Galerie-Widgets zeigen mehrere Bilder oder Produkte kompakt – zum Wischen, Vergrößern oder Aufklappen.
Media Carousel
Medienkarussell
Bilder und Videos als wischbares Karussell mit Vorschaubildern und Vollbild-Ansicht.
Media Gallery
Mediengalerie
Ein Raster oder Masonry aus Bildern, jedes per Klick groß.
Accordion
Poker
Nebeneinanderstehende Bild-Panels, die sich beim Antippen öffnen und Text zeigen.
Product Carousel
Produktkarussell
Produkte mit Bild, Kurzbeschreibung, Detailansicht und Link zum Shop.
05 / 05 · Interaktion & Daten
Zahlen, Zeit und Klicks
Diese Widgets machen Seiten lebendig: Zahlen zählen hoch, Uhren laufen, Fragen klappen auf, und Leserinnen und Leser klicken weiter.
Counter
Counter
Zahlen, die beim Hineinscrollen hochzählen – für Kennzahlen und Bilanzen.
Widgets im Editor
Bildschirmgrößen, einzeln einstellbar
responsiv, ohne App
Countdown
Countdown
Zählt live auf einen Zeitpunkt herunter, für Launches, Events oder Fristen. Nach Ablauf erscheint ein eigener Text.
Bis zum Jahreswechsel 2027
Timeline
Timeline
Abläufe und Geschichten als Zeitleiste, im Zickzack oder einspaltig.
Schritt 1
Vorlage wählen
Starte mit einer Designvorlage wie dieser oder einer leeren Seite.
Schritt 2
Inhalte einsetzen
Texte, Bilder und Videos per Drag-and-Drop in die Widgets ziehen.
Schritt 3
Für alle Geräte prüfen
In der Vorschau zwischen Desktop, Laptop, Tablet und Smartphone wechseln.
Schritt 4
Veröffentlichen
Ein Klick – und die Ausgabe ist unter deiner Domain online.
FAQ
Akkordeon
Fragen und Antworten zum Aufklappen, auf Wunsch mit FAQ-Auszeichnung für Suchmaschinen.
Nein. Alle Widgets werden visuell platziert und über Einstellungen gestaltet. Code ist nur für Embeds nötig – und dort kopierst du ihn meist nur vom Anbieter.
Ja. Jede Einstellung lässt sich für Desktop, Laptop, Tablet und Smartphone getrennt festlegen, Spalten und Raster ordnen sich automatisch neu.
Beliebig. Container und Raster nehmen andere Widgets auf, so entstehen Karten, Teaser und ganze Artikel-Layouts.
Das Akkordeon kann seine Fragen und Antworten als strukturierte Daten für Suchmaschinen ausgeben. Das hilft, in den Suchergebnissen aufzufallen.
Link
Button / Link
Führt zu einer Seite, einem Anker, einer Datei oder einer externen Adresse.
Social Media
Social Media
Icons zu deinen Kanälen, in Größe, Form und Farbe frei gestaltbar.
Ad Block
Werbeanzeige
Spielt eine Anzeige aus den Projekteinstellungen aus, mit Laufzeit, Ziel-Link und Impressionslimit.
Und jetzt du
Bereit für dein erstes Magazin?
Kombiniere die Widgets frei, stelle jedes Gerät einzeln ein und veröffentliche mit einem Klick.