Möchten Sie Ihre eigenen benutzerdefinierten Widgets in WordPress erstellen?
Mit Widgets können Sie Elemente per Drag & Drop in eine beliebige Seitenleiste oder einen Widget-Bereich auf Ihrer Website ziehen. In diesem Artikel zeigen wir Ihnen daher, wie Sie auf einfache Weise ein benutzerdefiniertes WordPress-Widget erstellen.
Aber vorher, wenn Sie WordPress Discover noch nie installiert haben Wie man ein Wordpress-Blog 7 Schritte für die Installation et Wie finden, zu installieren und ein Wordpress-Theme auf Ihrem Blog aktivieren
Dann zurück zu warum wir hier sind.
Was ist ein WordPress-Widget?
WordPress-Widgets enthalten Codeteile, die Sie zu den Seitenleisten oder Widget-freundlichen Bereichen Ihrer Website hinzufügen können. Stellen Sie sich das als Module vor, mit denen Sie mithilfe einer einfachen "Drag and Drop" -Schnittstelle verschiedene Elemente hinzufügen können.
Standardmäßig enthält WordPress einen Standardsatz von Widgets, die Sie mit jedem WordPress-Thema verwenden können.
entdecken Sie auch unsere besten Premium-WordPress-Themes.
WordPress ermöglicht es Entwicklern auch, ihre eigenen benutzerdefinierten Widgets zu erstellen. Viele Themen u Wordpress-Plugins kommen mit ihren eigenen benutzerdefinierten Widgets, die Sie zu Ihren Seitenleisten hinzufügen können.
Zum Beispiel können Sie hinzufügen eine Kontaktform, ein Anmeldeformular Brauch oder eine Fotogalerie in einer Seitenleiste ohne Code zu schreiben.
Vor diesem Hintergrund wollen wir uns ansehen, wie Sie auf einfache Weise Ihre eigenen Widgets in WordPress erstellen können.
Wie ein benutzerdefiniertes Widget auf Wordpress erstellen
Dieses Tutorial richtet sich an Personen mit Kenntnissen in der Webentwicklung.
Bevor Sie beginnen, sollten Sie ein bestimmtes Plugin auf der Website erstellen, in das Sie den Widget-Code für dieses Lernprogramm einfügen.
Sie können den Code auch in die Datei "functions.php" Ihres WordPress-Themas einfügen. Es ist jedoch nur verfügbar, wenn dieses bestimmte WordPress-Thema aktiv ist.
In diesem Tutorial erstellen wir ein einfaches Widget, mit dem Besucher einfach begrüßt werden. Schauen Sie sich diesen Code an und fügen Sie ihn in Ihr spezifisches Plugin ein, um ihn in Aktion zu sehen.
// Registriere und lade die Widget-Funktion wpb_load_widget () {register_widget ('wpb_widget'); } add_action ('widgets_init', 'wpb_load_widget'); // Das Erstellen der Widget-Klasse wpb_widget erweitert WP_Widget {function __construct () {parent :: __ construct (// Basis-ID Ihres Widgets 'wpb_widget', // Widget-Name wird in der Benutzeroberfläche angezeigt __ ('BPC Widget', 'wpb_widget_domain') , // Widget-Beschreibungsarray ('description' => __ ('Simple WordPress Widget', 'wpb_widget_domain'),)); } // Öffentliches Front-End-Widget-Funktions-Widget erstellen ($ args, $ instance) {$ title = apply_filters ('widget_title', $ instance ['title']); // vor und nach Widget-Argumenten werden durch Themen definiert echo $ args ['before_widget']; if (! empty ($ title)) echo $ args ['before_title']. $ title. $ args ['after_title']; // Hier führen Sie den Code aus und zeigen das Ausgabeecho an __ ('Simple Widget', 'wpb_widget_domain'); echo $ args ['after_widget']; } // Öffentliches Funktionsformular für das Widget-Backend ($ instance) {if (isset ($ instance ['title'])) {$ title = $ instance ['title']; } else {$ title = __ ('Neuer Titel', 'wpb_widget_domain'); } // Admin-Formular-Widget?> get_field_id( 'title' ); ?>" name="get_field_name( 'title' ); ?>" type="text" value="" />
Nach dem Hinzufügen des Codes müssen Sie zu " Aussehen> Widgets “. Sie werden das neue Widget bemerken " PCB Widget In der Liste der verfügbaren Widgets. Sie müssen dieses Widget in eine Seitenleiste ziehen und dort ablegen.
Wenn Sie jetzt Ihr Blog besuchen, sehen Sie ein Widget in der Seitenleiste, in der Sie das betreffende Widget hinzugefügt haben.
Schauen wir uns nun diesen Code an.
Zuerst haben wir aufgenommen “ wpb_widget Und unser benutzerdefiniertes Widget geladen. Als Nächstes haben wir definiert, was dieses Widget tut und wie es im Dashboard angezeigt wird.
Schließlich haben wir festgelegt, wie mit den am Widget vorgenommenen Änderungen umgegangen werden soll.
Nun gibt es ein paar Dinge, die Sie vielleicht wissen möchten. Was ist zum Beispiel das Ziel " wpb_text_domain »?
WordPress verwendet "gettext", um die Übersetzung und Lokalisierung zu verwalten. Also " wpb_text_domain „und __e teilt gettext mit, wie eine eventuell vorhandene Übersetzungszeichenfolge abgerufen werden soll.
Wenn Sie ein benutzerdefiniertes Widget für Ihr WordPress-Thema erstellen, können Sie "wpb_text_domain" durch den Text der Domäne Ihres Themas ersetzen.
Entdecken Sie auch einige Premium-WordPress-Plugins
Sie können andere verwenden Wordpress-Plugins um ein modernes Erscheinungsbild zu geben und die Handhabung Ihres Blogs oder Ihrer Website zu optimieren.
Wir bieten Ihnen hier einige Premium-WordPress-Plugins an, die Ihnen dabei helfen werden.
1. Galaxy Funder
Galaxy Funder ist ein Crowdfunding-System mit zahlreichen Funktionen, das für jede WooCommerce-Website entwickelt wurde. Mit der WordPress Plugin Premium Galaxy Funder können Sie Ihre eigene Crowdfunding-Website verwalten oder Spendenkampagnen in der Kopfzeile Ihres WooCommerce-Onlineshops hinzufügen.
Sie können auch beliebige verwenden von WooCommerce unterstütztes Zahlungsgateway. Bitte beachten Sie, dass „Galaxy Funder“ direkt auf der Online-Shop-Seite funktioniert, was den Benutzerbeitragsprozess erleichtert.
Herunterladen | Demo | Web-Hosting
2. Klicken Sie auf WhatsApp Chat
Le WordPress Plugin Premium Click to WhatsApp Chat macht es WordPress-Kunden einfach, sich über ihr WhatsApp-Konto mit dem Eigentümer der Website oder dem Kundensupport zu verbinden.
Klicken Sie einfach auf das WhatsApp-Konto und es wird mit einer Standardnachricht direkt an das mobile WhatsApp-Konto weitergeleitet. Wenn sich der Client auf einem Desktop oder Laptop befindet, wird er zu WhatsApp Web umgeleitet.
Für dieses Plugin sind die WhatsApp-Nummer sowie die Uhrzeit und der Tag erforderlich, über die der Websitebesitzer oder das Support-Team diskutieren wird. Die Chat-Schaltfläche kann zur WooCommerce-Produktdetailseite hinzugefügt werden, die in direktem Zusammenhang mit diesem Produkt steht.
Herunterladen | Demo | Web-Hosting
3. Laden Sie das Bildwasserzeichen herunter
diese WordPress-Plugin premium können Sie ganz einfach Wasserzeichen zu Ihren Bildern hinzufügen Easy Digital Downloads.
Diese Wasserzeichen kann ein Copyright-Symbol sein, a Firmenlogooder Teil des Brandings als transparentes PNG-Bild.
Herunterladen | Demo | Web-Hosting
Andere empfohlene Ressourcen
Wir laden Sie außerdem ein, die unten aufgeführten Ressourcen zu konsultieren, um die Kontrolle und Kontrolle Ihrer Website und Ihres Blogs zu verbessern.
- 7 WordPress-Plugins zur Bewertung von Blog-Kommentaren
- 5 WordPress-Plugins zur besseren Verwaltung Ihres Newsletters
- 8 WordPress-Plugins zum Erstellen eines Kontaktformulars
- Wie ein YouTube-Video in einem Popup auf Wordpress zu öffnen
Zusammenfassung
Voila! Das ist alles für dieses Tutorial. Ich hoffe, Sie können damit benutzerdefinierte Widgets in Ihrem WordPress-Blog erstellen. Wenn du hast commentaires oder Vorschläge, zögern Sie nicht, uns im reservierten Bereich zu informieren.
Sie können jedoch auch unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung oder der eine auf Divi: das beste WordPress-Theme aller Zeiten.
Aber in der Zwischenzeit Teile diesen Artikel in deinen verschiedenen sozialen Netzwerken.
...
