So fügen Sie Klassen zu WordPress-Widgets hinzu

Wenn Sie dem WordPress-Widget eine Klasse hinzufügen möchten, gibt es verschiedene Möglichkeiten, dies zu tun. Eine Möglichkeit besteht darin, die Klasse einfach zum Widget-Code in der Datei functions.php hinzuzufügen. Eine andere Möglichkeit besteht darin, die Klasse über den Bildschirm Darstellung > Widgets im Admin-Bereich zum Widget hinzuzufügen.

Wie füge ich eine CSS-Klasse zu einem Widget in WordPress hinzu?

Wenn Sie einem Widget in WordPress eine CSS-Klasse hinzufügen möchten, können Sie dies tun, indem Sie zur Seite Aussehen > Widgets gehen. Von hier aus können Sie jedem Widget eine CSS-Klasse hinzufügen, indem Sie den/die Klassennamen in das Feld „Zusätzliche Klassen“ des Widgets einfügen.

Wie passe ich Widgets in WordPress an?

Es gibt zwei Möglichkeiten, Widgets in WordPress anzupassen. Die erste Möglichkeit besteht darin, zur Widgets-Seite im WordPress-Adminbereich zu gehen und die Widgets per Drag & Drop in die gewünschte Reihenfolge zu ziehen. Die zweite Möglichkeit besteht darin, die Datei functions.php des Themes zu bearbeiten und dort die Reihenfolge der Widgets zu ändern.

Sie können Ihrer Website zusätzliche Funktionen über benutzerdefinierte WordPress-Widgets hinzufügen, indem Sie sie per Drag & Drop in die entsprechenden Abschnitte ziehen. Dazu müssen Sie nur PHP und WordPress kennen und es ist nicht kompliziert. Denken Sie daran, dass Ihr benutzerdefiniertes Widget von Grund auf neu erstellt werden muss, damit es fein abgestimmt werden kann. In diesem Tutorial erfahren Sie, wie Sie einen Gruß von Hostinger.com senden. Wenn Sie das benutzerdefinierte Widget verwenden, können Sie mehr über das Erstellen von WordPress-Widgets erfahren. Der Code wird in diesem Beispiel in die Datei functions.php geschrieben, weil das aktuell geladene Theme dort ist. Infolgedessen hat auch jedes benutzerdefinierte Plugin denselben Code.

Hstngr_register_widget() ist eine neue Funktion, die die Widget-ID verwendet, die in der Funktion __construct() angegeben ist, um unser Widget zu registrieren. Wir verwenden dann widget_init, um das Widget in WordPress zu laden, indem wir die integrierte Methode add_action() verwenden. Der Code muss nun in der Datei functions.php ausgeführt werden.

Widget-Css-Klassen

Es gibt viele verschiedene Möglichkeiten, Widgets in CSS zu gestalten . Durch die Verwendung verschiedener CSS-Klassen können Sie das Aussehen eines Widgets ändern, um es besser an das Design Ihrer Website anzupassen. Darüber hinaus können Sie CSS-Klassen verwenden, um verschiedene Variationen eines Widgets zu erstellen, z. B. eine helle und eine dunkle Version.

So passen Sie Ihre Widgets im WordPress-Widget-Anpassungsbildschirm an

Die folgenden Einstellungen können im Widget-Anpassungsbildschirm geändert werden. Passen Sie Ihr Widget an, indem Sie die gewünschten Widgets aus dem Dropdown-Menü auswählen. Sie können das Aussehen des Widgets ändern, indem Sie Aussehen auswählen. : Verwenden Sie eine CSS-Datei, um die Standardstile für diese Vorlage zu überschreiben. Die Optionen des Widgets können geändert werden.

So fügen Sie ein neues Widget in WordPress hinzu

Gehen Sie in Aussehen zu den WordPress-Verwaltungsbildschirmen und wählen Sie Aussehen. Sie können das Widget in die Seitenleiste ziehen, in der es angezeigt werden soll, oder Sie können auf die Schaltfläche „ Widget hinzufügen “ klicken und die Seitenleiste Ihres Designs auswählen (wenn Ihr Design mehr als eine Seitenleiste hat, wählen Sie eine Ziel-Seitenleiste).

