So erstellen Sie Balken- und Diagramme in WordPress mit Visualizer

Das Erstellen von Balken-, Linien- und Tortendiagrammen auf Ihrer WordPress-Website kann Ihren Inhalt verbessern, indem Daten zugänglicher gemacht werden. Es hilft Ihnen, Informationen visuell ansprechend und für Benutzer leicht verständlich darzustellen.

Die gute Nachricht ist, dass Sie keine technischen Kenntnisse benötigen. Sie können ein Plugin wie Visualizer verwenden. Wir haben dieses Tool selbst getestet und waren begeistert, wie einfach es den Prozess machte.

Mit Visualizer können Sie beeindruckende, benutzerdefinierte Balken und Diagramme erstellen und Daten einfach aus verschiedenen Quellen abrufen. Auf diese Weise können Sie Ihre Inhalte und das gesamte Benutzererlebnis verbessern.

In diesem Artikel zeigen wir Ihnen, wie Sie mit Visualizer Balken und Diagramme in WordPress erstellen.

Das Problem mit Balken und Diagrammen in WordPress

Es gibt viele Plugins, um Balken-, Torten- und Liniendiagramme zu Ihren Inhalten hinzuzufügen. Die häufigste Beschwerde, die wir von unseren Benutzern gehört haben, ist jedoch, dass diese Plugins normalerweise zu kompliziert zu bedienen sind.

Einige dieser Plugins erwarten sogar, dass Benutzer Daten in einem Shortcode in extrem komplizierten Formaten hinzufügen.

Anstatt diese Plugins zu verwenden, erstellen viele Benutzer Diagramme in ihren Büroanwendungen und konvertieren sie in ein Bild für ihre WordPress-Websites.

Das könnte funktionieren, wenn Sie planen, es nie zu ändern. Ein Bild ist jedoch kein Ersatz für ein interaktives Diagramm, in dem hilfreiche Daten angezeigt werden, wenn der Benutzer über einen bestimmten Bereich klickt.

Eine ideale Lösung für Diagramme und Graphen würde es Ihnen ermöglichen:

• Fügen Sie Daten aus einer Datenquelle auf Ihrem Computer oder aus dem Web hinzu.
• Füllen Sie Diagramme, Tortendiagramme, Grafiken und Balken mit Ihren Daten.
• Erstellen Sie schöne, interaktive, farbenfrohe und mobilfreundliche Diagramme.
• Am wichtigsten ist, dass Sie die Daten jederzeit aktualisieren können.

Das Hinzufügen eines Diagramms mit dem Visualizer hilft Ihnen, das Benutzerengagement zu steigern und Ihre Daten leicht verständlich zu machen.

Nichtsdestotrotz wollen wir sehen, wie Sie einfach Balken und Diagramme zu Ihrer WordPress-Website hinzufügen können.

So erstellen Sie Balken- und Diagramme in WordPress mit Visualizer

Sie können mit dem Visualizer-Plugin ganz einfach Balken und Diagramme mit WordPress erstellen. Es ist das beste WordPress-Plugin zur Datenvisualisierung auf dem Markt, mit dem Sie interaktive Datenvisualisierungen für Ihre Website erstellen können.

Es gibt sogar einen kostenlosen Plan, mit dem Sie Balken und Diagramme erstellen können.

Zuerst müssen Sie das Plugin Visualizer: Tables and Charts Manager for WordPress installieren und aktivieren. Weitere Details finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.

Nach der Aktivierung müssen Sie die Seite Visualizer » Neues Diagramm hinzufügen im WordPress-Dashboard aufrufen.

Wählen Sie dort den Diagrammtyp aus, den Sie erstellen möchten, z. B. eine Tabelle, ein Torten-, Linien- oder Balkendiagramm. Klicken Sie dann auf die Schaltfläche 'Weiter'.

Dies bringt Sie zum nächsten Schritt, wo Sie auf die Schaltfläche „Datei auswählen“ klicken müssen, um Ihre Excel-Tabellendaten vom Computer zu importieren.

