So fügen Sie Zähler in WordPress hinzu 1

So fügen Sie Zähler in WordPress hinzu

Die Aufmerksamkeitsökonomie sind sich mittlerweile alle und ihre Großmutter bewusst. Sie wissen, dass Ihre Website wenig Zeit hat, um Aufmerksamkeit zu erregen, und wie jede Unze davon so effektiv wie möglich genutzt werden sollte. Normalerweise bedeutet dies, dass Sie Informationen auf sehr effiziente Weise bereitstellen, indem Sie Text- und visuelle Elemente aus Ihrer Tasche mit Kommunikationstools verwenden.

Aber wie wäre es, wenn Sie dieser Tasche ein paar Zahlen hinzufügen? Warum zeigen Sie nicht, wie viele Kunden Ihr Unternehmen hat, wie viele erfolgreiche Projekte Sie abgeschlossen haben oder in wie vielen verschiedenen nationalen Märkten Sie präsent sind? Diese Zahlen sehen nicht nur beeindruckend aus, wenn sie wenig Platz auf Ihrer Website einnehmen, sondern vermitteln auch wertvolle Informationen effizient.

Da wir glauben, dass Zähler unglaublich wertvolle Elemente in Websites sein können, haben wir sichergestellt, dass sie in unsere Qi-Addons für Elementor-Plugin aufgenommen werden. Es ist die größte kostenlose Sammlung von Elementor-Addons, die Sie in einem einzigen Plugin finden – es gibt sechzig Addons darin. Unser Zähler-Widget befindet sich in bester Gesellschaft mit Widgets, die bei allem helfen, vom Hinzufügen von Nachrichtenfeldern bis zum Erstellen eines Textrahmens.

Bleiben wir aber vorerst bei den Zählern. Wir zeigen Ihnen, wie Sie vier Counter für Ihre Website erstellen und wenn Sie Ideen für eigene Counter erstellen – noch besser! Wenn Sie lieber ein Video anschauen als lesen, finden Sie all diese Informationen in einem Video-Tutorial.

Also lasst uns anfangen! Hier ist, was wir behandeln werden:

Hinzufügen der Zähler in WordPress

Zähler Gif

Das erste, was Sie über das Hinzufügen der Zähler in WordPress mit unserem Elementor-Widget wissen sollten, ist, dass Sie auch Elementor Website-Builder damit es funktioniert. Wenn Sie noch nicht dort sind, gehen Sie zu Ihrem Website-Dashboard, navigieren Sie zu Plugins > Neu hinzufügen, suchen Sie nach Elementor und installieren und aktivieren Sie es.

Sie können entweder die kostenlose oder die Pro-Version verwenden – es liegt ganz bei Ihnen, da unser Plugin mit beiden funktioniert. Apropos Plugin, Qi-Addons für Elementor, sollten Sie auch danach suchen und installieren und aktivieren.

Qi-Addons für Elementor

Ihr nächster Schritt wäre, eine Seite oder einen Beitrag zu erstellen, auf der Sie die Zähler hinzufügen oder vorhandene Beiträge oder Seiten öffnen möchten, auf denen ein oder mehrere Zähler Ihrer Meinung nach gut aussehen würden. Für diese Demonstration haben wir an einer neuen Leinwand in Form eines neuen Beitrags gearbeitet und uns entschieden, für den Anfang einen vierspaltigen Abschnitt zu erstellen, da wir vorhatten, vier Zähler hinzuzufügen.

Elementor-Spalten

Wenn die Spalten vorhanden sind, müssen Sie als nächstes das Widget finden – die Suchfunktion im linken Seitenmenü der Elemente ist dafür perfekt geeignet. Wenn Sie „Zähler“ – nicht „Zähler“ eingeben, da dadurch ein weiteres Widget angezeigt wird – und das Widget in die nächste freie Spalte ziehen, erhalten Sie das richtige Ergebnis.

Zähler eine Spalte

Sie müssen sich keine Sorgen um das Ausfüllen der verbleibenden Spalten machen. Manchmal ist es eine gute Idee, den größten Teil des Stylings auf einem der Zähler vorzunehmen und ihn dann einfach in andere Spalten zu kopieren und seinen Inhalt zu ändern. Dies kann Ihnen bei anspruchsvolleren Projekten einiges an Zeit sparen, und es funktioniert perfekt, solange Sie das Aussehen Ihrer Theken etwas einheitlicher gestalten möchten. Wie Sie später sehen werden, haben wir zuerst die Bearbeitungen und Formatierungen an einem Zähler vorgenommen und dann die restlichen Spalten kopiert und einige inhaltliche Änderungen vorgenommen.

Bearbeiten des Inhalts

Der Inhalt, den Sie sehen, wenn Sie das Widget zum ersten Mal hinzufügen, ist nur zur Anzeige da, sodass Sie ihn wahrscheinlich zuerst ändern möchten. Die allgemeinen Optionen, die Sie auf der Registerkarte Inhalt sehen, sind der Ort, an dem Sie alle möglichen nützlichen inhaltsbezogenen Dinge tun können, von der Auswahl der Anfangs- und Endziffer Ihres Zählers über das Einstellen der Schritte zwischen den Ziffern bis hin zum Aktivieren von Symbolen und Trennzeichen , und schließlich den Titel und den Text des Zählers bearbeiten.

Zähler Allgemein

Um unsere Zähler zu erstellen, haben wir einige inhaltliche Entscheidungen getroffen. Zum einen haben wir uns entschieden, die Zählung nicht bei Null zu beginnen – wir haben 45 gewählt. Als Endziffer haben wir 52 gewählt. Wir haben auch den Titel und den Text geändert, um ihm einen Sinn zu geben.