Ein Widget ist eine Sammlung von Inhaltsblöcken, die Sie zu WordPress-Seitenleisten, Fußzeilen und anderen Widget-Bereichen hinzufügen können. Unser Ziel in diesem Artikel ist es, Ihnen beizubringen, wie Sie die WordPress-Widget-Funktionalität verwenden, damit Sie Ihre Website so schnell wie möglich anpassen können. Da Ihr WordPress-Design definiert, wo Sie Widgets platzieren können, kann Ihr Widget-Stil je nach verwendetem Design unterschiedlich sein. Sie können Ihrer Seitenleiste ein Widget hinzufügen, indem Sie die Menüoption „Rechte Seitenleiste“ auswählen. Nachdem Sie einen Widget-Block ausgewählt haben, können Sie ihn sofort hinzufügen. Nachdem Sie die Option „Blockierung entfernen“ ausgewählt haben, kann das Widget entfernt werden. Wenn Sie das Widget erneut verwenden möchten, ziehen Sie es in den Abschnitt „Inaktives Widget“.

Widget-Bibliotheken sind in WordPress-Installationen integriert, die aktuelle Beiträge, Tags, eine Suchleiste, Kategorien, Kalender usw. enthalten. Zusätzlich zu den Widget-Blöcken, die Sie Ihrer Website hinzufügen können, enthalten die meisten WordPress-Plugins und -Designs ihre eigenen. Weitere Details finden Sie in unserer Anleitung zum Erstellen eines benutzerdefinierten WordPress-Widgets.

Tutorial: So zeigen Sie ein Widget auf bestimmten Beiträgen, Seiten oder Archiven an

Um das Widget in einen Kontext zu setzen, gehen Sie zum Abschnitt Widgets-Kontext und aktivieren Sie das Kontrollkästchen neben einem Beitrag, einer Seite oder einem Archiv. Wenn Sie auf „Zur Auswahl hinzufügen“ klicken, wird die Auswahl aktualisiert. Du bist fertig. Das Widget ist nun auf allen ausgewählten Beiträgen, Seiten oder Archiven sichtbar.

So bearbeiten Sie Widget-Code in WordPress

Um den Widget-Code in WordPress zu bearbeiten, müssen Sie auf den Code-Editor für Ihre Website zugreifen. Gehen Sie dazu im WordPress-Dashboard zum Menü „Darstellung“ > „Editor“. Sobald Sie sich im Editor befinden, können Sie die spezifische Widget-Datei , die Sie bearbeiten möchten, aus der Liste der Dateien auf der rechten Seite auswählen. Nachdem Sie Ihre Änderungen vorgenommen haben, klicken Sie unbedingt auf die Schaltfläche Datei aktualisieren, um Ihre Änderungen zu speichern.

Die WordPress-Website kann nur dann richtig funktionieren, wenn sie sowohl Plugins als auch Widgets enthält. Ziehen Sie den Namen eines Widgets per Drag & Drop in einen der Widget-Bereiche auf der rechten Seite des Fensters, um es Ihrer Website hinzuzufügen. Inaktive Widgets sind solche, die nicht aktiviert wurden, was darauf hinweist, dass sie noch nicht aktiviert wurden. Widget-Bereiche befinden sich auch in einigen Fußzeilen und Kopfzeilen einiger Themen. In den meisten Fällen muss die WordPress-Site geändert werden, um zusätzliche Funktionen zu erhalten. Themes sind ebenfalls kostenlos, obwohl einige Entwickler Premium-Plugins erstellt haben, um sie zu ergänzen. Viele Plugins ermöglichen es Ihnen, Widget-Kategorien per Drag & Drop in den Widget-Bereich Ihrer Website zu ziehen.

Wie erhalte ich einen Widget-Code?

Melden Sie sich beim Branded Web Manager an und klicken Sie dann oben auf der Seite auf Widgets, um Ihren Widget-Code abzurufen. Wählen Sie das Widget aus, das Sie bereitstellen möchten, klicken Sie dann auf das Zahnradsymbol und folgen Sie den Anweisungen auf dem Bildschirm. Sie müssen den Widget-Code kopieren und in Ihre Website einfügen.

WordPress-Widget CSS

