So erstellen Sie Ihre eigenen Basic-WordPress-Widgets

So erstellen Sie Ihre eigenen Basic-WordPress-Widgets / Wordpress & Webentwicklung

Viele Blogger suchen hoch und niedrig nach dem perfekten WordPress-Widget, das genau das tut, was sie wollen, aber mit ein wenig Programmiererfahrung können Sie feststellen, dass es einfacher ist, Ihr benutzerdefiniertes Widget zu schreiben.

In dieser Woche möchte ich Ihnen zeigen, wie genau dies getan wird. Das Widget, das wir schreiben werden, ist ein einfaches Widget, das einen zufälligen Post aus Ihrer Site heraussucht, das abgebildete Bild abruft und in der Seitenleiste anzeigt - ein visuelles Element “Schau dir das an” Widget, mit dem Benutzer mehr Inhalt auf Ihrer Website finden können.

Dies ist auch eine Erweiterung einer fortlaufenden Serie, in der ich Ihnen zeige, wie einfach es ist, Ihre WordPress-Vorlage anzupassen. 2 Neue, coole Wordpress-Plugins und das Verständnis der Wordpress-Theme-Struktur 2 Neue coole Wordpress-Plugins und das Verständnis der Wordpress-Theme-Struktur Diese Woche werde ich Werfen Sie einen Blick auf eine überlegene Alternative zum oft gelobten All-In-One-SEO. ein Plugin, mit dem Sie die Möglichkeiten eines Wordpress-Veröffentlichungssystems nutzen können, aber die Ausgabe von… Weiterlesen .

Sie können auch erfreut sein, dass wir eine neue Kategorie für WordPress-Tutorials zu MakeUseOf hinzugefügt haben. Vergewissern Sie sich, dass Sie ein ständig wachsendes Archiv mit aktuellen Tipps und Leitfäden zur weltweit beliebtesten Blogging-Plattform finden.

Schlüsselkonzepte: WordPress-Abfragen und die Schleife

Jede Seite in Ihrem Blog besteht aus einer Abfrage Ihrer Beiträge nach Datenbank. Abhängig von der angezeigten Seite ändert sich die Abfrage. Ihre Blog-Startseite kann beispielsweise die Abfrage verwenden “Holen Sie sich die neuesten 10 Blog-Beiträge“. Wenn Sie die Kategorie-Archive anzeigen, kann sich die Abfrage in ändern “Holen Sie sich die neuesten 20 Beiträge nur für die Kategorie Familienfotos. Bestellen Sie die Ergebnisse nach dem Veröffentlichungsdatum“. Jede Abfrage gibt eine Reihe von Ergebnissen zurück. Abhängig von der verwendeten Seitenvorlage wird jedes Ergebnis durch das Hauptfenster ausgeführt “Schleife” der Vorlage.

Jede Seite kann jedoch aus mehreren Abfragen bestehen. Sie können sogar eigene Abfragen erstellen, um an verschiedenen Stellen Ihrer Vorlage Funktionalität hinzuzufügen. Ein Beispiel dafür finden Sie am Ende dieses Artikels. Wir haben auf jeder Seite einige zusätzliche Abfragen, die Ihnen verwandte Artikel zeigen, an denen Sie möglicherweise interessiert sind, oder Artikel, die diese Woche aktuell sind.

Um jedoch ein benutzerdefiniertes Widget erstellen zu können, müssen Sie lediglich eine zusätzliche Abfrage erstellen, in der die Anzahl der zufälligen Beiträge sowie die Anzahl der Bilder ermittelt und in der Seitenleiste angezeigt werden. Ich habe Ihnen bereits letzte Woche den Code gezeigt, mit dem Sie das vorgestellte Bild aufnehmen können. Wie Sie Ihr Wordpress durch Hinzufügung von vorgestellten Bildern hervorheben können? Wie Sie Ihr Wordpress durch Hinzufügung von vorgestellten Bildern hervorheben können In WordPress wurden in Version 2.9 hervorgehobene Bilder eingeführt, und Sie können sie problemlos anzeigen ein Bild, das mit Ihrem Blogbeitrag in verschiedenen Teilen Ihres Designs verbunden ist. Heute möchte ich… Weiterlesen, also müssen wir nur wissen, wie man ein neues WordPress-Widget erstellt und in die Seitenleiste platziert.

Grundlegender Widget-Code

Erstellen Sie zunächst eine neue .php-Datei in Ihrem WP-Inhalt / Plugins Verzeichnis. Sie können das Lernprogramm auch offline verfolgen und dann über die WordPress-Benutzeroberfläche hochladen, aber ich finde, es ist einfacher zu schreiben, wenn Sie debuggen. Rufen Sie Ihre Akte an, wie Sie möchten, aber ich gehe mit random-post-widget.php