Wenn Sie Ihre Excel- oder Google-Tabellenkalkulation als CSV-Datei gespeichert haben, können Sie sie importieren, indem Sie den Tab „Daten aus URL importieren“ erweitern.

Sobald Sie dies getan haben, klicken Sie auf die Schaltfläche „Aus CSV importieren“. Anschließend können Sie Ihre CSV-Datei-URL eingeben, um die Datei einzubetten.

Beachten Sie, dass Ihre CSV-Datei in der ersten Zeile Spaltennamen und in der zweiten Zeile Datentypen enthalten muss. Das Plugin unterstützt die folgenden Datentypen: string, number, boolean, date, time und time of day.

Bitte werfen Sie einen Blick auf diese Beispieldatei, die wir in Google Tabellen erstellt haben.

Wenn Sie eine CSV-Datei mit einem Texteditor erstellen, sehen Sie sich dieses Beispiel einer CSV-Datei an:

Tägliche Aktivitäten,Zeit
Zeichenkette,Zahlen
Arbeit,8
Schlaf,7
Essen,3
Fernsehen,2
Pendeln,1


Wenn Sie Ihre Diagrammdaten jedoch als Tabellenkalkulation in Google Drive gespeichert haben, können Sie sie hinzufügen, ohne sie zu exportieren.

Öffnen Sie zuerst Ihre Datendatei in Google Tabellen und klicken Sie dann auf den Link Datei » Teilen » Im Web veröffentlichen.

Dies öffnet ein Popup, in dem Sie auswählen müssen, wie dieses Dokument veröffentlicht werden soll.

Wählen Sie einfach die Option „Comma Separated Values (.csv)“ aus dem Dropdown-Menü und klicken Sie auf die Schaltfläche „Veröffentlichen“.

Sie sehen nun die öffentlich verfügbare URL Ihres Blattes als CSV-Datei. Kopieren Sie diese URL und kehren Sie zum Visualizer-Diagramm zurück.

Sie müssen diese URL in das Feld 'Aus CSV importieren' einfügen.

Wenn Sie die URL eingeben, ruft das Plugin Ihre CSV-Datei ab und zeigt eine Live-Vorschau Ihres Diagramms an.

Jetzt können Sie zum Tab „Einstellungen“ oben wechseln, um allgemeine Einstellungen wie Schriftarten, Zahlenformat, Größe und Platzierung, Größeneinstellungen und vieles mehr zu konfigurieren.

Sobald Sie fertig sind, klicken Sie unten in der Eingabeaufforderung auf die Schaltfläche „Erstellen“.

Hinzufügen eines Diagramms oder Graphen in WordPress-Beiträgen/Seiten

Das Hinzufügen eines Diagramms oder Graphen zu Ihren WordPress-Beiträgen und -Seiten ist so einfach wie das Hinzufügen von Bildern.

Öffnen Sie zuerst eine neue oder alte Seite/einen neuen oder alten Beitrag, zu dem Sie das Tortendiagramm hinzufügen möchten. Dort angekommen, klicken Sie oben links auf die Schaltfläche „Block hinzufügen“ (+).

Dies öffnet das Blockmenü, aus dem Sie den Visualizer-Diagramm-Block finden und hinzufügen müssen.

Sobald Sie dies getan haben, klicken Sie im Block selbst auf die Schaltfläche „Vorhandenes Diagramm anzeigen“.

Dies öffnet eine neue Eingabeaufforderung im Block, in der Sie das gerade erstellte Kreisdiagramm auswählen müssen.

Klicken Sie abschließend auf die Schaltfläche 'Veröffentlichen' oder 'Aktualisieren', um Ihre Einstellungen zu speichern.

Jetzt können Sie Ihre WordPress-Website besuchen, um das Tortendiagramm in Aktion zu sehen.

Bearbeiten Ihrer Visualizer-Diagramme in WordPress

Sie können Ihre Diagramme jederzeit bearbeiten und ändern. Besuchen Sie einfach die Seite Visualizer » Chart Library im WordPress-Dashboard.