Ein Widget ist ein kleiner Inhaltsblock, den Sie auf Ihrer Website platzieren können, um Informationen anzuzeigen oder eine bestimmte Funktion auszuführen. WordPress-Widgets haben normalerweise die Form kleiner Blöcke, die Sie in Widget-bereite Bereiche auf Ihrer Website platzieren können, wie z. B. Ihre Seitenleiste, Fußzeile oder Kopfzeile. Sie können Widgets verwenden, um Informationen wie aktuelle Posts oder Kommentare anzuzeigen oder bestimmte Funktionen auszuführen, z. B. Besuchern zu ermöglichen, Ihre Website zu durchsuchen oder Ihren RSS-Feed zu abonnieren.

Um ein Element zu untersuchen, klicken Sie mit der rechten Maustaste darauf und klicken Sie dann auf Element untersuchen, das Sie entweder in Chrome oder Firefox finden. Sobald Sie diese Taste drücken, erscheinen einige neue Codefenster am unteren (oder seitlichen) Rand Ihres Bildschirms. Um ein bestimmtes Widget auszuwählen, bewegen Sie den Cursor in den linken Bereich des Codes und wählen Sie es aus der Liste aus. Der Hintergrund für den Hauptcontainer, der Titel und die Links im oben gezeigten Widget werden geändert. Da es sich um Links handelt, muss ich einen neuen CSS-Abschnitt erstellen, die Farbe ändern und die Dateien hochladen. Infolgedessen hoffe ich, sie etwas zu vergrößern. Sie können die Größe ändern, indem Sie die Zahl 1,2 nach oben oder unten verschieben. Das haben wir hier.

So passen Sie Ihr Widget mit CSS an

Mithilfe des Widget-Anpassers können Sie das Erscheinungsbild Ihres Widgets ändern, indem Sie die CSS-Klasse auswählen, die Sie verwenden möchten, und die Eigenschaften dieser Klasse anpassen. Sie können auch Ihr eigenes CSS einbinden, wenn Sie möchten. Wenn Sie Ihre Änderungen speichern möchten, klicken Sie einfach auf die Schaltfläche Aktualisieren.

So erstellen Sie ein benutzerdefiniertes HTML-Widget in WordPress

Um ein benutzerdefiniertes HTML-Widget in WordPress zu erstellen, müssen Sie die folgenden Schritte ausführen: 1. Melden Sie sich bei Ihrem WordPress-Konto an und gehen Sie zum Dashboard. 2. Auf der linken Seite sehen Sie ein Menü. Bewegen Sie den Mauszeiger über die Registerkarte „Darstellung“ und klicken Sie auf „Widgets“. 3. Auf der Seite Widgets sehen Sie eine Liste aller verfügbaren Widgets. Suchen Sie das Widget „Benutzerdefiniertes HTML“ und ziehen Sie es in eine der Seitenleisten. 4. Sobald das Widget vorhanden ist, können Sie darauf klicken, um es zu erweitern und Ihren benutzerdefinierten HTML-Code hinzuzufügen. 5. Achten Sie darauf, auf die Schaltfläche „Speichern“ zu klicken, wenn Sie fertig sind.

Auf den meisten WordPress-Seiten ist das Text-Widget ein beliebtes Widget. Außerdem können Sie Text sowie Code-Snippets in den Seitenleisten- und Fußzeilen-Widget-Bereich einfügen. Version 4.8 des Text-Widgets enthält neue Funktionen, die es Benutzern erleichtern, benutzerdefinierte Codes hinzuzufügen und das Widget funktionaler zu machen. Der verbesserte TinyMCE-Textmodus verursachte jedoch mehr Probleme als er löste. Es gibt auch das alte Text-Widget mit Optionen für den visuellen / Textmodus. Wir empfehlen Ihnen dringend, ein benutzerdefiniertes HTML-Widget zu verwenden, anstatt komplexen Code in das Text-Widget im Textmodus einzufügen. Unserer Meinung nach war die Einführung des Textmodus für Text-Widgets unnötig, da es Plugins gibt, die Widget-Funktionalität bereitstellen.

WordPress: Die anpassbarste Plattform

Sie können Ihre eigenen Widgets mit WordPress anpassen und hinzufügen, sehen Sie sich also die Optionen auf der linken Seite des Bildschirms an. Wenn Sie erfahren möchten, wie Sie benutzerdefinierte Widgets erstellen, probieren Sie es bitte aus.