Fügen Sie das Folgende in die Datei ein und speichern Sie. Fühlen Sie sich frei, den Abschnitt oben mit meinem Namen darin zu ändern, aber passen Sie den Rest des Codes noch nicht an. Dies ist im Grunde ein leeres Skelett-Widget, und Sie können sehen, wo es steht // WIDGET CODE GEHT HIER Hier werden wir später unsere Funktionalität hinzufügen.

  'RandomPostWidget', 'description' => 'Zeigt einen zufälligen Beitrag mit Miniaturansicht an'); $ this-> WP_Widget ('RandomPostWidget', 'Random Post und Thumbnail', $ widget_ops);  function form ($ instance) $ instance = wp_parse_args ((array) $ instance, array ('title' => ")); $ title = $ instance ['title'];?> 

Das ist mein neues Widget!"; echo $ after_widget; add_action ('widgets_init', create_function (", 'return register_widget ("RandomPostWidget");'));?>

Das Plugin tut nicht viel, außer einen großen Titel mit den Wörtern auszudrucken “Das ist mein neues Widget!“.

Sie haben jedoch die Möglichkeit, den Titel zu ändern, was für jedes Widget unerlässlich ist. Das Hinzufügen weiterer Optionen liegt heute etwas außerhalb des Rahmens dieses Artikels. Lassen Sie uns jetzt den eigentlichen Zweck festlegen.

Eine neue Abfrage und die Schleife

Um eine neue Abfrage in Ihre Blog-Datenbank zu stellen, müssen Sie die query_posts () Funktion zusammen mit ein paar Parametern, dann durchlaufen Sie die Ausgabe mit einer while-Schleife. Lassen Sie uns dies versuchen - eine sehr einfache Abfrage und eine Schleife zum Veranschaulichen. Ersetzen Sie die folgende Codezeile:

Das ist mein neues Widget!

mit den folgenden:

 // WIDGET CODE GOES HERE query_posts ("); if (have_posts ()): while (have_posts ()): the_post (); the_title (); endwhile; endif; wp_reset_query (); 

Dies ist eine absolut grundlegende Abfrage mit Standardoptionen und einer Nullformatierung der Ausgabe. Je nachdem, wie Ihr Blog eingerichtet ist, werden höchstwahrscheinlich die 10 neuesten Beiträge verwendet. In diesem Fall wird der Titel jedes Beitrags ausgegeben. Es ist ziemlich hässlich, aber es funktioniert:

Wir können es sofort verbessern, indem wir der Ausgabe mit der HTML-Formatierung etwas hinzufügen ECHO Befehl, und erstellen Sie einen Link zum Beitrag mit get_the_permalink () Funktion:

 query_posts ("); if (have_posts ()): echo"
    "; while (have_posts ()): the_post (); echo"
  • ".get_the_title ()."
  • "; endtime; echo"
"; endif; wp_reset_query ();

Schon sieht es viel besser aus. Wir wollen aber nur einen Beitrag, der nach dem Zufallsprinzip ausgewählt wird. Dazu geben wir in der Abfrage einige Parameter an:

 query_posts ('posts_per_page = 1 & orderby = rand'); 

Natürlich können Sie es in eine beliebige Anzahl von Posts ändern. Tatsächlich gibt es eine ganze Reihe zusätzlicher Bits, die Sie in die Abfrage eingeben können, um die Reihenfolge der Ergebnisse einzuschränken, zu erweitern oder zu ändern. Bleiben wir jedoch dabei jetzt. Wenn Sie aktualisieren, sollten Sie nur einen Beitrag sehen, der bei jeder Aktualisierung zufällig ausgewählt wird.

Nun zum abgebildeten Miniaturbild. Ersetzen Sie den Code durch diesen Code, hoffentlich können Sie sehen, wo wir die Miniaturansicht packen und anzeigen:

 query_posts ('posts_per_page = 1 & orderby = rand'); if (have_posts ()): echo "
    "; while (have_posts ()): the_post (); echo"
  • ".get_the_title (); echo the_post_thumbnail (array (220.200)); echo"
  • "; endtime; echo"
"; endif; wp_reset_query ();

Sie können die fertigen Ergebnisse in meinem Entwicklungsblog "Self Sufficiency Guide" erneut sehen, obwohl ich die Dinge möglicherweise schon verschoben habe, wenn Sie dies lesen.

Fazit:

Sehen Sie, wie einfach es ist, ein eigenes Widget zu erstellen, das genau das macht, was Sie wollen? Selbst wenn Sie 90% des Codes, den ich Ihnen heute gezeigt habe, nicht verstehen, sollten Sie ihn dennoch anpassen können, indem Sie lediglich Variablen ändern oder anderes HTML ausgeben. Wir haben heute ein ganzes Widget geschrieben, aber Sie könnten einfach den neuen Abfrage- und Schleifencode in Ihren Seitenvorlagen verwenden.

Probleme Benötigen Sie eine andere WordPress-bezogene Hilfe? In MakeUseOf Answers stehe ich Ihnen gerne zur Verfügung. Schreiben Sie also eine neue Frage dazu.

Erfahren Sie mehr über: Bloggen, Programmieren, Wordpress.