Zähler Ziffern

Bevor Sie mit der Stilisierung dieses Zählers fortfahren, sollten Sie das Symbol, das Trennzeichen und die zugehörigen Optionen unter den allgemeinen Optionen beachten. Diese ermöglichen es Ihnen, Ihrer Nummer ein Symbol und ein Trennzeichen zwischen der Nummer und dem Text hinzuzufügen. Sie müssen beide in den allgemeinen Optionen aktivieren, wenn Sie sie verwenden möchten – wir haben uns, zumindest vorerst, dagegen entschieden.

Die Theke stylen

Wenn Sie auf der Registerkarte Stil zu Stiloptionen übergehen, finden Sie eine Vielzahl von Optionen, die bestimmen, wie der Inhalt Ihrer Zähler aussieht. Sie können die Ausrichtung ändern, mit der Typografie und den Farben oder der Ziffer, dem Titel und dem Text herumspielen und sogar einen Hintergrund für die Ziffer festlegen und ihre Farbe und ihren Radius auswählen.

Zähler Stil

Das erste, was wir hier getan haben, war, sicherzustellen, dass unsere Ziffer genau so aussieht, wie wir es wollten. Für den Anfang haben wir uns mit Digit Typography beschäftigt und die Schriftart in DM Sans geändert. Als nächstes fügen wir etwas Gewicht hinzu – und erhöhen es auf 500.

Zähler Ziffern Typografie

Als nächstes haben wir die Ziffernfarbe in #1e1e1e geändert. Wir haben uns dagegen entschieden, einen Hintergrund hinzuzufügen oder den Ziffernstrich-Effekt hinzuzufügen – was unsere Ziffer zu einer Kontur machen würde – und wir haben uns entschieden, das Styling des Titel-Tags und des Inhalts zu korrigieren. Für den Titel haben wir die Schriftart in DM Sans geändert. Wir haben die Transform-Option in Title Typography auf Normal umgestellt, da wir keine Großbuchstaben verwenden wollten. Wir haben die Größe des Titels auf 20 Pixel, die Gewichtung auf 500 und die Zeilenhöhe auf 26 Pixel geändert. Die Farbe wurde auf #1e1e1e eingestellt.

Zähler Titeltypografie

Für den Text, Wir haben die Farbe auf #1e1e1e, die Schriftart auf DM Sans, die Größe auf 17 Pixel und die Linkhöhe auf 26 geändert. Wir haben die Gewichtung nicht geändert, da die Standardeinstellung bei 400 liegt, was wir wollten.

Zähler Texttypografie

Die Optionen für den Abstandsstil sind praktisch, wenn Sie die Ränder und den Textabstand für Ihre Zähler festlegen möchten. Die einzige Änderung, die wir hier vorgenommen haben, war, den Titelrand oben auf 10 Pixel zu setzen, wodurch es etwas kleiner als die Standardeinstellung ist.

Zählerabstand

Da wir weder ein Trennzeichen noch ein Trennzeichensymbol hinzugefügt haben, können wir in den Trennzeichenstil-Optionen nichts tun. Wenn Sie ein Trennzeichen hinzufügen möchten, können Sie mit diesen Optionen die Farbe, den Rahmenstil, die Ränder sowie die Breite und Dicke des Trennzeichens ändern. Sie haben auch einige Optionen für das Trennsymbol, die Farbe, Schriftgröße und Ränder abdecken.

Letzter Schliff

Nachdem Sie den ersten Counter gestaltet haben, ist es an der Zeit, drei weitere Kopien davon zu erstellen. Wir haben es einfach gemacht, indem wir mit der rechten Maustaste auf den Zähler geklickt und Duplizieren gewählt haben, und wir haben es wiederholt, bis wir genug Zähler für unsere Spalten hatten.

Doppelte Zähler

Wir haben keine der Styling-Optionen in den neuen Countern geändert. Die größte Neuerung war das Sternchen, das wir dem dritten Zähler hinzugefügt haben. Vom Inhalts-Tab gingen wir zu den Symboloptionen, wählten das Sternchen-Symbol und stellten seine Größe auf 15 Pixel ein.

Zähler-Symbol

Der Rest der Änderungen war regelmäßiger. Wir haben nur den Inhalt gewechselt – der zweite Zähler bekam eine Startziffer von 260 und eine Endziffer von 269. Der dritte ging in Schritt 5 von 72 auf 89, und der letzte Zähler bekam eine Startziffer von 93 und eine Endziffer von 102. Alle neuen Zähler haben eine neue Kopie bekommen. So sah das Ergebnis aus.

Zähler vier Spalten

Lass es uns einwickeln!

Wenn Sie eine Website haben, sagt der gesunde Menschenverstand, dass jedes Element, das Ihnen helfen kann, Ihre Botschaft einfacher und effektiver zu vermitteln, ein Element ist, das Sie begrüßen sollten. Wenn Sie der Meinung sind, dass das Hinzufügen von Zählern eine nützliche Möglichkeit sein kann, die Leistungen, Ressourcen oder Kapazitäten Ihres Unternehmens zu präsentieren, wird unser Zähler-Widget für Sie da sein und darauf warten, Ihre Besucher mit fantastischen Zahlen zu beeindrucken.

Unterstützen Sie unsere Arbeit ❤️

Wenn Ihnen dieser Artikel gefallen hat, können Sie uns mit einem Trinkgeld unterstützen, damit wir weiterhin großartige Inhalte veröffentlichen können.

Sichere Zahlung mit PayPal
Moyens I/O-Personal. motivierte Sie und gab Ratschläge zu Technologie, persönlicher Entwicklung, Lebensstil und Strategien, die Ihnen helfen werden.