Von dort aus können Sie ein Diagramm klonen, löschen oder seine visuellen Einstellungen mit den Symbolen unter dem Diagrammnamen bearbeiten.

Das Aktualisieren von Daten für ein bestehendes Diagramm, ohne das Diagramm zu ändern, ist mit Visualizer ebenfalls recht einfach.

Wenn Sie Daten aus einer Google-Tabelle hinzugefügt haben, müssen Sie nur die Daten in Ihrer Tabelle aktualisieren, zur Option Datei » Teilen » Im Web veröffentlichen gehen und Ihre Tabelle erneut veröffentlichen.

Ihre Änderungen werden automatisch in Ihrem Diagramm angezeigt.

Wenn Sie hingegen eine CSV-Datei hochgeladen haben, müssen Sie die CSV-Datei auf Ihrem Computer aktualisieren. Sobald dies geschehen ist, wählen Sie das Diagramm aus, das Sie aktualisieren möchten, und klicken Sie unter dem Diagramm auf den Link „Bearbeiten“.

Im Abschnitt „CSV-Datei importieren“ laden Sie einfach Ihre neue CSV-Datei hoch. Änderungen an den Daten spiegeln sich automatisch in Beiträgen oder Seiten wider, in denen Sie dieses Diagramm eingefügt haben.

Bonus: Erstellen Sie ein Organisationsdiagramm für Ihr Unternehmen in WordPress

Wenn Sie eine Website für kleine Unternehmen haben, können Sie auch ein Organigramm in WordPress hinzufügen. Dieses Diagramm zeigt, wie Ihr Unternehmen strukturiert ist, vom CEO bis zu den verschiedenen Teams und einzelnen Mitarbeitern innerhalb jedes Teams.

Ein Organigramm hilft potenziellen Kunden, mehr über Ihr Unternehmen zu erfahren, und erleichtert die Kommunikation zwischen Teams.

Um ein Diagramm zu erstellen, installieren und aktivieren Sie einfach das Organization Chart Plugin. Details finden Sie in unserem Tutorial unter wie man ein WordPress-Plugin installiert.

Nach der Aktivierung besuchen Sie die Seite Wpdevart Chart » Charts und klicken Sie auf die Schaltfläche „Neu hinzufügen“. Dies führt Sie zu einem neuen Bildschirm, auf dem Sie einen Namen für das Diagramm eingeben können.

Fügen Sie danach das Bild und den Titel des CEOs Ihres Unternehmens in das Element auf dem Bildschirm ein. Klicken Sie dann auf das Pfeilsymbol.

Dies fügt ein weiteres Element hinzu, in dem Sie einen Titel und ein Bild für die Person hinzufügen können, die nach dem CEO kommt. Klicken Sie dann erneut auf das Element, um die mehreren Pfeilsymbole in verschiedenen Richtungen anzuzeigen.

Dies hilft Ihnen, eine Unternehmensstruktur mit mehreren Niederlassungen oder Teams zu erstellen.

Wenn Sie fertig sind, klicken Sie einfach auf die Schaltfläche „Speichern“, um Ihre Einstellungen zu speichern.

Öffnen Sie nun die Seite, auf der Sie das Organigramm hinzufügen möchten, und fügen Sie den Block „WpDevArt Organization Chart“ hinzu. Wählen Sie dann das von Ihnen erstellte Diagramm aus dem Dropdown-Menü innerhalb des Blocks selbst aus.

Klicken Sie abschließend auf die Schaltfläche „Veröffentlichen“ oder „Aktualisieren“, um Ihre Einstellungen zu speichern. Weitere Informationen finden Sie in unserem Tutorial unter Erstellen eines Organisationsdiagramms für Ihr Unternehmen in WordPress.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat, Balken und Diagramme zu Ihrer WordPress-Website hinzuzufügen. Möglicherweise möchten Sie auch unseren Leitfaden für Anfänger zum Thema Anpassen von Farben auf Ihrer WordPress-Website und unsere Expertenauswahl für die besten lustigen WordPress-Plugins, die Sie verpassen sehen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.